/* --- 1. CORE SETTINGS & VARIABLES --- */
        :root {
            --kPrimaryColor: #ff9f19;
            --kSecondaryColor: #045390;
            --kQuaternaryColor: #0D9165;
            --kQuinaryColor: #363D42;
            --kSenaryColor: #163F68;
            --kSeptenaryColor: #1A1A1A;
            --kOctonaryColor: #DDE4E6;
            --kNonaryColor: #dde4e6;
            --kDenaryColor: #f0f0f0;
            --kamnic-x: 142px;
            --kamnic-y: 65px;
            
            /* Tooltip Bootstrap Overrides */
            --bs-tooltip-bg: #198754;
            --bs-tooltip-color: #fff;
            --bs-tooltip-opacity: 1;
            --bs-tooltip-max-width: 260px;
            --bs-tooltip-padding-x: .85rem;
            --bs-tooltip-padding-y: .65rem;
            --bs-tooltip-border-radius: .9rem;
        }

        html { scroll-behavior: smooth; }

        @font-face {
            font-family: 'Plus Jakarta Sans';
            font-style: normal;
            font-weight: 400;
            font-display: swap;
            src: url('/assets/fonts/PlusJakartaSans-Regular.ttf') format('truetype');
        }

        @font-face {
            font-family: 'Plus Jakarta Sans';
            font-style: normal;
            font-weight: 500;
            font-display: swap;
            src: url('/assets/fonts/PlusJakartaSans-Medium.ttf') format('truetype');
        }

        @font-face {
            font-family: 'Plus Jakarta Sans';
            font-style: normal;
            font-weight: 600;
            font-display: swap;
            src: url('/assets/fonts/PlusJakartaSans-SemiBold.ttf') format('truetype');
        }

        @font-face {
            font-family: 'Plus Jakarta Sans';
            font-style: normal;
            font-weight: 700;
            font-display: swap;
            src: url('/assets/fonts/PlusJakartaSans-Bold.ttf') format('truetype');
        }

        /* --- 2. UTILITIES & TYPOGRAPHY --- */
        .text-justify { text-align: justify; }
        .mw-100rem { max-width: 100rem !important; }
        .nav-link { color: white; }
        
        .kOrange { 
            color: var(--kPrimaryColor); 
            font-weight: bold; 
        }

        /* --- 3. COMPONENTS: BUTTONS --- */
        .btn.kSenaryColor { background: var(--kSenaryColor); }
        .bg-kPrimary { background: var(--kPrimaryColor) !important; }
        .bg-kSecondary { background: var(--kSecondaryColor) !important; }
        .bg-kOctonary { background: var(--kOctonaryColor) !important; }
        .bg-kNonary { background: var(--kNonaryColor) !important; }
        .bg-kDenary { background: var(--kDenaryColor) !important; }
        .bg-kSeptenary { background: var(--kSeptenaryColor) !important; }
        .bg-kQuaternary { background: var(--kQuaternaryColor) !important; }
        
        .bg-kPrimaryGradient { background: linear-gradient(135deg, var(--kSecondaryColor) 0%, var(--kSenaryColor) 100%); }
        .bg-kSecondaryGradient { background: linear-gradient(135deg, var(--kQuaternaryColor) 0%, var(--kSenaryColor) 100%) !important; }

        .btn-outline-kamnic {
            color: var(--kSecondaryColor);
            border-color: var(--kSecondaryColor);
            background-color: transparent;
        }
        .btn-outline-kamnic:hover {
            color: #fff;
            background-color: var(--kSecondaryColor);
            border-color: var(--kSecondaryColor);
        }

        .btn-alt-outline-kamnic {
            color: #fff;
            border-color: var(--kSecondaryColor);
            background-color: var(--kSecondaryColor);
        }
        .btn-alt-outline-kamnic:hover {
            color: var(--kSecondaryColor);
            background-color: #fff;
            border-color: var(--kSecondaryColor);
        }

        /*.btn-outline-kamnic-alt1 {
            color: white;
            border-color: white;
            background-color: transparent;
        }*/
        /*.btn-outline-kamnic-alt1:hover,
        .btn-outline-kamnic-alt1:focus {
            background-color: white;
            color: var(--kSecondaryColor); 
            border-color: white;
        }*/

        .btn-outline-kamnic-alt1 {
            background: transparent;
            color: var(--kPrimaryColor) !important;
        }

        .btn-outline-kamnic-alt1:hover, 
        .btn-outline-kamnic-alt1:focus {
            background: var(--kQuaternaryColor) !important;
            color: #fff !important;
        }

        .btn-outline-kamnic-alt2 {
            background: var(--kQuaternaryColor) !important;
            color: #fff;
        }

        .btn-outline-kamnic-alt2:hover,
        .btn-outline-kamnic-alt1:focus {
            background: transparent !important;
            color: var(--kSecondaryColor) !important;
        }

        /* --- 4. NAVIGATION --- */
        .navbar-expand-lg {
            flex-wrap: nowrap;
            justify-content: flex-start;
            position: absolute;
            top: 0; left: 0; right: 0;
            background: rgba(0, 0, 0, 0.4);
        }

        .kMenu {
            background-color: transparent;
            transition: background-color 0.3s ease;
            z-index: 2;
        }
        .kMenu .nav-link {
            color: #ffffff !important;
            transition: color 0.2s ease;
        }
        .kMenu .nav-link:hover,
        .kMenu .nav-link:focus,
        .kMenu .nav-link.show {
            color: var(--kPrimaryColor) !important;
        }
        .kMenu .dropdown-menu {
            border-radius: 0;
            border: none;
            border-top: 4px solid var(--kPrimaryColor); 
            box-shadow: 0 10px 30px rgba(0,0,0,0.1);
        }
        .kMenu .dropdown-item {
            color: var(--kSeptenaryColor);
            padding: 10px 20px;
        }
        .kMenu .dropdown-item:hover {
            background-color: var(--kDenaryColor);
            color: var(--kSecondaryColor);
        }
        .kMenu li.nav-item a { font-size: 1rem; }
        
        /* Mobile Menu */
        #mobileMenu .offcanvas-body, #mobileMenu { overflow: hidden !important; }

        /* --- 5. HERO SECTION --- */
        section#kHero {
            min-height: 100vh;
            background-color: #051021;
            overflow: hidden;
        }
        #kHero::before {
            background-position: center;
            background-size: cover;
            content: "";
            position: absolute;
            top: 0; left: 0; right: 0; bottom: 0;
            z-index: -1;
            background: linear-gradient(
                180deg, 
                rgba(4, 83, 144, 0.85) 0%, 
                rgba(22, 63, 104, 0.6) 50%, 
                rgba(4, 83, 144, 0.95) 100% 
            );
            opacity: 0.9;
        }
        #kHeroVideo {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            z-index: -2;
            pointer-events: none;
        }
        .container.kContainerPrime {
            display: flex;
            height: 90vh;
            justify-content: center;
            flex-direction: column;
            align-items: flex-start;
        }
        
        /* Hero Bottom Nav */
        .kHero-bottom-nav-btn {
            transition: all 0.3s ease;
            border-bottom: 2px solid rgba(255,255,255,0.3);
        }
        .kHero-bottom-nav-btn:hover {
            background-color: rgba(255, 255, 255, 0.1);
            border-bottom-color: var(--kPrimaryColor);
            transform: translateY(-3px);
        }

        /* Typewriter Cursor */
        .txt-type {
            border-right: 0.1em solid #ff9f19; 
            padding-right: 5px;
            animation: blink-caret 0.75s step-end infinite;
        }
        @keyframes blink-caret {
            from, to { border-color: transparent }
            50% { border-color: #ff9f19; }
        }

        /* Hero Canvas Container */
        #canvas-container { position: absolute; inset: 0; z-index: 0; pointer-events: none; background: #051021; transition: background 0.5s ease; }
        #canvas-container.mode-three { background: radial-gradient(circle at center, #0b1a2b 0%, #051021 100%) !important; }
        #canvas-container.mode-pcb { background: radial-gradient(circle at center, #1b528a 0%, #0e3c70 100%) !important; }
        #canvas-container.mode-static { background: #051021 !important; }

        /* --- 6. INFO BOXES (Why KamNic) --- */
        .row.kWhyChooseUsBoxes .kBox {
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
            align-items: center;
            min-height: 35rem;
            overflow: hidden;
            transition: background-color 250ms;
        }
        .kBox1 { 
            background: url('/assets/images/KamNic/420.webp'); 
            background-position: center; background-repeat: no-repeat; background-size: cover; 
        }
        .kBox2 { 
            background: url('/assets/images/KamNic/Pedram-updated.webp'); 
            background-position: center; background-repeat: no-repeat; background-size: cover; 
        }
        .kBox3 { 
            background: url('/assets/images/KamNic/Naeim-nb.webp'); 
            background-position: -350px center; background-repeat: no-repeat; background-size: cover; 
        }

        .kBox-overlay {
            background: var(--kSecondaryColor);
            backdrop-filter: blur(10px);
            border-radius: 20px;
            padding: 0.5rem;
            color: white;
            max-width: 400px;
            width: 90%;
            text-align: center;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
        }

        .kBox1:hover, .kBox3:hover { background: var(--kQuaternaryColor) !important; }
        .kBox2:hover { background: var(--kSecondaryColor) !important; }
        .kBox2:hover p { color: white; }

        .kBox:hover .kBox-overlay {
            background: transparent;
            backdrop-filter: unset;
            border-radius: unset;
            box-shadow: unset;
        }
        .kBox:hover .kBoxHeading {
            transform:translateY(-8rem);
            transition:300ms;
        } 
        .kBox:hover .kBoxContent {
            max-height: 20rem;
            color:white;
            transform:translateY(-6rem);
            transition: transform 450ms ease, opacity 300ms ease;
            opacity: 1;
        }
        .kBoxContent {
            opacity: 0;
            max-height: 0;
            transition: transform 250ms ease, opacity 100ms ease;
        }

        /* Floating Logo Animation in Box 2 */
        img.position-absolute.top-0.end-0 {
            width: 12.5rem;
            height: auto;
            transform: rotate(-61deg) translate(142px, 65px);
            transition: transform 350ms ease;
        }
        .kamnic-logo {
            transition: transform 350ms ease, top 350ms ease, left 350ms ease;
        }
        .kBox2:hover img.position-absolute.top-0.end-0 {
             transform: rotate(0) translate(var(--kamnic-x), var(--kamnic-y)) scale(0.33);
        }

        /* --- 7. TABS / SOLUTIONS SECTION --- */
        .swiper-tab-link {
            position: relative;
            padding: 1rem 1.5rem;
            margin-bottom: 1rem;
            background: white;
            border-radius: 16px;
            cursor: pointer;
            transition: all 0.3s ease;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
            overflow: hidden;
            background: linear-gradient(135deg, var(--kSecondaryColor) 0%, var(--kSenaryColor) 100%);
        }
        .swiper-tab-link:hover {
            transform: translateY(-2px);
            box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
        }
        .swiper-tab-link.active {
            background: linear-gradient(135deg, var(--kSenaryColor) 0%, var(--kQuinaryColor) 100%);
            color: white;
            padding: 2rem 1.5rem;
        }
        .swiper-tab-link.active .swiper-tab-title { color: white; margin-bottom: 0.75rem; }
        .swiper-tab-link.active .swiper-tab-content { color: rgba(255, 255, 255, 0.9); max-height: 200px; opacity: 1; margin-bottom: 1.5rem; }
        
        .swiper-tab-title {
            font-size: 1.5rem;
            font-weight: 700;
            margin: 0.5rem;
            color: white;
            transition: all 0.3s ease;
        }
        .swiper-tab-content {
            font-size: 0.95rem;
            line-height: 1.6;
            color: #666;
            margin-bottom: 1.5rem;
            max-height: 0;
            opacity: 0;
            overflow: hidden;
            transition: all 0.4s ease;
            display: none;
        }
        .swiper-tab-link.active p.swiper-tab-content { display: block; }

        /* Progress Bar */
        .swiper-pagination-progress {
            position: relative;
            display: flex;
            align-items: center;
            height: 4px;
            background: rgba(0, 0, 0, 0.1);
            border-radius: 2px;
            overflow: hidden;
            max-height: 0;
            opacity: 0;
            transition: all 0.3s ease;
        }
        .swiper-tab-link.active .swiper-pagination-progress { max-height: 4px; opacity: 1; background: rgba(255, 255, 255, 0.2); }
        .swiper-pagination-bar {
            position: absolute; top: 0; left: 0;
            height: 100%; width: 100%;
            background: rgba(0, 0, 0, 0.1);
        }
        .swiper-pagination-bar-active {
            position: absolute; top: 0; left: 0;
            height: 100%; width: 0%;
            background: white;
            transition: width 0.1s linear;
            border-radius: 2px;
        }

        /* Play/Pause Button */
        .progress-toggle-btn {
            position: absolute; right: 1rem; bottom: 1rem;
            transform: translateY(-50%);
            width: 20px; height: 20px;
            border: none; z-index: 2;
            background: transparent;
            border-radius: 50%;
            cursor: pointer;
            display: flex; align-items: center; justify-content: center;
            font-size: 1.2rem;
            opacity: 0;
            transition: all 0.3s ease;
        }
        .swiper-tab-link.active .progress-toggle-btn { opacity: 1; }
        .progress-toggle-btn .pause-icon { display: block; }
        .progress-toggle-btn .play-icon { display: none; }
        .progress-toggle-btn.paused .play-icon { display: block; }
        .progress-toggle-btn.paused .pause-icon { display: none; }

        /* Swiper Slides (Right Side) */
        .swiper-slide-container {
            height: 41rem;
            border-radius: 24px;
            overflow: hidden;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
            position: relative;
        }
        .swiper-slide {
            position: absolute; top: 0; left: 0;
            width: 100%; height: 100%;
            opacity: 0;
            background-size: cover; background-position: center; background-repeat: no-repeat;
            display: flex; align-items: center; justify-content: center;
            transition: opacity 0.3s ease-in-out;
        }
        .swiper-slide.active { opacity: 1; }

        /* Specific Backgrounds */
        .managed-co-managed-IT { background: url('/assets/images/KamNic/7856-alt.webp') center no-repeat; }
        .cyber-security-and-business-continuity { background: url('/assets/images/KamNic/7599.webp') right top no-repeat; }
        .cloud-services { background: url('/assets/images/KamNic/7649.webp') right top no-repeat; }
        .IT-consulting { background: url('/assets/images/KamNic/Amir-nb.webp') right top no-repeat; }     
        .technology-integration { background: url('/assets/images/KamNic/7842.webp') center top no-repeat; }
        .artificial-intelligence { background: url('/assets/images/KamNic/7751.webp') center no-repeat; }

        /* Slide Overlay & Animations */
        .slide-overlay {
            background: rgba(0, 0, 0, 0.7);
            backdrop-filter: blur(10px);
            border-radius: 20px;
            padding: 2.5rem;
            color: white;
            max-width: 500px; width: 90%;
            text-align: left;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
            opacity: 0;
            transform: translateY(50px);
            transition: all 0.6s ease;
        }
        .slide-title { font-size: 1.8rem; font-weight: 700; margin-bottom: 1.5rem; color: white; }
        .slide-bullets { list-style: none; padding: 0; margin: 0; }
        .slide-bullets li { position: relative; padding-left: 2rem; margin-bottom: 1rem; font-size: 1rem; color: rgba(255, 255, 255, 0.9); }
        .slide-bullets li:before {
            content: "✓"; position: absolute; left: 0; top: 0;
            width: 24px; height: 24px;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            border-radius: 50%;
            display: flex; align-items: center; justify-content: center;
            font-size: 0.8rem; font-weight: bold; color: white;
        }

        /* Specific Slide Animations */
        .slide-overlay.animation-7 { transform: translateX(-80px) translateY(80px); }
        .swiper-slide.active .slide-overlay.animation-7 { opacity: 1; transform: translateX(0) translateY(0); transition-delay: 0.5s; }
        
        .slide-overlay.animation-8 { transform: translateX(80px) translateY(-80px); }
        .swiper-slide.active .slide-overlay.animation-8 { opacity: 1; transform: translateX(0) translateY(0); transition-delay: 0.5s; }

        /* --- 8. PARTNER SECTION --- */
        section.kPartnerSection img { height: 2.8rem; max-height: 3rem; }
        img.kPartnerAcronis { padding: 0.2rem 0; }
        img.kPartnerGoogle { max-height: unset !important; height: 3.2rem !important; }
        img.kPartnerCisco { height: 4.3rem !important; max-height: unset !important; }
        img.kPartnerPersis { max-height: unset !important; height: 7.5rem !important; padding-top: 0.5rem; }

        .kPartnerSection .col-12 > div { transition: all 0.3s ease; cursor: pointer; }
        .kPartnerSection .col-12 > div:hover { transform: translateY(-8px); box-shadow: 0 15px 35px rgba(0, 0, 0, 0.12); }
        
        section#KamNic-Tech-Stack .brand-icon {
                min-width: 2.25rem;
                min-height: 2.25rem;
        }

        section#KamNic-Tech-Stack span {
                font-size: 0.7rem;
        }
        /* --- 9. CONTACT / LOCATIONS --- */
        .contact-card {
            position: relative; height: 40rem;
            border-radius: 8px; overflow: hidden;
        }
        .contact-card:hover {
            transform: translateY(-5px) scale(1.015);
            transition: transform 250ms;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
        }
        .contact-card::before {
            content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1;
        }
        .contact-card-content {
            position: relative; z-index: 2; height: 100%;
            display: flex; flex-direction: column;
        }
        .spacer { flex-grow: 1; }
        .contact-header, .contact-info { background: transparent; }
        .info-item {
            background: var(--kSecondaryColor);
            backdrop-filter: blur(5px);
            border-radius: 12px;
            padding: 1rem; margin-bottom: 1rem;
            border: 1px solid rgba(255, 255, 255, 0.2);
            transition: all 0.3s ease;
        }
        .info-item:hover { background: var(--kQuaternaryColor); transform: translateY(-2px); }
        .info-item:last-child { margin-bottom: 0; }
        .info-text { color: #ffffff; font-weight: 500; margin: 0; }
        .icon-bg {
            background: rgba(255, 255, 255, 0.9);
            border-radius: 50%;
            width: 48px; height: 48px;
            display: flex; align-items: center; justify-content: center;
            flex-shrink: 0;
        }

        /* --- 10. FOOTER & VIDEO UPDATED --- */
        .video-footer { position: relative; overflow: hidden; }

        #kFooterVideo {
            position: absolute; top: 0; left: 0;
            width: 100%; height: 100%;
            object-fit: cover; z-index: 1;
        }

        .video-overlay {
            position: absolute; top: 0; left: 0; width: 100%; height: 100%;
            background: rgba(26, 26, 26, 0.85); z-index: 2;
            mask: radial-gradient(circle 17rem at 49% 47%, transparent 0%, transparent 30%, black 50%, black 100%);
            -webkit-mask: radial-gradient(circle 17rem at 49% 47%, transparent 0%, transparent 30%, black 50%, black 100%);
            
            /* Default State: Hidden */
            opacity: 0; 
        }

        /* Only animate when parent has .in-view class */
        .video-footer.in-view .video-overlay {
            animation: fadeInSpotlight 3s ease-out 2s both;
        }

        .video-overlay::before {
            content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
            background: rgba(26, 26, 26, 0.85);
            mask: radial-gradient(circle 12rem at 22% 33%, transparent 0%, transparent 30%, black 50%, black 100%);
            -webkit-mask: radial-gradient(circle 12rem at 22% 33%, transparent 0%, transparent 30%, black 50%, black 100%);
            
            /* Default State: Visible so it can fade out? 
               Actually, the keyframe 0% sets opacity 1. 
               We rely on the animation to handle visibility. */
        }

        /* Trigger pseudo-element animation */
        .video-footer.in-view .video-overlay::before {
            animation: fadeOutSpotlight 3s ease-out 0.8s both;
        }

        @keyframes fadeInSpotlight { 0% { opacity: 0; } 100% { opacity: 1; } }
        @keyframes fadeOutSpotlight { 0% { opacity: 1; } 100% { opacity: 0; } }

        .footer-content { position: relative; z-index: 3; }
        .kEmpty { width: 100%; height: 130px; }

        /* Curved Text */
        .curved-text {
            position: absolute; top: 41%; left: 49%;
            transform: translate(-50%, -50%);
            width: 480px; height: 480px;
            z-index: 4; 
            
            /* Default State: Hidden */
            opacity: 0; 
        }

        /* Trigger text animation */
        .video-footer.in-view .curved-text {
            animation: fadeInCurvedText 2s ease-out 4s both;
        }

        .curved-text svg { width: 100%; height: 100%; }
        .curved-text text {
            fill: #ffffff;
            font-size: 1rem; font-weight: 600; font-family: Arial, sans-serif;
            letter-spacing: 2px;
            text-shadow: 2px 2px 4px rgba(0,0,0,0.8);
        }

        @keyframes fadeInCurvedText {
            0% { opacity: 0; transform: translate(-50%, -50%) scale(0.8); }
            100% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
        }

        /* --- 11. TOOLTIPS --- */
        .tooltip.kTooltip .tooltip-inner {
            text-align: center; white-space: normal;
            box-shadow: 0 10px 30px rgba(0,0,0,.25);
            background-color: var(--kQuaternaryColor);
        }
        .tooltip-inner h6 { font-size: 1.2rem; }

        /* --- 12. MOBILE MEDIA QUERIES --- */
        .mobile-accordion-wrapper { display: none; }

        @media (max-width: 991.98px) {
            #kHero .container.kContainerPrime {
                height: auto !important;
                min-height: calc(100vh - 100px) !important;
                padding-top: 8rem !important; /* Increase this value as needed */
                justify-content: flex-start !important;
            }
            
            #kHero .container.kContainerPrime > .row {
                margin-left: 0 !important;
                margin-right: 0 !important;
                width: 100% !important;
            }

            #kHero .container.kContainerPrime > .row { margin-top: auto !important; margin-bottom: auto !important; }
            #kHero h1 { font-size: clamp(1.75rem, 6vw, 2.5rem) !important; }
