@font-face {
    font-family: 'ChromeYellow';
    src: url('../fonts/chromeyellow/CHROY___.TTF') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

:root {
    --bg-main: #FFFFFF;
    --bg-surface: #F8FAFC;
    --bg-surface-elevated: #F1F5F9;
    --bg-card: #FFFFFF;
    --border-color: #E2E8F0;
    --border-hover: rgba(239, 68, 68, 0.4);

    /* Logo Derived Colors */
    --tech-red: #EF4444;
    --tech-orange: #F97316;
    --tech-green: #10B981;
    --tech-blue: #2563EB;
    --tech-navy: #0F172A;

    /* Gradients */
    --gradient-brand: linear-gradient(135deg, #EF4444 0%, #F97316 50%, #10B981 100%);
    --gradient-glow: linear-gradient(135deg, rgba(239, 68, 68, 0.08) 0%, rgba(249, 115, 22, 0.06) 50%, rgba(16, 185, 129, 0.08) 100%);
    --gradient-card: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%);
    
    /* Text - Crisp High Contrast Dark on White */
    --text-main: #0F172A;
    --text-muted: #475569;
    --text-dim: #64748B;
    
    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 20px;
    --radius-full: 9999px;
    
    --shadow-subtle: 0 4px 20px rgba(15, 23, 42, 0.05);
    --shadow-card: 0 10px 30px rgba(15, 23, 42, 0.06);
    --shadow-glow: 0 10px 30px rgba(239, 68, 68, 0.12);
    --shadow-green-glow: 0 10px 30px rgba(16, 185, 129, 0.14);
    
    --transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    background-color: var(--bg-main);
    color: var(--text-main);
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    line-height: 1.6;
    overflow-x: hidden;
    position: relative;
}

/* Background Subtle Gradient Accents */
body::before {
    content: '';
    position: fixed;
    top: -150px;
    left: 20%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(239, 68, 68, 0.05) 0%, rgba(249, 115, 22, 0.03) 50%, transparent 70%);
    pointer-events: none;
    z-index: 0;
    filter: blur(80px);
}

body::after {
    content: '';
    position: fixed;
    bottom: -150px;
    right: 15%;
    width: 700px;
    height: 700px;
    background: radial-gradient(circle, rgba(16, 185, 129, 0.04) 0%, rgba(37, 99, 235, 0.03) 50%, transparent 70%);
    pointer-events: none;
    z-index: 0;
    filter: blur(90px);
}

.main-content {
    position: relative;
    z-index: 1;
}

/* Containers */
.container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 24px;
}

.container-fluid {
    width: 100%;
    padding: 0 24px;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    color: #0F172A;
    line-height: 1.25;
}

.text-gradient {
    background: var(--gradient-brand);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.text-orange {
    color: var(--tech-orange);
}

.text-green {
    color: var(--tech-green);
}

.text-red {
    color: var(--tech-red);
}

.text-muted {
    color: var(--text-muted);
}

.text-center {
    text-align: center;
}

/* Header & Sticky Navbar */
.site-header {
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 1000;
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-bottom: 1px solid var(--border-color);
    transition: var(--transition);
}

.site-header.scrolled {
    box-shadow: 0 10px 25px rgba(15, 23, 42, 0.06);
    background: #FFFFFF;
}

.navbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 80px;
}

.navbar-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    color: #0F172A;
}

.navbar-brand img {
    height: 46px;
    width: auto;
    object-fit: contain;
}

.brand-title {
    font-family: 'ChromeYellow', 'Plus Jakarta Sans', sans-serif;
    font-size: 1.7rem;
    font-weight: normal;
    letter-spacing: 0.5px;
    color: #0F172A;
    line-height: 1;
}

.brand-title span {
    font-family: 'ChromeYellow', 'Plus Jakarta Sans', sans-serif;
    color: var(--tech-red);
    background: var(--gradient-brand);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.font-chromeyellow {
    font-family: 'ChromeYellow', 'Plus Jakarta Sans', sans-serif !important;
}

.nav-links {
    display: flex;
    align-items: center;
    gap: 32px;
    list-style: none;
}

.nav-link {
    color: #334155;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.95rem;
    position: relative;
    padding: 8px 0;
    transition: var(--transition);
}

.nav-link:hover, .nav-link.active {
    color: var(--tech-red);
}

.nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: var(--gradient-brand);
    transition: var(--transition);
}

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

/* Dropdown Menu */
.nav-item-dropdown {
    position: relative;
}

.dropdown-toggle {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: -20px;
    width: 290px;
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: 12px;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.1);
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: var(--transition);
    z-index: 1010;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.nav-item-dropdown:hover .dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dropdown-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    color: #334155;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 600;
    border-radius: var(--radius-sm);
    transition: var(--transition);
}

.dropdown-item i {
    color: var(--tech-orange);
    font-size: 1rem;
    width: 20px;
    text-align: center;
}

.dropdown-item:hover {
    background: #F8FAFC;
    color: var(--tech-red);
    transform: translateX(4px);
}

.dropdown-item:hover i {
    color: var(--tech-red);
}

/* Buttons */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px 26px;
    font-size: 0.95rem;
    font-weight: 600;
    border-radius: var(--radius-full);
    text-decoration: none;
    cursor: pointer;
    border: none;
    transition: var(--transition);
}

.btn-primary {
    background: var(--gradient-brand);
    color: #FFFFFF;
    box-shadow: 0 4px 15px rgba(239, 68, 68, 0.28);
}

.btn-primary:hover {
    box-shadow: 0 6px 24px rgba(249, 115, 22, 0.38);
    transform: translateY(-2px);
    color: #FFFFFF;
}

.btn-outline {
    background: #FFFFFF;
    color: #0F172A;
    border: 1px solid var(--border-color);
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

.btn-outline:hover {
    background: #F8FAFC;
    border-color: var(--tech-orange);
    color: var(--tech-red);
    transform: translateY(-2px);
}

.btn-whatsapp {
    background: #25D366;
    color: #FFFFFF;
    box-shadow: 0 4px 15px rgba(37, 211, 102, 0.35);
}

.btn-whatsapp:hover {
    background: #20BD5A;
    color: #FFFFFF;
    box-shadow: 0 6px 22px rgba(37, 211, 102, 0.45);
    transform: translateY(-2px);
}

.btn-sm {
    padding: 8px 18px;
    font-size: 0.85rem;
}

.btn-lg {
    padding: 15px 34px;
    font-size: 1.05rem;
}

/* Mobile Toggle */
.mobile-toggle {
    display: none;
    background: transparent;
    border: none;
    color: #0F172A;
    font-size: 1.5rem;
    cursor: pointer;
}

/* Announcement Ticker / Continuous Marquee */
.ticker-section {
    background: #F8FAFC;
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
    overflow: hidden;
    padding: 14px 0;
    position: relative;
}

.ticker-track {
    display: flex;
    gap: 40px;
    width: max-content;
    animation: marquee 35s linear infinite;
}

.ticker-track:hover {
    animation-play-state: paused;
}

.ticker-item {
    display: flex;
    align-items: center;
    gap: 16px;
    color: #475569;
    font-size: 0.95rem;
    font-weight: 500;
    white-space: nowrap;
}

.ticker-item .dot {
    width: 8px;
    height: 8px;
    background: var(--tech-orange);
    border-radius: 50%;
    display: inline-block;
}

.ticker-item .highlight {
    color: #0F172A;
    font-weight: 700;
}

@keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* Section Common Styles */
.section {
    padding: 90px 0;
    position: relative;
}

.section-sm {
    padding: 60px 0;
}

.section-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(239, 68, 68, 0.08);
    color: var(--tech-red);
    border: 1px solid rgba(239, 68, 68, 0.2);
    padding: 6px 16px;
    border-radius: var(--radius-full);
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 16px;
}

.section-tag.green {
    background: rgba(16, 185, 129, 0.08);
    color: var(--tech-green);
    border-color: rgba(16, 185, 129, 0.2);
}

.section-tag.orange {
    background: rgba(249, 115, 22, 0.08);
    color: var(--tech-orange);
    border-color: rgba(249, 115, 22, 0.2);
}

.section-title {
    font-size: 2.6rem;
    font-weight: 800;
    margin-bottom: 20px;
    letter-spacing: -0.5px;
    color: #0F172A;
}

.section-desc {
    color: var(--text-muted);
    font-size: 1.1rem;
    max-width: 650px;
    margin-bottom: 40px;
    line-height: 1.7;
}

.section-desc.mx-auto {
    margin-left: auto;
    margin-right: auto;
}

/* Hero Section */
.hero-section {
    padding: 70px 0 90px;
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%);
}

.hero-grid {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    align-items: center;
    gap: 60px;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    padding: 8px 18px;
    border-radius: var(--radius-full);
    font-size: 0.9rem;
    font-weight: 600;
    color: #334155;
    margin-bottom: 24px;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

.hero-badge .pulse {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--tech-green);
    box-shadow: 0 0 10px var(--tech-green);
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7); }
    70% { transform: scale(1); box-shadow: 0 0 0 10px rgba(16, 185, 129, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}

.hero-title {
    font-size: 3.4rem;
    font-weight: 800;
    line-height: 1.15;
    margin-bottom: 24px;
    letter-spacing: -1px;
    color: #0F172A;
}

.hero-subtitle {
    font-size: 1.2rem;
    color: var(--text-muted);
    line-height: 1.7;
    margin-bottom: 36px;
    max-width: 580px;
}

.hero-actions {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 40px;
    flex-wrap: wrap;
}

.hero-social-proof {
    display: flex;
    align-items: center;
    gap: 20px;
    padding-top: 24px;
    border-top: 1px solid var(--border-color);
}

.proof-avatars {
    display: flex;
}

.proof-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 2px solid #FFFFFF;
    margin-left: -12px;
    object-fit: cover;
    background: #F1F5F9;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}

.proof-avatar:first-child {
    margin-left: 0;
}

.proof-text strong {
    display: block;
    color: #0F172A;
    font-size: 0.95rem;
}

.proof-text .stars {
    color: #F59E0B;
    font-size: 0.85rem;
}

.proof-text span {
    font-size: 0.85rem;
    color: var(--text-muted);
}

.hero-visual {
    position: relative;
}

.hero-card-preview {
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 24px;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
    position: relative;
}

.hero-illustration {
    width: 100%;
    height: auto;
    border-radius: var(--radius-md);
    display: block;
}

/* Floating Badges */
.floating-stat-badge {
    position: absolute;
    bottom: -20px;
    left: -20px;
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    padding: 16px 22px;
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    gap: 16px;
    box-shadow: 0 15px 35px rgba(15, 23, 42, 0.1);
    z-index: 2;
}

.badge-icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(16, 185, 129, 0.12);
    color: var(--tech-green);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
}

.badge-info h4 {
    font-size: 1.15rem;
    font-weight: 800;
    color: #0F172A;
}

.badge-info p {
    font-size: 0.8rem;
    color: var(--text-muted);
}

/* About Preview Grid */
.about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.about-features-list {
    list-style: none;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 28px;
    margin-bottom: 32px;
}

.about-feature-item {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.95rem;
    font-weight: 600;
    color: #1E293B;
}

.check-icon {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: rgba(239, 68, 68, 0.1);
    color: var(--tech-red);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    flex-shrink: 0;
}

.experience-box {
    background: var(--gradient-brand);
    border-radius: var(--radius-md);
    padding: 24px 32px;
    display: inline-flex;
    align-items: center;
    gap: 20px;
    color: #FFFFFF;
    margin-top: 10px;
    box-shadow: 0 10px 25px rgba(239, 68, 68, 0.25);
}

.experience-box .number {
    font-size: 3.5rem;
    font-weight: 900;
    line-height: 1;
}

.experience-box .text {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.3;
}

/* Core Services Grid */
.services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.services-grid-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
}

@media (max-width: 992px) {
    .services-grid-2 {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

.service-card {
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 36px 30px;
    transition: var(--transition);
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 4px 15px rgba(15, 23, 42, 0.03);
}

.service-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--gradient-brand);
    opacity: 0;
    transition: var(--transition);
}

.service-card:hover {
    transform: translateY(-8px);
    border-color: rgba(239, 68, 68, 0.35);
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.08);
}

.service-card:hover::before {
    opacity: 1;
}

.service-icon-box {
    width: 64px;
    height: 64px;
    border-radius: var(--radius-md);
    background: #F8FAFC;
    border: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.7rem;
    color: var(--tech-orange);
    margin-bottom: 24px;
    transition: var(--transition);
}

.service-card:hover .service-icon-box {
    background: var(--gradient-brand);
    color: #FFFFFF;
    transform: scale(1.06);
}

.service-card h3 {
    font-size: 1.35rem;
    margin-bottom: 14px;
    color: #0F172A;
}

.service-card p {
    color: var(--text-muted);
    font-size: 0.95rem;
    line-height: 1.6;
    margin-bottom: 24px;
}

.service-card-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--tech-orange);
    font-weight: 700;
    font-size: 0.9rem;
    text-decoration: none;
    transition: var(--transition);
}

.service-card-link:hover {
    color: var(--tech-red);
    gap: 12px;
}

/* Multi-Step Interactive Quote Form */
.quote-section {
    background: linear-gradient(180deg, #F8FAFC 0%, #F1F5F9 100%);
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
}

.quote-card {
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 44px;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.06);
}

.quote-grid {
    display: grid;
    grid-template-columns: 1fr 1.25fr;
    gap: 60px;
    align-items: center;
}

.form-steps-indicator {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 30px;
}

.step-indicator {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-dim);
}

.step-indicator.active {
    color: var(--tech-red);
}

.step-indicator.completed {
    color: var(--tech-green);
}

.step-number {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #F1F5F9;
    border: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    color: #475569;
}

.step-indicator.active .step-number {
    background: var(--tech-red);
    color: #FFFFFF;
    border-color: var(--tech-red);
}

.step-indicator.completed .step-number {
    background: var(--tech-green);
    color: #FFFFFF;
    border-color: var(--tech-green);
}

.step-separator {
    flex: 1;
    height: 2px;
    background: #E2E8F0;
}

.form-group {
    margin-bottom: 20px;
}

.form-label {
    display: block;
    font-size: 0.85rem;
    font-weight: 700;
    color: #1E293B;
    margin-bottom: 8px;
}

.form-control {
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #CBD5E1;
    border-radius: var(--radius-sm);
    padding: 14px 18px;
    color: #0F172A;
    font-size: 0.95rem;
    font-family: inherit;
    transition: var(--transition);
}

.form-control:focus {
    outline: none;
    border-color: var(--tech-orange);
    box-shadow: 0 0 10px rgba(249, 115, 22, 0.15);
}

.form-control::placeholder {
    color: #94A3B8;
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.form-hint {
    font-size: 0.8rem;
    color: var(--text-dim);
    margin-top: 6px;
}

/* Why Choose Us / Features */
.why-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.why-card {
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: 32px 24px;
    transition: var(--transition);
    text-align: center;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.03);
}

.why-card:hover {
    transform: translateY(-6px);
    border-color: rgba(249, 115, 22, 0.35);
    box-shadow: 0 15px 35px rgba(15, 23, 42, 0.07);
}

.why-icon {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(249, 115, 22, 0.1);
    color: var(--tech-orange);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    margin: 0 auto 20px;
}

.why-card h4 {
    font-size: 1.15rem;
    margin-bottom: 12px;
    color: #0F172A;
}

.why-card p {
    font-size: 0.9rem;
    color: var(--text-muted);
}

/* Testimonials Carousel & Cards */
.testimonials-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.testimonial-card {
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 36px 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: var(--transition);
    position: relative;
    box-shadow: 0 4px 15px rgba(15, 23, 42, 0.03);
}

.testimonial-card:hover {
    border-color: rgba(16, 185, 129, 0.35);
    transform: translateY(-6px);
    box-shadow: 0 15px 35px rgba(16, 185, 129, 0.1);
}

.quote-mark {
    font-size: 2.2rem;
    color: rgba(239, 68, 68, 0.2);
    line-height: 1;
    margin-bottom: 14px;
}

.testimonial-text {
    font-size: 0.95rem;
    color: #334155;
    line-height: 1.7;
    margin-bottom: 24px;
    font-style: italic;
}

.testimonial-author {
    display: flex;
    align-items: center;
    gap: 14px;
    padding-top: 18px;
    border-top: 1px solid var(--border-color);
}

.author-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    background: #F1F5F9;
    border: 2px solid var(--border-color);
}

.author-info h5 {
    font-size: 1rem;
    margin-bottom: 2px;
    color: #0F172A;
}

.author-info p {
    font-size: 0.8rem;
    color: var(--text-muted);
}

/* Portfolio / Our Work Grid */
.portfolio-filters {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    margin-bottom: 44px;
    flex-wrap: wrap;
}

.filter-btn {
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    color: #475569;
    padding: 8px 22px;
    border-radius: var(--radius-full);
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
}

.filter-btn:hover, .filter-btn.active {
    background: var(--gradient-brand);
    color: #FFFFFF;
    border-color: transparent;
    box-shadow: 0 4px 15px rgba(239, 68, 68, 0.25);
}

.portfolio-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.portfolio-card {
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: var(--transition);
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 15px rgba(15, 23, 42, 0.03);
}

.portfolio-card:hover {
    transform: translateY(-8px);
    border-color: rgba(249, 115, 22, 0.4);
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.08);
}

.portfolio-img-wrap {
    position: relative;
    overflow: hidden;
    height: 230px;
}

.portfolio-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.portfolio-card:hover .portfolio-img {
    transform: scale(1.06);
}

.portfolio-category-badge {
    position: absolute;
    top: 16px;
    left: 16px;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(8px);
    border: 1px solid var(--border-color);
    padding: 4px 12px;
    border-radius: var(--radius-full);
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--tech-orange);
}

.portfolio-content {
    padding: 24px;
    display: flex;
    flex-direction: column;
    flex: 1;
    justify-content: space-between;
}

.portfolio-content h3 {
    font-size: 1.25rem;
    margin-bottom: 10px;
    color: #0F172A;
}

.portfolio-content p {
    font-size: 0.9rem;
    color: var(--text-muted);
    margin-bottom: 20px;
}

.portfolio-tags {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.portfolio-tag {
    background: #F1F5F9;
    border-radius: var(--radius-sm);
    padding: 4px 10px;
    font-size: 0.75rem;
    color: #475569;
    font-weight: 600;
}

.portfolio-metrics {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--tech-green);
    padding-top: 14px;
    border-top: 1px solid var(--border-color);
}

/* Stats Section */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.stat-box {
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: 32px 24px;
    text-align: center;
    transition: var(--transition);
    box-shadow: 0 4px 15px rgba(15, 23, 42, 0.03);
}

.stat-box:hover {
    border-color: rgba(239, 68, 68, 0.3);
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
}

.stat-number {
    font-size: 3rem;
    font-weight: 800;
    background: var(--gradient-brand);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1.1;
    margin-bottom: 8px;
}

.stat-label {
    font-size: 0.95rem;
    color: var(--text-muted);
    font-weight: 600;
}

/* Call to Action Banner */
.cta-banner {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.06) 0%, rgba(249, 115, 22, 0.05) 50%, rgba(16, 185, 129, 0.06) 100%);
    border: 1px solid rgba(239, 68, 68, 0.2);
    border-radius: var(--radius-lg);
    padding: 60px 50px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.cta-banner h2 {
    font-size: 2.5rem;
    margin-bottom: 16px;
    color: #0F172A;
}

.cta-banner p {
    font-size: 1.15rem;
    color: var(--text-muted);
    max-width: 600px;
    margin: 0 auto 32px;
}

/* Footer (Crisp Light Theme with Slate Border) */
.site-footer {
    background: #F8FAFC;
    border-top: 1px solid var(--border-color);
    padding: 80px 0 30px;
    position: relative;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1.3fr;
    gap: 48px;
    margin-bottom: 60px;
}

.footer-brand p {
    color: var(--text-muted);
    font-size: 0.95rem;
    margin-top: 18px;
    margin-bottom: 24px;
    max-width: 320px;
    line-height: 1.7;
}

.footer-social-links {
    display: flex;
    gap: 12px;
}

.social-icon-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    color: #475569;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: var(--transition);
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.04);
}

.social-icon-btn:hover {
    background: var(--gradient-brand);
    color: #FFFFFF;
    border-color: transparent;
    transform: translateY(-3px);
}

.footer-column h4 {
    font-size: 1.1rem;
    margin-bottom: 22px;
    color: #0F172A;
    position: relative;
    padding-bottom: 10px;
}

.footer-column h4::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 28px;
    height: 2px;
    background: var(--gradient-brand);
}

.footer-links-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.footer-links-list a {
    color: var(--text-muted);
    text-decoration: none;
    font-size: 0.9rem;
    transition: var(--transition);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
}

.footer-links-list a:hover {
    color: var(--tech-red);
    transform: translateX(4px);
}

.footer-contact-item {
    display: flex;
    gap: 14px;
    color: var(--text-muted);
    font-size: 0.9rem;
    margin-bottom: 16px;
    align-items: flex-start;
}

.footer-contact-item i {
    color: var(--tech-orange);
    font-size: 1.1rem;
    margin-top: 4px;
    flex-shrink: 0;
}

.footer-bottom {
    padding-top: 30px;
    border-top: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.85rem;
    color: var(--text-dim);
    flex-wrap: wrap;
    gap: 16px;
}

/* Floating WhatsApp Button */
.floating-whatsapp {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 1500;
    background: #25D366;
    color: #FFFFFF;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.9rem;
    box-shadow: 0 8px 25px rgba(37, 211, 102, 0.4);
    text-decoration: none;
    transition: var(--transition);
}

.floating-whatsapp:hover {
    transform: scale(1.1);
    color: #FFFFFF;
    box-shadow: 0 12px 30px rgba(37, 211, 102, 0.55);
}

/* Visibility Utility Classes */
.d-none-mobile {
    display: flex;
}

.d-none-tablet {
    display: inline-flex;
}

.d-none-mobile-small {
    display: inline;
}

@media (max-width: 992px) {
    .d-none-tablet {
        display: none !important;
    }
}

@media (max-width: 768px) {
    .d-none-mobile {
        display: none !important;
    }
}

@media (max-width: 480px) {
    .d-none-mobile-small {
        display: none !important;
    }
}

/* Toast Alert Notification */
.toast-container {
    position: fixed;
    bottom: 24px;
    left: 24px;
    z-index: 2000;
    max-width: 420px;
}

.toast {
    background: #FFFFFF;
    border: 1px solid var(--tech-green);
    border-radius: var(--radius-md);
    padding: 16px 20px;
    box-shadow: 0 15px 35px rgba(15, 23, 42, 0.1);
    display: flex;
    align-items: flex-start;
    gap: 14px;
    color: #0F172A;
    animation: slideIn 0.3s ease;
}