/*            #kHero h1 br { display: none; }*/

            .contact-card { min-height: 35rem; margin-bottom: 2rem; }

            section#KamNic-IT-Solutions ul h3 {
                font-size: 1.35rem;
            }
        }

        @media (max-width: 768px) {
            /* Mobile Accordion Logic */
            .swiper-slide-container, .col-md-6 .swiper-slide-container { display: none !important; }
            .swiper-tab-link {
                cursor: pointer; padding-bottom: 15px; margin-bottom: 15px;
                border-bottom: 1px solid #eee;
            }
            .mobile-accordion-wrapper {
                display: grid; grid-template-rows: 0fr;
                transition: grid-template-rows 0.3s ease-out; overflow: hidden;
            }
            .mobile-accordion-wrapper .slide-bullets { min-height: 0; margin-top: 0; opacity: 0; transition: opacity 0.3s ease-out; }
            .swiper-tab-link.mobile-active .mobile-accordion-wrapper { grid-template-rows: 1fr; margin-top: 15px; }
            .swiper-tab-link.mobile-active .mobile-accordion-wrapper .slide-bullets { opacity: 1; }
            .swiper-tab-link .progress-toggle-btn { display: none; }



            section.kPartnerSection img {
                max-height: 2rem !important;
                width: auto;
            }
            .kPartnerCard {
                max-width: 20rem;
                margin:auto;
            }
            img.kPartnerPersis {
                min-height: 5rem;
            }

            img.kPartnerCisco {
                min-height: 3.5rem;
            }
            
            /* Other Mobile */
            .curved-text { width: 320px; height: 320px; }
            .curved-text text { font-size: 20px; }

            .video-overlay {
                mask: radial-gradient(circle 14rem at 49% 47%, transparent 0%, transparent 30%, black 50%, black 100%);
                -webkit-mask: radial-gradient(circle 14rem at 49% 47%, transparent 0%, transparent 30%, black 50%, black 100%);
                
                /* Default State: Hidden */
                opacity: 0; 
            }

            div#kTagLine {
                transform: translate(0, -50px);
                background: rgb(40 41 42 / 33%);
            }

            img#kamnic-logo1 {
                transform: scale(0.6);
                margin-bottom: 0 !important;
                padding-bottom: 0 !important;
            }

            img#kamnic-logo2 {
                width: auto;
                max-height: 2.5rem;
            }


            #kTagLine {
                gap: 0 !important;
                padding-bottom: 1rem;
                padding-top: 1rem;
            }
            
            #kTagLine img {
                margin-bottom: 4px !important; /* or 0 if you want them touching */
            }
            
            #kTagLine h6 {
                font-size: 90%;
                padding-left: 0 !important;
                margin-left: 0 !important;
            }

            .curved-text textPath {
                font-size: 1rem;
            }

            .footer-content {
                padding-left: 12px;  /* reduce from default ~24px */
                padding-right: 12px;
            }

        }

        @media (max-width: 576px) {
            .contact-card { min-height: 30rem; }
            .info-item { padding: 0.75rem; }
            .icon-bg { width: 40px; height: 40px; }
            .info-text { font-size: 0.875rem; }
            .curved-text { width: 320px; height: 320px; }
            .curved-text text { font-size: 20px; }
        }