@keyframes slideIn {
    from { transform: translateX(-100%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

.toast-icon {
    color: var(--tech-green);
    font-size: 1.25rem;
}

.toast-body h5 {
    font-size: 0.95rem;
    margin-bottom: 4px;
    color: #0F172A;
}

.toast-body p {
    font-size: 0.85rem;
    color: var(--text-muted);
}

.toast-close {
    background: transparent;
    border: none;
    color: var(--text-muted);
    cursor: pointer;
    font-size: 1rem;
    margin-left: auto;
}

/* ==========================================================================
   LAYOUT HELPER CLASSES & COMPONENT GRIDS
   ========================================================================== */
.two-col-layout {
    display: grid;
    grid-template-columns: 1fr 1.3fr;
    gap: 50px;
    align-items: flex-start;
}

.two-col-sidebar-layout {
    display: grid;
    grid-template-columns: 1.25fr 0.75fr;
    gap: 50px;
    align-items: flex-start;
}

.featured-solution-card {
    background: #FFFFFF;
    border: 2px solid rgba(239, 68, 68, 0.22);
    border-radius: var(--radius-lg);
    padding: 44px;
    margin-bottom: 40px;
    box-shadow: 0 15px 40px rgba(15, 23, 42, 0.08);
    position: relative;
    overflow: hidden;
}

.featured-badge-pill {
    position: absolute;
    top: 0;
    right: 0;
    background: var(--gradient-brand);
    color: #FFFFFF;
    font-size: 0.8rem;
    font-weight: 800;
    padding: 6px 20px;
    border-bottom-left-radius: 12px;
    letter-spacing: 1px;
}

.featured-solution-grid {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: 40px;
    align-items: center;
}

.feature-subgrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 28px;
}

.feature-subcard {
    background: #F8FAFC;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: 16px 18px;
    transition: var(--transition);
}

.feature-subcard:hover {
    border-color: rgba(239, 68, 68, 0.3);
    background: #FFFFFF;
    transform: translateY(-2px);
    box-shadow: var(--shadow-subtle);
}

.enterprise-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.grid-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.team-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 24px;
    max-width: 1200px;
    margin: 0 auto;
}

.team-card {
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 28px 20px;
    text-align: center;
    box-shadow: var(--shadow-subtle);
    transition: var(--transition);
}

.team-card:hover {
    transform: translateY(-5px);
    border-color: rgba(239, 68, 68, 0.35);
    box-shadow: var(--shadow-card);
}

.team-avatar {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    margin: 0 auto 16px;
    background: linear-gradient(135deg, rgba(239,68,68,0.1) 0%, rgba(249,115,22,0.15) 100%);
    border: 2px solid rgba(239,68,68,0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--tech-red);
}

.flyer-grid {
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 24px;
    align-items: center;
    margin-bottom: 24px;
}

/* ==========================================================================
   MOBILE DRAWER
   ========================================================================== */
.mobile-drawer {
    position: fixed;
    top: 0;
    right: -100%;
    width: 320px;
    max-width: 85vw;
    height: 100vh;
    background: #FFFFFF;
    z-index: 1050;
    padding: 26px 22px;
    box-shadow: -10px 0 35px rgba(15, 23, 42, 0.18);
    transition: right 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow-y: auto;
}

.mobile-drawer.open {
    right: 0;
}

.drawer-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--border-color);
}

.drawer-close {
    background: #F1F5F9;
    border: none;
    color: #0F172A;
    font-size: 1.25rem;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--transition);
}

.drawer-close:hover {
    background: var(--tech-red);
    color: #FFFFFF;
}

.mobile-nav-links {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.mobile-nav-link {
    color: #334155;
    text-decoration: none;
    font-size: 1.05rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
}

.mobile-nav-link:hover, .mobile-nav-link.active {
    background: rgba(239, 68, 68, 0.08);
    color: var(--tech-red);
}

.drawer-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    z-index: 1040;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.drawer-backdrop.open {
    opacity: 1;
    visibility: visible;
}

/* ==========================================================================
   WEBIFY-STYLE ANIMATED HERO SLIDER
   ========================================================================== */
.webify-hero-slider-section {
    position: relative;
    padding: 30px 0 20px 0;
    overflow: hidden;
    background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%);
    border-bottom: 1px solid var(--border-color);
}

.webify-slider-container {
    position: relative;
    min-height: 560px;
    display: flex;
    align-items: center;
    touch-action: pan-y;
}

.webify-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1), transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
    transform: translateX(40px);
    display: flex;
    align-items: center;
    pointer-events: none;
    z-index: 1;
}

.webify-slide.active {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
    position: relative;
    pointer-events: auto;
    z-index: 2;
}

.slider-meta-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    gap: 12px;
}

.webify-slide.active .hero-badge {
    animation: webifyFadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.05s both;
}

.webify-slide.active .hero-title {
    animation: webifyFadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.15s both;
}

.webify-slide.active .hero-subtitle {
    animation: webifyFadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.25s both;
}

.webify-slide.active .hero-feature-tags {
    animation: webifyFadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.35s both;
}

.webify-slide.active .hero-actions {
    animation: webifyFadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.45s both;
}

.webify-slide.active .hero-social-proof {
    animation: webifyFadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.55s both;
}

.webify-slide.active .hero-visual {
    animation: webifyZoomIn 0.75s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both;
}

@keyframes webifyFadeUp {
    0% {
        opacity: 0;
        transform: translateY(25px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes webifyZoomIn {
    0% {
        opacity: 0;
        transform: scale(0.92) translateY(15px);
    }
    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.hero-feature-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 30px;
}

.hero-feature-tag-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    padding: 7px 14px;
    border-radius: var(--radius-sm);
    font-size: 0.85rem;
    font-weight: 600;
    color: #334155;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.03);
}

.slide-number-indicator {
    font-family: 'Space Grotesk', monospace, sans-serif;
    font-size: 0.95rem;
    font-weight: 800;
    color: var(--tech-red);
    background: rgba(239, 68, 68, 0.08);
    border: 1px solid rgba(239, 68, 68, 0.2);
    padding: 4px 14px;
    border-radius: 9999px;
    letter-spacing: 1px;
}

.webify-slider-nav-tabs {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
    margin-top: 36px;
    padding-top: 24px;
    border-top: 1px solid var(--border-color);
}

.webify-tab-btn {
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: 16px 18px;
    cursor: pointer;
    text-align: left;
    transition: all 0.3s ease;
    box-shadow: var(--shadow-subtle);
    position: relative;
    overflow: hidden;
}

.webify-tab-btn:hover {
    border-color: var(--tech-red);
    transform: translateY(-2px);
    box-shadow: var(--shadow-card);
}

.webify-tab-btn.active {
    border-color: var(--tech-red);
    background: #FFFFFF;
    box-shadow: 0 8px 25px rgba(239, 68, 68, 0.12);
}

.webify-tab-btn .tab-num {
    font-size: 0.78rem;
    font-weight: 800;
    color: var(--tech-orange);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: block;
    margin-bottom: 4px;
}

.webify-tab-btn .tab-title {
    font-size: 0.92rem;
    font-weight: 700;
    color: #0F172A;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.webify-tab-btn.active .tab-title {
    color: var(--tech-red);
}

.webify-tab-progress {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 3px;
    width: 0%;
    background: var(--gradient-brand);
    transition: width 0.1s linear;
}

.webify-tab-btn.active .webify-tab-progress {
    width: 100%;
}

.webify-arrow-btn {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    color: #0F172A;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 1.1rem;
    box-shadow: 0 4px 15px rgba(15, 23, 42, 0.08);
    transition: var(--transition);
}

.webify-arrow-btn:hover {
    background: var(--tech-red);
    color: #FFFFFF;
    border-color: var(--tech-red);
    transform: scale(1.08);
    box-shadow: 0 8px 25px rgba(239, 68, 68, 0.3);
}

.webify-slider-controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
}

.webify-slider-arrows-wrap {
    display: flex;
    gap: 10px;
}

/* ==========================================================================
   COMPREHENSIVE RESPONSIVE MEDIA QUERIES
   ========================================================================== */

/* 1. Large Laptops / Small Desktops (<= 1200px) */
@media (max-width: 1200px) {
    .container {
        max-width: 100%;
        padding: 0 20px;
    }

    .hero-title {
        font-size: 3rem;
    }

    .nav-links {
        gap: 22px;
    }

    .nav-link {
        font-size: 0.9rem;
    }

    .enterprise-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .grid-4 {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* 2. Tablets & Small Laptops (<= 992px) */
@media (max-width: 992px) {
    .nav-links {
        display: none;
    }

    .mobile-toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
        border-radius: var(--radius-sm);
        border: 1px solid var(--border-color);
        background: #FFFFFF;
    }

    .hero-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .hero-visual {
        max-width: 520px;
        margin: 0 auto;
        width: 100%;
    }

    .featured-solution-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .two-col-layout {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .two-col-sidebar-layout {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .about-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .quote-grid {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .services-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .testimonials-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .portfolio-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .why-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .grid-3 {
        grid-template-columns: repeat(2, 1fr);
    }

    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }

    .footer-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 36px;
    }

    .webify-slider-nav-tabs {
        grid-template-columns: repeat(3, 1fr);
        gap: 12px;
    }

    .flyer-grid {
        grid-template-columns: 1fr;
    }
}

/* 3. Mobile Devices / Phablets (<= 768px) */
@media (max-width: 768px) {
    .section {
        padding: 60px 0;
    }

    .section-sm {
        padding: 40px 0;
    }

    .navbar {
        height: 70px;
    }

    .brand-title {
        font-size: 1.45rem;
    }

    .navbar-brand img {
        height: 38px;
    }

    .hero-title {
        font-size: 2.2rem;
        letter-spacing: -0.5px;
    }

    .section-title {
        font-size: 2rem;
    }

    .hero-subtitle {
        font-size: 1.05rem;
    }

    .hero-actions {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .hero-actions .btn {
        width: 100%;
    }

    .floating-stat-badge {
        position: relative;
        bottom: auto;
        left: auto;
        margin-top: 14px;
        width: 100%;
    }

    .featured-solution-card {
        padding: 28px 20px;
    }

    .feature-subgrid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .enterprise-grid {
        grid-template-columns: 1fr;
    }

    .grid-4 {
        grid-template-columns: 1fr;
    }

    .grid-3 {
        grid-template-columns: 1fr;
    }

    .services-grid {
        grid-template-columns: 1fr;
    }

    .testimonials-grid {
        grid-template-columns: 1fr;
    }

    .portfolio-grid {
        grid-template-columns: 1fr;
    }

    .why-grid {
        grid-template-columns: 1fr;
    }

    .form-row {
        grid-template-columns: 1fr;
    }

    .quote-card {
        padding: 28px 20px;
    }

    .cta-banner {
        padding: 40px 24px;
    }

    .cta-banner h2 {
        font-size: 1.85rem;
    }

    .footer-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .footer-bottom {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 14px;
    }

    .webify-slider-nav-tabs {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .webify-tab-btn {
        padding: 12px 14px;
    }

    .about-features-list {
        grid-template-columns: 1fr;
    }

    .floating-whatsapp {
        width: 52px;
        height: 52px;
        font-size: 1.6rem;
        bottom: 18px;
        right: 18px;
    }

    .toast-container {
        left: 14px;
        right: 14px;
        max-width: 100%;
        bottom: 80px;
    }
}

/* 4. Small Mobile Devices (<= 480px) */
@media (max-width: 480px) {
    .container {
        padding: 0 16px;
    }

    .brand-title {
        font-size: 1.3rem;
    }

    .hero-title {
        font-size: 1.85rem;
    }

    .section-title {
        font-size: 1.65rem;
    }

    .section-desc {
        font-size: 0.95rem;
    }

    .hero-feature-tags {
        gap: 6px;
    }

    .hero-feature-tag-item {
        font-size: 0.78rem;
        padding: 5px 10px;
    }

    .proof-text strong {
        font-size: 0.85rem;
    }

    .proof-text .stars {
        font-size: 0.75rem;
    }

    .service-card {
        padding: 24px 18px;
    }

    .why-card {
        padding: 24px 18px;
    }

    .testimonial-card {
        padding: 24px 18px;
    }

    .btn-lg {
        padding: 12px 20px;
        font-size: 0.95rem;
    }

    .stats-grid {
        grid-template-columns: 1fr;
    }

    .stat-number {
        font-size: 2.4rem;
    }

    .experience-box {
        padding: 16px 20px;
        gap: 14px;
    }

    .experience-box .number {
        font-size: 2.6rem;
    }
}


/* =========================================================
   TECH TRACK HOMEPAGE V2 - RESPONSIVE CORPORATE REDESIGN
   ========================================================= */
:root{--tt-blue:#1769ff;--tt-blue-dark:#0c4ec8;--tt-navy:#071b3a;--tt-ink:#0c1b36;--tt-muted:#61708a;--tt-border:#e6edf7;--tt-soft:#f5f9ff;--tt-green:#20b978;--tt-purple:#8067ee;--tt-orange:#f47a36}
body{background:#fff;color:var(--tt-ink)}
.container{max-width:1320px}
.site-header.tt-header{background:rgba(255,255,255,.96);border-bottom:1px solid #edf2f8;box-shadow:0 4px 20px rgba(16,36,72,.04)}
.tt-navbar{height:76px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.tt-brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--tt-navy);min-width:max-content}.tt-brand img{width:58px;height:58px;object-fit:contain}.tt-brand>span{display:flex;flex-direction:column;line-height:1}.tt-brand strong{font-size:1.45rem;letter-spacing:-.6px}.tt-brand small{font-size:.43rem;letter-spacing:.6px;font-weight:800;margin-top:6px;color:#687790}
.tt-nav-links{display:flex;align-items:center;gap:27px;list-style:none;margin:0}.tt-nav-links a{color:#182943;text-decoration:none;font-size:.89rem;font-weight:600;position:relative;padding:27px 0;white-space:nowrap}.tt-nav-links a:hover,.tt-nav-links a.active{color:var(--tt-blue)}.tt-nav-links a.active:after{content:"";position:absolute;left:0;right:0;bottom:15px;height:2px;background:var(--tt-blue);border-radius:2px}.tt-nav-dropdown{position:relative}.tt-nav-dropdown>a{display:flex;gap:7px;align-items:center}.tt-nav-dropdown>a i{font-size:.62rem}.tt-dropdown{position:absolute;top:66px;left:-16px;width:255px;background:#fff;border:1px solid var(--tt-border);box-shadow:0 20px 50px rgba(10,32,70,.12);border-radius:14px;padding:9px;opacity:0;visibility:hidden;transform:translateY(7px);transition:.2s}.tt-nav-dropdown:hover .tt-dropdown{opacity:1;visibility:visible;transform:none}.tt-dropdown a{display:flex;gap:10px;align-items:center;padding:11px 12px;border-radius:9px;color:#30405c;font-size:.82rem}.tt-dropdown a:hover{background:#f3f7ff;color:var(--tt-blue)}.tt-dropdown a i{width:18px;color:var(--tt-blue)}
.tt-header-actions{display:flex;align-items:center;gap:10px}.tt-icon-btn{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:var(--tt-navy);background:#f5f8fd;text-decoration:none}.tt-primary-btn,.tt-outline-btn,.tt-whatsapp-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:12px;text-decoration:none;border:1px solid transparent;font-weight:700;transition:.25s}.tt-primary-btn{padding:13px 21px;color:#fff;background:linear-gradient(135deg,#1672ff,#0e5ce0);box-shadow:0 10px 24px rgba(23,105,255,.22)}.tt-primary-btn:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(23,105,255,.28);color:#fff}.tt-outline-btn{padding:13px 20px;background:#fff;border-color:#cbd8eb;color:var(--tt-navy)}.tt-outline-btn:hover{border-color:#8eb0eb;color:var(--tt-blue);transform:translateY(-2px)}.tt-header-cta{padding:11px 18px;border-radius:11px}.tt-menu-btn{display:none;border:0;background:#f3f7ff;width:42px;height:42px;border-radius:10px;color:var(--tt-navy)}
.tt-home-v2{overflow:hidden}.tt-hero{position:relative;min-height:590px;background:linear-gradient(112deg,#f7fbff 0%,#edf6ff 53%,#d9edff 100%);display:flex;align-items:center}.tt-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.85),transparent 68%);pointer-events:none}.tt-hero-grid{display:grid;grid-template-columns:.93fr 1.07fr;align-items:center;gap:10px;min-height:590px;position:relative;z-index:1}.tt-hero-orb{position:absolute;border-radius:50%;filter:blur(3px);pointer-events:none}.tt-orb-one{width:310px;height:310px;background:rgba(31,121,255,.12);right:-70px;top:45px}.tt-orb-two{width:220px;height:220px;background:rgba(123,103,238,.08);left:-100px;bottom:-80px}.tt-eyebrow,.tt-section-kicker{font-size:.72rem;font-weight:800;letter-spacing:1.35px;color:#55709c}.tt-eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:20px}.tt-eyebrow span{width:42px;height:2px;background:var(--tt-blue)}.tt-hero-copy h1{font-size:clamp(3rem,4.7vw,5rem);line-height:1.02;letter-spacing:-3px;max-width:720px;margin:0 0 22px;color:#0b1d3c;font-weight:800}.tt-hero-copy h1 strong{display:block;color:var(--tt-blue)}.tt-hero-copy>p{font-size:1.05rem;line-height:1.75;color:#4c607d;max-width:650px;margin:0 0 28px}.tt-hero-buttons{display:flex;gap:12px;flex-wrap:wrap}.tt-hero-pills{display:flex;gap:23px;flex-wrap:wrap;margin-top:35px}.tt-hero-pills span{display:flex;align-items:center;gap:8px;font-size:.8rem;font-weight:700;color:#263a59}.tt-hero-pills i{font-size:1rem;color:var(--tt-blue)}
.tt-hero-visual{position:relative;min-height:500px;display:flex;align-items:center;justify-content:center}.tt-visual-glow{position:absolute;width:540px;height:420px;background:radial-gradient(circle,rgba(46,132,255,.2),transparent 68%)}.tt-laptop{position:relative;width:min(690px,100%);border-radius:18px 18px 8px 8px;background:#0b1730;padding:9px 9px 14px;box-shadow:0 35px 70px rgba(15,50,100,.23);transform:perspective(1200px) rotateY(-4deg)}.tt-laptop:after{content:"";position:absolute;left:10%;right:10%;bottom:-15px;height:15px;border-radius:0 0 60% 60%;background:#b8c4d5}.tt-laptop-top{height:24px;display:flex;align-items:center;gap:5px;color:#91a3bd;padding:0 8px}.tt-laptop-top span{width:7px;height:7px;border-radius:50%;background:#64748b}.tt-laptop-top small{margin-left:auto;font-size:8px}.tt-dashboard{display:grid;grid-template-columns:105px 1fr;background:#f5f8fd;border-radius:9px;overflow:hidden;min-height:365px}.tt-dash-sidebar{background:#0c1c3b;padding:14px 8px;color:#a8bad7}.tt-mini-logo{width:34px;height:34px;background:#fff;border-radius:9px;display:grid;place-items:center;margin:0 auto 16px}.tt-mini-logo img{width:25px;height:25px;object-fit:contain}.tt-dash-sidebar a{display:flex;align-items:center;gap:7px;padding:8px 6px;border-radius:6px;font-size:7px;margin-bottom:5px}.tt-dash-sidebar a.active{background:#1769ff;color:#fff}.tt-dash-sidebar a i{width:12px}.tt-dash-main{padding:14px}.tt-dash-head{display:flex;align-items:center;gap:15px;font-size:10px;color:#182c4d}.tt-dash-head span{background:#fff;border:1px solid #e2eaf4;border-radius:7px;padding:7px 10px;color:#9aa8bc;flex:1;font-size:7px}.tt-dash-head b{font-size:7px}.tt-metric-row{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:12px}.tt-metric-row>div{background:#fff;border:1px solid #e7edf6;border-radius:8px;padding:10px}.tt-metric-row small{display:block;color:#8a98ad;font-size:6px}.tt-metric-row strong{display:block;font-size:14px;margin:4px 0;color:#172a4b}.tt-metric-row em{font-style:normal;color:#18a968;font-size:6px}.tt-metric-row em.down{color:#ef6262}.tt-chart-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:8px;margin-top:8px}.tt-chart-card{background:#fff;border:1px solid #e7edf6;border-radius:8px;padding:11px;min-height:140px}.tt-card-title{font-size:7px;font-weight:800;color:#263a59}.tt-card-title span{font-weight:500;color:#99a6b9}.tt-chart-bars{height:95px;display:flex;align-items:end;gap:5px;padding-top:16px}.tt-chart-bars i{display:block;flex:1;background:linear-gradient(180deg,#55a1ff,#1769ff);border-radius:3px 3px 0 0;opacity:.9}.tt-donut-card{display:grid;grid-template-columns:70px 1fr;gap:7px}.tt-donut-card .tt-card-title{grid-column:1/-1}.tt-donut{width:68px;height:68px;border-radius:50%;background:conic-gradient(#1769ff 0 45%,#25b87a 45% 70%,#8b6ff0 70% 85%,#f58a43 85% 100%);position:relative}.tt-donut:after{content:"";position:absolute;inset:16px;background:#fff;border-radius:50%}.tt-donut-card ul{list-style:none;font-size:6px;color:#66758c;line-height:1.8}.tt-donut-card li span{display:inline-block;width:5px;height:5px;border-radius:50%;background:#1769ff;margin-right:3px}.tt-phone{position:absolute;right:-2px;bottom:15px;width:126px;height:245px;border:7px solid #0a1730;background:linear-gradient(180deg,#071a3a,#113b77);border-radius:22px;box-shadow:0 20px 40px rgba(10,35,70,.28);color:#fff;text-align:center;padding:20px 8px 8px;z-index:3}.tt-phone-notch{position:absolute;top:5px;left:50%;transform:translateX(-50%);width:48px;height:7px;background:#0a1730;border-radius:10px}.tt-phone-logo{width:33px;height:33px;object-fit:contain;background:#fff;border-radius:9px;padding:3px;margin:6px auto 7px}.tt-phone strong{display:block;font-size:10px}.tt-phone small{font-size:6px;color:#9ec5ff}.tt-phone-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:14px}.tt-phone-grid span{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.12);border-radius:7px;padding:8px 2px;font-size:6px}.tt-phone-grid i{display:block;font-size:11px;margin-bottom:3px;color:#7fb4ff}
.tt-solution-strip{background:#fff;padding:12px 0 18px;border-bottom:1px solid #edf2f8}.tt-solution-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.tt-solution-card{min-height:105px;border-radius:14px;padding:16px 14px;display:flex;align-items:center;gap:12px;text-decoration:none;border:1px solid #e5ecf5;background:#fff;box-shadow:0 9px 24px rgba(24,45,80,.04);transition:.25s}.tt-solution-card:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(24,45,80,.09)}.tt-solution-icon{width:45px;height:45px;border-radius:11px;display:grid;place-items:center;font-size:1.15rem;flex:none}.tt-solution-card.blue .tt-solution-icon{background:#e8f1ff;color:#1769ff}.tt-solution-card.green .tt-solution-icon{background:#e8faf3;color:#19a96d}.tt-solution-card.purple .tt-solution-icon{background:#f0ecff;color:#7860e9}.tt-solution-card.orange .tt-solution-icon{background:#fff0e8;color:#ef7330}.tt-solution-card>span:nth-child(2){flex:1}.tt-solution-card strong{display:block;color:#162844;font-size:.94rem}.tt-solution-card small{display:block;color:#718198;font-size:.7rem;margin-top:4px;line-height:1.4}.tt-solution-card>i{font-size:.72rem;color:#8b9bb2}
.tt-section{padding:90px 0}.tt-section-heading{margin-bottom:46px}.tt-section-heading.split{display:grid;grid-template-columns:1.05fr .75fr;gap:60px;align-items:end}.tt-section-heading.centered{text-align:center}.tt-section-heading h2,.tt-about-copy h2,.tt-cta-copy h2{font-size:clamp(2rem,3vw,3rem);line-height:1.12;letter-spacing:-1.6px;margin:10px 0 0;color:#0c1d3a}.tt-section-heading h2 strong,.tt-about-copy h2 strong,.tt-cta-copy h2 strong{color:var(--tt-blue)}.tt-section-heading p{margin:0;color:#687990;line-height:1.75;font-size:.93rem}.tt-text-link{display:inline-flex;gap:8px;align-items:center;color:var(--tt-blue);font-weight:800;text-decoration:none;font-size:.84rem;margin-top:15px}.tt-products-section{background:#f7faff}.tt-product-showcase{display:grid;grid-template-columns:.7fr 1.3fr;background:#071a38;border-radius:24px;overflow:hidden;box-shadow:0 30px 60px rgba(8,30,65,.13)}.tt-product-copy{padding:52px;color:#fff}.tt-product-label{display:inline-flex;background:rgba(47,132,255,.15);border:1px solid rgba(116,174,255,.25);color:#8fc1ff;border-radius:99px;padding:7px 12px;font-size:.68rem;font-weight:800;letter-spacing:.8px}.tt-product-copy h3{font-size:2rem;line-height:1.18;color:#fff;margin:20px 0 14px}.tt-product-copy p{color:#b2c1d6;font-size:.9rem;line-height:1.7}.tt-product-copy ul{list-style:none;padding:0;margin:25px 0}.tt-product-copy li{font-size:.82rem;color:#e6eef9;margin:12px 0}.tt-product-copy li i{color:#47c98e;margin-right:8px}.tt-product-screen{padding:32px 30px 30px;background:linear-gradient(135deg,#0d2447,#0a1933);display:flex;align-items:center}.tt-screen-bar{height:40px;background:#f7faff;border-radius:10px 10px 0 0;padding:0 16px;display:flex;align-items:center;justify-content:space-between;font-size:9px;color:#273c5c}.tt-screen-body{display:grid;grid-template-columns:45px 1fr;background:#eef4fb;min-height:300px;border-radius:0 0 10px 10px;overflow:hidden}.tt-screen-side{background:#10294d;display:flex;flex-direction:column;align-items:center;padding-top:15px;gap:14px;color:#90a7c6}.tt-screen-side .active{color:#fff;background:#1769ff;padding:7px;border-radius:7px}.tt-screen-content{padding:14px}.tt-screen-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.tt-screen-stats b{background:#fff;border-radius:7px;padding:10px;font-size:12px;color:#142a4b}.tt-screen-stats small{display:block;color:#8391a5;font-size:6px;margin-bottom:3px}.tt-screen-lower{display:grid;grid-template-columns:1.4fr .8fr;gap:7px;margin-top:7px}.tt-screen-chart,.tt-screen-list{background:#fff;border-radius:7px;padding:12px}.tt-screen-chart h5,.tt-screen-list h5{font-size:8px;color:#29405e;margin:0 0 15px}.tt-line{height:120px;display:flex;align-items:flex-end;gap:9px}.tt-line i{display:block;width:12%;background:linear-gradient(180deg,#63abff,#1769ff);border-radius:4px 4px 0 0}.tt-line i:nth-child(1){height:35%}.tt-line i:nth-child(2){height:55%}.tt-line i:nth-child(3){height:45%}.tt-line i:nth-child(4){height:70%}.tt-line i:nth-child(5){height:62%}.tt-line i:nth-child(6){height:82%}.tt-line i:nth-child(7){height:96%}.tt-screen-list span{display:flex;justify-content:space-between;font-size:7px;padding:9px 0;border-bottom:1px solid #edf1f6}.tt-screen-list em{font-style:normal;color:var(--tt-blue)}
.tt-about-section{background:#fff}.tt-about-grid{display:grid;grid-template-columns:.8fr .85fr 1fr;gap:38px;align-items:center}.tt-about-copy p{color:#65758d;line-height:1.8;font-size:.93rem;margin:20px 0 25px}.tt-about-art{height:330px;position:relative;background:linear-gradient(135deg,#edf5ff,#f8fbff);border-radius:22px;overflow:hidden;display:grid;place-items:center}.tt-about-art img{width:90%;height:90%;object-fit:contain}.tt-logo-watermark{position:absolute;right:18px;top:16px;width:50px;height:50px;background:#fff;border-radius:12px;padding:7px;box-shadow:0 8px 20px rgba(20,50,90,.08);z-index:2}.tt-logo-watermark img{width:100%;height:100%;object-fit:contain}.tt-stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.tt-stat-card{padding:25px 20px;border:1px solid #e7edf5;border-radius:15px;background:#fff;box-shadow:0 8px 24px rgba(18,44,83,.04)}.tt-stat-card span{width:42px;height:42px;display:grid;place-items:center;background:#edf5ff;color:var(--tt-blue);border-radius:11px;margin-bottom:15px}.tt-stat-card strong{display:block;font-size:1.9rem;color:#102746}.tt-stat-card small{display:block;color:#78869a;font-size:.7rem;margin-top:4px}
.tt-industries{background:#f7faff}.tt-industry-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.tt-industry-card{height:190px;border-radius:18px;overflow:hidden;text-decoration:none;color:#fff;position:relative;padding:20px;display:flex;align-items:flex-end;background:linear-gradient(180deg,rgba(7,27,58,.05),rgba(7,27,58,.9)),linear-gradient(135deg,#9dbbdc,#183a66);transition:.25s}.tt-industry-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 75% 15%,rgba(255,255,255,.18),transparent 32%)}.tt-industry-card:hover{transform:translateY(-4px);box-shadow:0 18px 30px rgba(17,46,84,.14)}.tt-industry-card>div{position:relative;z-index:1}.tt-industry-card>i{margin-left:auto;position:relative;z-index:1;width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.14)}.tt-industry-card div>i{font-size:1.25rem;margin-bottom:12px;color:#8bc1ff}.tt-industry-card strong{display:block;font-size:1rem}.tt-industry-card small{display:block;font-size:.7rem;color:#d8e4f3;margin-top:4px}.tt-industry-card.government{background:linear-gradient(180deg,rgba(8,31,63,.05),rgba(8,31,63,.92)),linear-gradient(135deg,#b5a47d,#24486b)}.tt-industry-card.corporate{background:linear-gradient(180deg,rgba(8,31,63,.05),rgba(8,31,63,.92)),linear-gradient(135deg,#82a8cb,#1e4e7d)}.tt-industry-card.education{background:linear-gradient(180deg,rgba(8,31,63,.05),rgba(8,31,63,.92)),linear-gradient(135deg,#c58f6b,#34567a)}
.tt-services{background:#fff}.tt-services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.tt-service-card{position:relative;border:1px solid #e7edf5;border-radius:16px;padding:27px 22px;text-decoration:none;color:inherit;background:#fff;min-height:265px;transition:.25s}.tt-service-card:hover{transform:translateY(-5px);box-shadow:0 20px 40px rgba(20,45,80,.08);border-color:#cfe0fb}.tt-service-number{position:absolute;right:17px;top:16px;font-size:.7rem;font-weight:800;color:#c0cad8}.tt-service-icon{width:48px;height:48px;border-radius:12px;background:#edf5ff;color:var(--tt-blue);display:grid;place-items:center;margin-bottom:20px}.tt-service-card h3{font-size:1rem;margin-bottom:10px}.tt-service-card p{font-size:.76rem;line-height:1.65;color:#6f7e94}.tt-service-link{position:absolute;bottom:20px;color:var(--tt-blue);font-size:.72rem;font-weight:800}.tt-service-link i{margin-left:5px}
.tt-cta-section{background:linear-gradient(135deg,#eef6ff,#f8fbff)}.tt-cta-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:65px;align-items:center}.tt-cta-copy>p{color:#697992;line-height:1.8;max-width:560px}.tt-cta-points{display:grid;gap:9px;margin:25px 0}.tt-cta-points span{font-size:.8rem;color:#425571}.tt-cta-points i{color:#1aa66c;margin-right:7px}.tt-whatsapp-btn{padding:12px 18px;background:#22c975;color:#fff;box-shadow:0 10px 22px rgba(34,201,117,.18)}.tt-quote-card{background:#fff;border:1px solid #e5ecf5;border-radius:20px;padding:30px;box-shadow:0 22px 50px rgba(20,46,82,.08)}.tt-quote-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.tt-quote-head small{font-size:.63rem;letter-spacing:1px;font-weight:800;color:#7690b2}.tt-quote-head h3{font-size:1.3rem;margin-top:5px}.tt-quote-head>span{width:43px;height:43px;border-radius:12px;background:#edf5ff;color:var(--tt-blue);display:grid;place-items:center}.tt-form-row{display:grid;grid-template-columns:1fr 1fr;gap:13px}.tt-quote-form label{display:block;font-size:.72rem;color:#51627a;font-weight:700;margin-bottom:13px}.tt-quote-form input,.tt-quote-form select,.tt-quote-form textarea{display:block;width:100%;margin-top:6px;border:1px solid #dbe4f0;border-radius:9px;padding:11px 12px;font:inherit;font-size:.8rem;color:#152945;outline:none;background:#fbfdff}.tt-quote-form input:focus,.tt-quote-form select:focus,.tt-quote-form textarea:focus{border-color:#8db8ff;box-shadow:0 0 0 3px rgba(23,105,255,.08)}.tt-full{width:100%}.tt-form-actions{display:flex;gap:10px}.tt-form-actions .tt-primary-btn{flex:1}.tt-testimonials{background:#fff}.tt-testimonial-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.tt-testimonial-card{border:1px solid #e7edf5;border-radius:16px;padding:24px;background:#fff}.tt-stars{color:#f6ae3b;font-size:.75rem;margin-bottom:13px}.tt-testimonial-card p{font-size:.78rem;color:#60708a;line-height:1.75;min-height:135px}.tt-author{display:flex;align-items:center;gap:10px;border-top:1px solid #edf1f5;padding-top:15px}.tt-author img{width:38px;height:38px;border-radius:50%;object-fit:cover;background:#edf4ff}.tt-author strong{display:block;font-size:.72rem;color:#182a45}.tt-author small{display:block;font-size:.59rem;color:#8995a6;margin-top:3px}
.tt-footer{background:#06172f;color:#9fb1c9;padding:60px 0 0}.tt-footer-top{display:grid;grid-template-columns:1.45fr 1fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:50px}.tt-brand-footer strong{color:#fff}.tt-brand-footer small{color:#7085a4}.tt-footer-brand p{font-size:.78rem;line-height:1.75;max-width:340px;margin:20px 0;color:#94a8c3}.tt-socials{display:flex;gap:9px}.tt-socials a{width:34px;height:34px;border-radius:9px;background:rgba(255,255,255,.07);display:grid;place-items:center;color:#b9c8dc;text-decoration:none}.tt-socials a:hover{background:#1769ff;color:#fff}.tt-footer-col{display:flex;flex-direction:column;gap:10px}.tt-footer-col h4{color:#fff;font-size:.82rem;margin-bottom:7px}.tt-footer-col a,.tt-footer-col p{color:#9fb1c9;text-decoration:none;font-size:.73rem;line-height:1.65;margin:0}.tt-footer-col a:hover{color:#fff}.tt-contact-col p,.tt-contact-col a{display:flex;gap:9px;align-items:flex-start}.tt-contact-col i{color:#4d9aff;width:13px;margin-top:4px}.tt-footer-bottom{border-top:1px solid rgba(255,255,255,.09);padding:18px 0;display:flex;justify-content:space-between;font-size:.68rem;color:#7085a4}
.floating-whatsapp{z-index:1100}
@media(max-width:1100px){.tt-nav-links{gap:17px}.tt-nav-links a{font-size:.8rem}.tt-header-cta{display:none}.tt-hero-grid{grid-template-columns:1fr}.tt-hero-copy{text-align:center;padding-top:60px}.tt-eyebrow,.tt-hero-buttons,.tt-hero-pills{justify-content:center}.tt-hero-copy>p{margin-left:auto;margin-right:auto}.tt-hero-visual{min-height:440px}.tt-about-grid{grid-template-columns:1fr 1fr}.tt-stats-grid{grid-column:1/-1}.tt-services-grid{grid-template-columns:repeat(2,1fr)}.tt-testimonial-grid{grid-template-columns:repeat(2,1fr)}.tt-footer-top{grid-template-columns:1.5fr 1fr 1fr 1fr}}
@media(max-width:820px){.tt-nav-links,.tt-header-actions .tt-icon-btn{display:none}.tt-menu-btn{display:grid;place-items:center}.tt-navbar{height:70px}.tt-brand img{width:50px;height:50px}.tt-brand strong{font-size:1.28rem}.tt-hero{min-height:auto}.tt-hero-grid{min-height:auto}.tt-hero-copy{padding:60px 0 25px}.tt-hero-copy h1{font-size:clamp(2.55rem,8vw,4rem);letter-spacing:-2px}.tt-hero-visual{min-height:380px}.tt-laptop{width:90%}.tt-phone{right:2%;bottom:4px;transform:scale(.82);transform-origin:bottom right}.tt-solution-grid{grid-template-columns:1fr 1fr}.tt-section{padding:70px 0}.tt-section-heading.split{grid-template-columns:1fr;gap:12px}.tt-product-showcase{grid-template-columns:1fr}.tt-product-copy{padding:38px}.tt-product-screen{padding:22px}.tt-about-grid{grid-template-columns:1fr}.tt-about-art{order:-1;height:310px}.tt-stats-grid{grid-column:auto}.tt-industry-grid{grid-template-columns:1fr 1fr}.tt-cta-grid{grid-template-columns:1fr;gap:35px}.tt-footer-top{grid-template-columns:1fr 1fr;gap:32px}.tt-footer-brand{grid-column:1/-1}}
@media(max-width:560px){.container{padding-left:17px;padding-right:17px}.tt-brand small{font-size:.35rem}.tt-hero-copy h1{font-size:2.45rem}.tt-hero-copy>p{font-size:.9rem}.tt-hero-buttons{flex-direction:column}.tt-hero-buttons a{width:100%}.tt-hero-pills{display:grid;grid-template-columns:1fr 1fr;text-align:left;gap:13px}.tt-hero-pills span{font-size:.68rem}.tt-hero-visual{min-height:300px}.tt-laptop{width:100%;transform:none;padding:6px}.tt-dashboard{grid-template-columns:67px 1fr;min-height:235px}.tt-dash-sidebar{padding:8px 5px}.tt-dash-sidebar a{font-size:5px;padding:6px 3px}.tt-dash-main{padding:8px}.tt-dash-head{font-size:7px}.tt-dash-head span{font-size:5px}.tt-metric-row{gap:4px}.tt-metric-row>div{padding:6px}.tt-metric-row strong{font-size:8px}.tt-metric-row small,.tt-metric-row em{font-size:4px}.tt-chart-card{min-height:85px;padding:6px}.tt-chart-bars{height:55px;gap:2px}.tt-donut{width:40px;height:40px}.tt-donut:after{inset:10px}.tt-donut-card{grid-template-columns:45px 1fr}.tt-donut-card ul{font-size:4px}.tt-phone{width:82px;height:165px;border-width:5px;padding:12px 4px;right:-2px}.tt-phone-logo{width:23px;height:23px}.tt-phone strong{font-size:7px}.tt-phone-grid{gap:3px;margin-top:8px}.tt-phone-grid span{padding:5px 1px;font-size:4px}.tt-phone-grid i{font-size:7px}.tt-solution-grid{grid-template-columns:1fr}.tt-solution-card{min-height:82px}.tt-section{padding:55px 0}.tt-section-heading h2,.tt-about-copy h2,.tt-cta-copy h2{font-size:2rem}.tt-product-copy{padding:28px 22px}.tt-product-copy h3{font-size:1.55rem}.tt-screen-stats{grid-template-columns:1fr 1fr}.tt-screen-lower{grid-template-columns:1fr}.tt-screen-list{display:none}.tt-screen-body{min-height:260px}.tt-about-art{height:260px}.tt-stats-grid{grid-template-columns:1fr 1fr}.tt-stat-card{padding:18px 14px}.tt-stat-card strong{font-size:1.55rem}.tt-industry-grid,.tt-services-grid,.tt-testimonial-grid{grid-template-columns:1fr}.tt-industry-card{height:160px}.tt-form-row{grid-template-columns:1fr}.tt-form-actions{flex-direction:column}.tt-footer-top{grid-template-columns:1fr}.tt-footer-brand{grid-column:auto}.tt-footer-bottom{flex-direction:column;gap:8px;text-align:center}.tt-quote-card{padding:21px}.tt-header-actions{margin-left:auto}}

/* =========================================================
   TECH TRACK V2 - SHARED RESPONSIVE DESIGN SYSTEM
   ========================================================= */
:root{--tt-blue:#2563eb;--tt-blue-dark:#12306f;--tt-ink:#0b1730;--tt-muted:#60708a;--tt-line:#e6edf6;--tt-soft:#f6f9fd;--tt-white:#fff;--tt-shadow:0 18px 50px rgba(20,48,91,.10)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:#fff;color:var(--tt-ink);font-family:'Plus Jakarta Sans',Arial,sans-serif}.container{width:min(1180px,calc(100% - 40px));margin:0 auto}.main-content{overflow:hidden}.tt-section{padding:88px 0}.tt-section-heading{margin-bottom:42px}.tt-section-heading.centered{text-align:center}.tt-section-heading.split{display:flex;align-items:flex-end;justify-content:space-between;gap:40px}.tt-section-heading.split>p{max-width:480px;color:var(--tt-muted);line-height:1.8;margin:0}.tt-section-kicker,.tt-eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--tt-blue);font-size:.75rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;margin-bottom:12px}.tt-section-heading h2{font-size:clamp(2rem,4vw,3.15rem);line-height:1.08;letter-spacing:-.04em;margin:0}.tt-section-heading h2 strong,.tt-slide-copy h1 span{color:var(--tt-blue)}
/* Header */
.tt-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);border-bottom:1px solid rgba(226,232,240,.8)}.tt-header .container{max-width:1240px}.tt-navbar{height:78px;display:flex;align-items:center;justify-content:space-between;gap:25px}.tt-brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--tt-ink)}.tt-brand img{width:48px;height:48px;object-fit:contain}.tt-brand span{display:flex;flex-direction:column}.tt-brand strong{font-size:1.08rem;line-height:1}.tt-brand small{font-size:.48rem;letter-spacing:.12em;color:#7a879b;margin-top:5px}.tt-nav-links{display:flex;align-items:center;gap:27px;margin:0;padding:0;list-style:none}.tt-nav-links a{color:#40516b;text-decoration:none;font-size:.87rem;font-weight:600;transition:.2s}.tt-nav-links a:hover,.tt-nav-links a.active{color:var(--tt-blue)}.tt-nav-links .tt-nav-dropdown{position:relative}.tt-nav-dropdown>a{display:flex;align-items:center;gap:6px}.tt-dropdown{position:absolute;top:calc(100% + 20px);left:-15px;width:245px;background:#fff;border:1px solid var(--tt-line);box-shadow:var(--tt-shadow);border-radius:16px;padding:10px;opacity:0;visibility:hidden;transform:translateY(6px);transition:.2s}.tt-nav-dropdown:hover .tt-dropdown{opacity:1;visibility:visible;transform:none}.tt-dropdown a{display:flex;gap:11px;padding:11px;border-radius:10px}.tt-dropdown a:hover{background:var(--tt-soft)}.tt-dropdown i{width:18px;color:var(--tt-blue)}.tt-header .tt-primary-btn{padding:11px 17px;font-size:.8rem}
/* Buttons */
.tt-primary-btn,.tt-ghost-btn,.tt-outline-btn,.tt-whatsapp-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:10px;padding:13px 19px;text-decoration:none;font-weight:700;font-size:.86rem;border:1px solid transparent;cursor:pointer;transition:.25s}.tt-primary-btn{background:var(--tt-blue);color:#fff;box-shadow:0 10px 25px rgba(37,99,235,.22)}.tt-primary-btn:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(37,99,235,.28);color:#fff}.tt-ghost-btn,.tt-outline-btn{background:#fff;border-color:#dbe4f0;color:var(--tt-ink)}.tt-ghost-btn:hover,.tt-outline-btn:hover{border-color:#b8c9e3;color:var(--tt-blue);transform:translateY(-2px)}.tt-whatsapp-btn{background:#e9fff3;color:#0b8f51;border-color:#c9f3dc}.tt-full{width:100%}
/* Hero slider */
.tt-hero-slider{position:relative;background:linear-gradient(135deg,#f8fbff 0%,#fff 52%,#f3f7ff 100%);min-height:620px;border-bottom:1px solid var(--tt-line);overflow:hidden}.tt-slider-track{position:relative;min-height:620px}.tt-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transform:translateX(30px);transition:opacity .65s ease,transform .65s ease,visibility .65s}.tt-slide.is-active{opacity:1;visibility:visible;transform:none}.tt-slide-grid{min-height:620px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:45px;padding:60px 0 75px}.tt-slide-copy{position:relative;z-index:2}.tt-slide-copy h1{font-size:clamp(2.8rem,5.3vw,5.1rem);line-height:1.02;letter-spacing:-.055em;margin:0 0 22px;max-width:680px}.tt-slide-copy p{max-width:600px;color:var(--tt-muted);font-size:1.05rem;line-height:1.85;margin:0 0 28px}.tt-hero-actions{display:flex;gap:12px;flex-wrap:wrap}.tt-hero-proof{display:flex;flex-wrap:wrap;gap:18px;margin-top:28px}.tt-hero-proof span{font-size:.78rem;color:#65758c}.tt-hero-proof i{color:#12a968;margin-right:5px}.tt-slide-visual,.tt-product-visual,.tt-enterprise-visual{position:relative;min-height:430px;display:flex;align-items:center;justify-content:center}.tt-dashboard-window{width:min(590px,100%);background:#fff;border:1px solid #dbe5f1;border-radius:18px;box-shadow:0 30px 80px rgba(34,71,120,.18);overflow:hidden;transform:perspective(1200px) rotateY(-5deg) rotateX(2deg)}.tt-window-top{height:45px;border-bottom:1px solid #e7edf5;display:flex;align-items:center;gap:14px;padding:0 15px;color:#64748b;font-size:.65rem}.tt-window-top b{color:#17243c;font-size:.72rem}.tt-window-top>span:last-child{margin-left:auto}.tt-window-dots{display:flex;gap:5px}.tt-window-dots i{width:7px;height:7px;border-radius:50%;background:#cbd5e1}.tt-window-body{display:grid;grid-template-columns:48px 1fr;min-height:330px}.tt-window-body aside{background:#0f2345;padding:16px 0;display:flex;flex-direction:column;align-items:center;gap:18px;color:#9fb0ca}.tt-window-body aside strong{color:#fff;font-size:.7rem}.tt-window-body aside i.active{color:#60a5fa}.tt-dash-main{padding:18px;background:#f8fafc}.tt-mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.tt-mini-stats>div,.tt-chart-card,.tt-dept-card{background:#fff;border:1px solid #e8eef6;border-radius:10px;padding:12px}.tt-mini-stats small{display:block;color:#8794a7;font-size:.58rem}.tt-mini-stats b{display:block;font-size:1.1rem;margin:4px 0}.tt-mini-stats em{font-size:.55rem;color:#0b9b5e;font-style:normal}.tt-dash-lower{display:grid;grid-template-columns:1.5fr 1fr;gap:10px;margin-top:10px}.tt-card-title{display:flex;justify-content:space-between;align-items:center;font-size:.65rem}.tt-card-title span{color:#94a3b8;font-size:.52rem}.tt-bars{height:175px;display:flex;align-items:flex-end;gap:8px;padding:22px 10px 5px}.tt-bars i{display:block;flex:1;background:linear-gradient(#60a5fa,#2563eb);border-radius:5px 5px 2px 2px}.tt-dept-card{display:flex;flex-direction:column;gap:11px;font-size:.62rem}.tt-dept-card>b{margin-bottom:3px}.tt-dept-card span{display:grid;grid-template-columns:7px 1fr auto;gap:6px;color:#60708a}.tt-dept-card i{width:7px;height:7px;border-radius:50%;background:#2563eb}.tt-dept-card em{font-style:normal;font-weight:700;color:#17243c}.tt-floating-card{position:absolute;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #e4ebf4;box-shadow:0 18px 40px rgba(31,65,110,.15);padding:12px 15px;border-radius:12px}.tt-floating-card>i{width:36px;height:36px;border-radius:10px;background:#eff6ff;color:#2563eb;display:grid;place-items:center}.tt-floating-card small,.tt-floating-card b{display:block}.tt-floating-card small{font-size:.58rem;color:#8190a4}.tt-floating-card b{font-size:.73rem;margin-top:2px}.tt-float-one{top:13%;left:0}.tt-float-two{right:0;bottom:10%}.tt-product-visual{min-height:430px}.tt-phone{width:240px;background:#0d1d39;border-radius:34px;padding:10px;box-shadow:0 28px 70px rgba(22,51,94,.24);transform:rotate(5deg)}.tt-phone-notch{width:80px;height:18px;background:#0a1730;border-radius:0 0 14px 14px;margin:0 auto}.tt-phone-screen{background:#f8fbff;border-radius:25px;min-height:420px;padding:18px}.tt-phone-head{display:flex;justify-content:space-between;font-size:.8rem;margin-bottom:16px}.tt-phone-card{padding:18px;border-radius:16px;color:#fff;background:linear-gradient(135deg,#2563eb,#0f4fc9)}.tt-phone-card small,.tt-phone-card b,.tt-phone-card span{display:block}.tt-phone-card small{opacity:.8}.tt-phone-card b{font-size:2rem;margin:4px 0}.tt-phone-card span{font-size:.6rem;opacity:.85}.tt-phone-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.tt-phone-row div{background:#fff;border:1px solid #e4ebf4;border-radius:12px;padding:10px}.tt-phone-row i{color:#2563eb}.tt-phone-row b{display:block;font-size:.6rem;color:#738196;margin-top:6px}.tt-phone-row strong{font-size:.85rem}.tt-phone-list{margin-top:12px;background:#fff;border:1px solid #e4ebf4;border-radius:12px;padding:12px}.tt-phone-list span{display:block;font-size:.58rem;padding:8px 0;border-bottom:1px solid #eef2f7;color:#60708a}.tt-phone-list span:last-child{border-bottom:0}.tt-phone-list i{color:#10b981;margin-right:5px}.tt-orbit-card{position:absolute;right:0;top:12%;background:#fff;border:1px solid #e1eaf4;border-radius:16px;padding:14px;box-shadow:var(--tt-shadow);display:grid;grid-template-columns:42px 1fr;column-gap:10px}.tt-orbit-card img{width:42px;height:42px;object-fit:contain;grid-row:span 2}.tt-orbit-card b{font-size:.8rem}.tt-orbit-card small{font-size:.58rem;color:#8190a4}.tt-enterprise-visual{min-height:430px}.tt-enterprise-visual:before{content:"";position:absolute;width:290px;height:290px;border:1px dashed #b8c9e3;border-radius:50%}.tt-enterprise-core{width:145px;height:145px;border-radius:50%;background:#fff;border:1px solid #dce7f3;box-shadow:0 25px 70px rgba(37,99,235,.15);display:grid;place-items:center;align-content:center;text-align:center;z-index:2}.tt-enterprise-core img{width:55px;height:55px;object-fit:contain}.tt-enterprise-core strong{font-size:.9rem}.tt-enterprise-core span{font-size:.5rem;color:#8290a4}.tt-node{position:absolute;width:88px;height:88px;border-radius:18px;background:#fff;border:1px solid #e1e9f3;box-shadow:0 14px 35px rgba(28,58,99,.12);display:grid;place-items:center;align-content:center;gap:4px;z-index:3}.tt-node i{color:#2563eb}.tt-node b{font-size:.62rem}.tt-node.n1{top:5%;left:16%}.tt-node.n2{top:5%;right:16%}.tt-node.n3{bottom:5%;left:16%}.tt-node.n4{bottom:5%;right:16%}.tt-node.n5{top:40%;right:-2%}.tt-slider-arrow{position:absolute;top:48%;z-index:5;width:42px;height:42px;border:1px solid #dbe4ef;background:#fff;border-radius:50%;color:#45607f;cursor:pointer;box-shadow:0 8px 22px rgba(25,52,90,.08)}.tt-slider-arrow.prev{left:20px}.tt-slider-arrow.next{right:20px}.tt-slider-controls{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);display:flex;justify-content:space-between;align-items:center}.tt-slider-dots{display:flex;gap:7px}.tt-slider-dots button{width:28px;height:4px;border:0;background:#cbd7e7;border-radius:4px;cursor:pointer}.tt-slider-dots button.active{background:#2563eb}.tt-slider-controls>span{font-size:.65rem;color:#8794a7}.tt-slider-controls b{color:#2563eb}
/* Home sections */
.tt-trust-strip{padding:22px 0;border-bottom:1px solid var(--tt-line);border-top:1px solid var(--tt-line);background:#fff}.tt-trust-strip .container{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.tt-trust-strip div{padding:8px 20px;border-right:1px solid var(--tt-line)}.tt-trust-strip div:last-child{border-right:0}.tt-trust-strip small,.tt-trust-strip b{display:block}.tt-trust-strip small{font-size:.58rem;color:#94a3b8;letter-spacing:.12em}.tt-trust-strip b{font-size:.85rem;margin-top:4px}.tt-solution-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.tt-solution-card{position:relative;background:#fff;border:1px solid var(--tt-line);border-radius:17px;padding:24px;text-decoration:none;color:var(--tt-ink);min-height:310px;display:flex;flex-direction:column;transition:.25s}.tt-solution-card:hover{transform:translateY(-6px);border-color:#c9d8eb;box-shadow:var(--tt-shadow)}.tt-solution-icon{width:46px;height:46px;border-radius:13px;background:#eff6ff;color:#2563eb;display:grid;place-items:center;margin-bottom:18px}.tt-solution-card>small{font-size:.58rem;color:#8090a6;text-transform:uppercase;letter-spacing:.1em}.tt-solution-card h3{font-size:1.02rem;line-height:1.3;margin:8px 0}.tt-solution-card p{font-size:.75rem;color:var(--tt-muted);line-height:1.65;margin:0}.tt-card-link{margin-top:auto;padding-top:18px;font-size:.72rem;font-weight:700;color:#2563eb}.tt-card-link i{margin-left:5px}.tt-product-section{background:#f7faff}.tt-product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.tt-product-card{background:#fff;border:1px solid var(--tt-line);border-radius:18px;overflow:hidden;box-shadow:0 8px 28px rgba(32,66,108,.05)}.tt-product-art{height:230px;background:linear-gradient(135deg,#edf5ff,#fff);position:relative;display:grid;place-items:center;overflow:hidden}.tt-product-art img{width:80%;height:80%;object-fit:contain}.tt-product-art span{position:absolute;top:14px;left:14px;background:#fff;border:1px solid #e1e9f3;padding:6px 9px;border-radius:20px;font-size:.58rem;color:#2563eb;font-weight:700}.tt-product-body{padding:22px}.tt-product-body small{color:#7f8da0;font-size:.58rem}.tt-product-body h3{font-size:1.1rem;margin:7px 0}.tt-product-body p{font-size:.76rem;color:var(--tt-muted);line-height:1.7}.tt-product-body a{font-size:.72rem;font-weight:700;color:#2563eb;text-decoration:none}.tt-about-band{background:#fff}.tt-about-grid{display:grid;grid-template-columns:1fr .9fr;gap:70px;align-items:center}.tt-about-grid>div>p{color:var(--tt-muted);line-height:1.85;max-width:610px}.tt-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:28px 0}.tt-stat-card{border:1px solid var(--tt-line);border-radius:13px;padding:13px;background:#fff}.tt-stat-card span{display:block;color:#2563eb;font-size:.8rem}.tt-stat-card b{display:block;font-size:1.2rem;margin-top:6px}.tt-stat-card small{display:block;color:#8090a6;font-size:.58rem;line-height:1.4}.tt-about-image{position:relative;background:#f5f9ff;border-radius:25px;padding:35px;min-height:400px;display:grid;place-items:center}.tt-about-image>img{width:100%;max-width:460px}.tt-about-image>div{position:absolute;right:15px;bottom:15px;background:#fff;border:1px solid #e0e9f3;border-radius:15px;padding:12px 15px;display:flex;align-items:center;gap:10px;box-shadow:var(--tt-shadow)}.tt-about-image>div img{width:38px;height:38px;object-fit:contain}.tt-about-image>div b{font-size:.7rem;line-height:1.4}.tt-industry-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.tt-industry-card{display:grid;grid-template-columns:44px 1fr 18px;gap:12px;align-items:center;border:1px solid var(--tt-line);border-radius:16px;padding:20px;text-decoration:none;color:var(--tt-ink);transition:.25s}.tt-industry-card:hover{border-color:#bcd0ea;box-shadow:var(--tt-shadow);transform:translateY(-4px)}.tt-industry-card>i:first-child{width:44px;height:44px;border-radius:12px;background:#eff6ff;color:#2563eb;display:grid;place-items:center}.tt-industry-card b,.tt-industry-card small{display:block}.tt-industry-card b{font-size:.8rem}.tt-industry-card small{font-size:.58rem;color:#7c8ba0;line-height:1.4;margin-top:4px}.tt-industry-card>i:last-child{color:#94a3b8;font-size:.7rem}.tt-services-band{background:#f7faff}.tt-services-list{border-top:1px solid #dfe8f2}.tt-services-list>a{display:grid;grid-template-columns:45px 38px 1fr 22px;align-items:center;gap:18px;padding:19px 0;border-bottom:1px solid #dfe8f2;text-decoration:none;color:var(--tt-ink);transition:.2s}.tt-services-list>a:hover{padding-left:10px}.tt-services-list>a>span{font-size:.65rem;color:#98a5b6}.tt-services-list>a>i{color:#2563eb}.tt-services-list>b{font-size:.85rem}.tt-services-list div b,.tt-services-list div small{display:block}.tt-services-list div b{font-size:.85rem}.tt-services-list div small{font-size:.64rem;color:#7c8ba0;margin-top:3px}.tt-services-list>a>i:last-child{color:#94a3b8}.tt-cta-section{background:#0d2346;color:#fff}.tt-cta-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:center}.tt-cta-copy p{color:#b8c6d9;line-height:1.8}.tt-cta-copy .tt-section-kicker{color:#7fb1ff}.tt-cta-copy h2{font-size:clamp(2.1rem,4vw,3.3rem);line-height:1.1;letter-spacing:-.04em}.tt-cta-copy h2 strong{color:#72a8ff}.tt-cta-points{display:grid;gap:10px;margin:22px 0}.tt-cta-points span{font-size:.78rem;color:#d7e2f0}.tt-cta-points i{color:#56d39a;margin-right:7px}.tt-quote-card{background:#fff;color:var(--tt-ink);border-radius:20px;padding:28px;box-shadow:0 30px 80px rgba(0,0,0,.22)}.tt-quote-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.tt-quote-head small{color:#2563eb;font-size:.62rem;font-weight:800;letter-spacing:.12em}.tt-quote-head h3{margin:5px 0 0;font-size:1.35rem}.tt-quote-head>span{width:42px;height:42px;background:#eff6ff;color:#2563eb;border-radius:12px;display:grid;place-items:center}.tt-form-row{display:grid;grid-template-columns:1fr 1fr;gap:13px}.tt-quote-form label{display:block;font-size:.7rem;font-weight:700;color:#52627a;margin-bottom:14px}.tt-quote-form input,.tt-quote-form select,.tt-quote-form textarea,.tt-page-form input,.tt-page-form select,.tt-page-form textarea{display:block;width:100%;margin-top:6px;border:1px solid #dce5ef;border-radius:9px;padding:12px 13px;font:inherit;font-size:.8rem;color:#17243c;background:#fff;outline:none}.tt-quote-form input:focus,.tt-quote-form select:focus,.tt-quote-form textarea:focus,.tt-page-form input:focus,.tt-page-form select:focus,.tt-page-form textarea:focus{border-color:#77a8ef;box-shadow:0 0 0 3px rgba(37,99,235,.08)}.tt-form-actions{display:flex;justify-content:space-between;gap:10px}.tt-testimonial-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.tt-testimonial-card{border:1px solid var(--tt-line);border-radius:16px;padding:22px;background:#fff}.tt-stars{color:#f6a623;font-size:.7rem;letter-spacing:2px}.tt-testimonial-card p{font-size:.78rem;line-height:1.8;color:#55657c;min-height:125px}.tt-author{display:flex;gap:10px;align-items:center;border-top:1px solid #edf1f6;padding-top:14px}.tt-author img{width:38px;height:38px}.tt-author b,.tt-author small{display:block}.tt-author b{font-size:.7rem}.tt-author small{font-size:.55rem;color:#8996a8;margin-top:3px}
/* Inner pages */
.tt-page-hero{padding:80px 0 70px;background:linear-gradient(135deg,#f5f9ff,#fff);border-bottom:1px solid var(--tt-line)}.tt-page-hero-grid{display:grid;grid-template-columns:1fr .75fr;gap:60px;align-items:center}.tt-page-hero h1{font-size:clamp(2.6rem,5vw,4.5rem);line-height:1.03;letter-spacing:-.05em;margin:0 0 18px}.tt-page-hero h1 span{color:var(--tt-blue)}.tt-page-hero p{color:var(--tt-muted);line-height:1.85;max-width:650px}.tt-page-hero-art{background:#fff;border:1px solid var(--tt-line);border-radius:25px;padding:30px;box-shadow:var(--tt-shadow);display:grid;place-items:center}.tt-page-hero-art img{max-width:100%;max-height:270px}.tt-page-shell{padding:80px 0}.tt-card-grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.tt-modern-card{background:#fff;border:1px solid var(--tt-line);border-radius:18px;padding:28px;box-shadow:0 7px 25px rgba(28,58,99,.04);transition:.25s}.tt-modern-card:hover{transform:translateY(-4px);box-shadow:var(--tt-shadow)}.tt-modern-card .tt-icon{width:48px;height:48px;border-radius:13px;background:#eff6ff;color:#2563eb;display:grid;place-items:center;margin-bottom:18px}.tt-modern-card h3{font-size:1.1rem;margin:0 0 9px}.tt-modern-card p{font-size:.78rem;color:var(--tt-muted);line-height:1.75;margin:0}.tt-check-list{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:9px}.tt-check-list li{font-size:.75rem;color:#52627a}.tt-check-list i{color:#10b981;margin-right:7px}.tt-pill{display:inline-flex;padding:6px 10px;border-radius:30px;background:#eff6ff;color:#2563eb;font-size:.58rem;font-weight:700}.tt-timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.tt-timeline .tt-modern-card{position:relative}.tt-timeline strong{font-size:1.3rem;color:#2563eb}.tt-team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.tt-team-card{text-align:center;background:#fff;border:1px solid var(--tt-line);border-radius:18px;padding:28px 18px}.tt-team-avatar{width:70px;height:70px;border-radius:50%;display:grid;place-items:center;margin:0 auto 14px;background:linear-gradient(135deg,#2563eb,#12306f);color:#fff;font-weight:800;font-size:1.4rem}.tt-team-card h4{margin:0 0 5px}.tt-team-card p{font-size:.7rem;color:var(--tt-muted);line-height:1.6}.tt-team-card span{font-size:.58rem;color:#2563eb;font-weight:700}.tt-page-form{background:#fff;border:1px solid var(--tt-line);border-radius:20px;padding:30px;box-shadow:var(--tt-shadow)}.tt-page-form label{display:block;font-size:.7rem;font-weight:700;color:#53637a;margin-bottom:14px}.tt-page-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:13px}.tt-info-stack{display:grid;gap:13px}.tt-info-card{display:flex;gap:14px;padding:20px;border:1px solid var(--tt-line);border-radius:16px;background:#fff}.tt-info-card>i{width:43px;height:43px;display:grid;place-items:center;border-radius:12px;background:#eff6ff;color:#2563eb;flex:0 0 43px}.tt-info-card h4{font-size:.85rem;margin:0 0 4px}.tt-info-card p,.tt-info-card a{font-size:.72rem;color:var(--tt-muted);line-height:1.6;text-decoration:none}.tt-contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:25px;align-items:start}.tt-map{height:360px;border-radius:20px;overflow:hidden;border:1px solid var(--tt-line);box-shadow:var(--tt-shadow);margin-top:24px}.tt-map iframe{width:100%;height:100%;border:0}.tt-portfolio-filter{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:28px}.tt-portfolio-filter button{border:1px solid var(--tt-line);background:#fff;border-radius:30px;padding:9px 14px;font-size:.68rem;font-weight:700;color:#64748b;cursor:pointer}.tt-portfolio-filter button.active,.tt-portfolio-filter button:hover{background:#2563eb;color:#fff;border-color:#2563eb}.tt-portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.tt-case-card{background:#fff;border:1px solid var(--tt-line);border-radius:18px;overflow:hidden;transition:.25s}.tt-case-card:hover{transform:translateY(-5px);box-shadow:var(--tt-shadow)}.tt-case-art{height:215px;background:#f4f8fe;position:relative;display:grid;place-items:center;padding:18px}.tt-case-art img{width:100%;height:100%;object-fit:contain}.tt-case-art span{position:absolute;left:12px;top:12px;background:#fff;border:1px solid var(--tt-line);border-radius:20px;padding:6px 9px;font-size:.56rem;color:#2563eb;font-weight:700}.tt-case-body{padding:20px}.tt-case-body small{font-size:.6rem;color:#8a97a8}.tt-case-body h3{font-size:1rem;margin:6px 0 8px}.tt-case-body p{font-size:.72rem;color:var(--tt-muted);line-height:1.7}.tt-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:13px}.tt-tags span{font-size:.54rem;color:#60708a;background:#f3f6fa;padding:5px 7px;border-radius:6px}.tt-metric{border-top:1px solid #edf1f5;margin-top:14px;padding-top:12px;font-size:.62rem;color:#2563eb}.tt-career-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.tt-career-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:28px;align-items:start}.tt-file{border:1px dashed #b9c9dd;border-radius:10px;padding:13px;background:#f8fbff;width:100%;font-size:.7rem}.tt-faq{display:grid;gap:10px}.tt-faq details{border:1px solid var(--tt-line);border-radius:13px;padding:15px 18px;background:#fff}.tt-faq summary{cursor:pointer;font-size:.78rem;font-weight:700}.tt-faq p{font-size:.72rem;color:var(--tt-muted);line-height:1.7;margin:10px 0 0}.tt-service-detail-grid{display:grid;grid-template-columns:1fr 330px;gap:28px;align-items:start}.tt-service-main,.tt-service-side>div{background:#fff;border:1px solid var(--tt-line);border-radius:20px;padding:30px;box-shadow:0 7px 25px rgba(28,58,99,.04)}.tt-service-main h2{font-size:1.8rem}.tt-service-main p{color:var(--tt-muted);line-height:1.8}.tt-deliverables{display:grid;gap:10px}.tt-deliverable{display:flex;gap:11px;padding:14px;border:1px solid var(--tt-line);border-radius:12px}.tt-deliverable i{color:#10b981;margin-top:3px}.tt-service-side{display:grid;gap:15px;position:sticky;top:100px}.tt-service-side h3{font-size:1rem}.tt-tech-list{display:flex;gap:7px;flex-wrap:wrap}.tt-tech-list span{font-size:.58rem;background:#eff6ff;color:#2563eb;padding:6px 8px;border-radius:7px}.tt-service-flyer{margin:20px 0;padding:20px;border-radius:17px;background:#f7faff;border:1px solid var(--tt-line)}.tt-service-flyer img{width:100%;border-radius:12px}
/* footer */
.tt-footer{background:#091a35!important;color:#d6e1f0!important}.tt-footer *{color:inherit}.tt-footer a:hover{color:#75aaff!important}.tt-footer .footer-brand img{background:#fff;border-radius:8px}
/* mobile */
@media(max-width:1100px){.tt-nav-links{gap:15px}.tt-solution-grid{grid-template-columns:repeat(3,1fr)}.tt-testimonial-grid{grid-template-columns:repeat(2,1fr)}.tt-team-grid{grid-template-columns:repeat(2,1fr)}.tt-timeline{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.container{width:min(100% - 28px,700px)}.tt-navbar{height:70px}.tt-nav-links,.tt-header .tt-primary-btn{display:none}.tt-slide-grid{grid-template-columns:1fr;min-height:730px;padding:55px 0 90px}.tt-hero-slider,.tt-slider-track{min-height:730px}.tt-slide-copy{text-align:center}.tt-slide-copy h1{font-size:2.8rem;margin-left:auto;margin-right:auto}.tt-slide-copy p{margin-left:auto;margin-right:auto}.tt-eyebrow,.tt-hero-actions,.tt-hero-proof{justify-content:center}.tt-slide-visual,.tt-product-visual,.tt-enterprise-visual{min-height:330px}.tt-dashboard-window{transform:none}.tt-floating-card{display:none}.tt-slider-arrow{top:auto;bottom:58px}.tt-slider-arrow.prev{left:20px}.tt-slider-arrow.next{right:20px}.tt-slider-controls{bottom:20px}.tt-trust-strip .container{grid-template-columns:1fr 1fr}.tt-trust-strip div{border-right:0}.tt-section{padding:65px 0}.tt-section-heading.split{display:block}.tt-section-heading.split>p{margin-top:15px}.tt-solution-grid{grid-template-columns:1fr 1fr}.tt-product-grid,.tt-portfolio-grid{grid-template-columns:1fr}.tt-about-grid,.tt-cta-grid,.tt-page-hero-grid,.tt-contact-grid,.tt-career-layout,.tt-service-detail-grid{grid-template-columns:1fr}.tt-about-image{min-height:300px}.tt-industry-grid{grid-template-columns:1fr 1fr}.tt-stats-grid{grid-template-columns:1fr 1fr}.tt-testimonial-grid{grid-template-columns:1fr}.tt-career-grid{grid-template-columns:1fr 1fr}.tt-page-hero{padding:60px 0}.tt-page-hero{text-align:center}.tt-page-hero p{margin-left:auto;margin-right:auto}.tt-page-hero-art{max-width:520px;margin:auto}.tt-timeline{grid-template-columns:1fr 1fr}.tt-service-side{position:static}.tt-form-row,.tt-page-form .form-row{grid-template-columns:1fr}.tt-footer .footer-grid{grid-template-columns:1fr 1fr!important}}
@media(max-width:520px){.tt-brand img{width:43px;height:43px}.tt-brand small{display:none}.tt-slide-copy h1{font-size:2.35rem}.tt-slide-copy p{font-size:.9rem}.tt-solution-grid,.tt-industry-grid,.tt-career-grid,.tt-timeline{grid-template-columns:1fr}.tt-hero-actions>*{width:100%}.tt-phone{width:205px}.tt-phone-screen{min-height:360px}.tt-slider-controls>span{display:none}.tt-slider-controls{justify-content:center}.tt-cta-grid{gap:30px}.tt-quote-card{padding:20px}.tt-about-image>div{right:8px;bottom:8px}.tt-about-image>div b{font-size:.58rem}.tt-page-hero h1{font-size:2.35rem}.tt-page-shell{padding:55px 0}.tt-team-grid{grid-template-columns:1fr}.tt-map{height:300px}}