/*
Theme Name:  TKX | Hello Elementor Child
Template: hello-elementor
Version: 1.0.0
Description: Child theme for Hello Elementor with per-page and post-type file management system. Supports automatic file loading, admin file manager, and Elementor templates.
Author: TKX Media
Author URI: https://tkxmedia.com/
Text Domain: hello-elementor-child
*/

/* ============================================
   Global Styles
   ============================================ */

/* Custom CSS goes below this line */

@media screen and (max-width: 450px) {
	.hero-btn-align {
		flex-direction: column !important;
		justify-content: center !important;
	}
}

body .elementor-widget-text-editor {
    line-height: 1.4em !important;
}

li.elementor-icon-list-item a:hover .elementor-icon-list-text {
    color: #000 !important;
}

.elementor-widget-text-editor p a, 
.elementor-widget-text-editor ul a, 
.elementor-widget-text-editor ol a {
    transition: all 0.2s ease-in-out;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.elementor-widget-text-editor p a:hover, 
.elementor-widget-text-editor ul a:hover, 
.elementor-widget-text-editor ol a:hover,
.c-project-content .single-text a:hover {
    opacity: 0.8 !important;
}

.elementor-widget-text-editor p:last-child {
    margin-bottom: 0 !important;
}

@media screen and (max-width: 767px) {
	.e-con-boxed>.e-con-inner {
		max-width: 95%;
	}
}

/* header css start */

.ashmd-header #menu-1-177a43ae > li > a:hover {
    opacity: .8;
}

body .ashmd-header #menu-1-177a43ae > li > a {
    padding: 0 !important;
    margin: 0  10px!important;
    position: relative;
}

body .ashmd-header #menu-1-177a43ae > li > a:before {
    content: "";
    width: 0;
    height: 2px;
    background: #fff;
    position: absolute;
    opacity: .8;
    bottom: -2px;
    left: 50%;
    transform: translatex(-50%);
    transition: all 0.2s ease-in-out;
}

body .ashmd-header #menu-1-177a43ae > li > a:hover::before,
body .ashmd-header #menu-1-177a43ae > li.current-menu-item > a::before {
    width: 100%;
}

body .ashmd-header #menu-1-177a43ae > li.Menu-BTN > a {
    padding: 8px 20px !important;
    opacity: 1 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

body .ashmd-header #menu-1-177a43ae > li.Menu-BTN > a::before {
	display: none !important;
}

button#rmp_menu_trigger-159 {
    right: 10px !important;
	padding: 0 !important;
	border: unset;
}

@media screen and (max-width: 1180px) {
    .HeaderMenu .menu-item a {
        padding-left: 12px;
        padding-right: 12px;
    }  
}

.Menu-BTN a {
    color: #fff;
    padding: 12px 24px;
    border: 2px solid #fff;
    border-radius: 100px;
    background-color: transparent;
    transition: all .3s ease-in-out;
}

.Menu-BTN a:hover {
    border-color: #293970;
    background-color: #293970;
}

.Menu-BTN a.rmp-menu-item-link {
    display: inline-block !important;
    color: #133868 !important;
    padding: 8px 20px !important;
    border: 1px solid #133868 !important;
    border-radius: 100px;
    background-color: transparent;
    transition: all .2s ease-in-out;
    width: auto !important;
    height: unset !important;
    line-height: 1 !important;
	margin-top: 15px;
	font-size: 15px !important;
	
}

.Menu-BTN a.rmp-menu-item-link:hover {
    color: #fff !important;
    border-color: #293970 !important;
    background-color: #293970 !important;
}

.rmp-menu-subarrow {
    transform: rotate(180deg);
}

.ashmd-header .elementor-nav-menu ul ul a, 
.ashmd-header .elementor-nav-menu ul ul a:active, 
.ashmd-header .elementor-nav-menu ul ul a:focus, 
.ashmd-header .elementor-nav-menu ul ul a:hover {
    border: unset;
}

.ashmd-header ul.elementor-nav-menu--dropdown a, 
.ashmd-header ul.elementor-nav-menu--dropdown a:focus, 
.ashmd-header ul.elementor-nav-menu--dropdown a:hover {
    border: unset !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
}

.ashmd-header {
    position: fixed;
    top: 0;
    left: 0;
}

.ashmd-header, .e-con-inner, #rmp_menu_trigger-159 {
    transition: all .3s ease-in-out;
}

.ashmd-fixed-header {
    background-color: rgba(0, 60, 113, 0.8);
}

.ashmd-fixed-header .e-con-inner {
    padding: 10px 0;
}

/* .mobile-menu-icon-fixed#rmp_menu_trigger-159 {
    top: 12px !important;
}

@media screen and (max-width: 767px) {
	.mobile-menu-icon-fixed#rmp_menu_trigger-159 {
		top: 8px !important;
	}
} */

.HeaderMenu .elementor-nav-menu {
    align-items: center;
}

.HeaderMenu ul li a {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.HeaderMenu ul li.Menu-BTN a {
    padding: 8px 16px !important;
    line-height: 1;
    display: block;
}

.HeaderMenu ul li.Menu-BTN {
    margin-left: clamp(30px, 7vw, 130px) !important;
}

@media screen and (max-width: 1100px) {
    .HeaderMenu ul li.Menu-BTN {
        margin-left: 20px !important;
    }
}

/* Header CSS */

h1 {
    margin: 0 !important;
}

.logged-in .ashmd-header {
    margin-top: 30px;
}

button.rmp_menu_trigger {
    border-color: white;
}

.OtherPages-HeroSection {
	min-height: 500px !important;
	height: 50vw !important;
    max-height: 920px !important;
}

@media screen and (max-width: 1280px) {
	.OtherPages-HeroSection.long-content-mobile {
		min-height: 700px !important;
        height: 60vw !important;
	}
}

@media screen and (max-width: 767px) {
	.OtherPages-HeroSection.long-content-mobile {
		min-height: 720px !important;
        height: 80vw !important;
	}
	.OtherPages-HeroSection.About-page-hero {
		min-height: 400px !important;
	}
	.Menu-BTN a.rmp-menu-item-link {
		font-size: 14px !important;
		padding: 8px 20px !important;
	}
}

@media screen and (max-width: 400px) {
	.OtherPages-HeroSection.long-content-mobile {
		min-height: 840px !important;
        height: 80vw !important;
	}
}

@media screen and (max-width: 1024px) {
    #rmp-menu-title-159 .rmp-menu-title-image {
        width: 100%;
        height: auto !important;
    }
	#rmp-menu-additional-content-159 {
		border: 1px solid #000;
		width: fit-content;
		margin: 0 16px;
		color: #133868 !important;
		font-size: 14px !important;
		border-radius: 100px;
		padding: 8px 25px !important;
		transition: all 0.2s ease-in-out;
	}
	#rmp-menu-additional-content-159:hover {
		background: #133868 !important;
		color: #fff !important;
	}
}

/* header css end */

/* footer css start */

/* Note: #rmp_menu_trigger-159 positioning moved to bottom section */

@media (max-width: 545px) {
	.m-f-width {
		width: 100% !important;
	}
}

@media (min-width: 768px) {
  .c-position-style {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
  }
  .c-position-style.c-position-left {
    left: 0 !important;
  }
}

.c-li-style ul {
    list-style: none;
    padding: 0 !important;
    padding-left: 25px !important;
}

.c-li-style ul li {
    margin-bottom: 15px;
}

.elementor-widget-text-editor > ul:last-child li:last-child,
.elementor-widget-text-editor > ol:last-child li:last-child {
    margin-bottom: 0 !important;
}

.c-li-style ul li:before {
    content: '+';
    font-weight: 500;
    margin-right: 12px;
    display: inline-block;
    font-size: 18px;
    line-height: 1em;
    position: absolute;
    left: 0;
    margin-top: 3px;
}

.my-blur-card {
    backdrop-filter: blur(15px) !important;
    -webkit-backdrop-filter: blur(15px);
}

.c-faq-style .e-n-accordion-item[open] {
    border: 1px solid #E4E7E9;
    border-radius: 6px;
    background-color: #F7F7F7;
}

.c-faq-style .e-n-accordion-item {
    background-color: #F7F7F7;
    border: 1px solid #E4E7E9 !important;
    border-radius: 6px;
    overflow: hidden;
}

/* ========================================
   Performance & CLS Optimizations
   ======================================== */

/* Fix image aspect ratios to prevent distortion */
img {
    height: auto;
    max-width: 100%;
    object-fit: contain;
}

/* Specific fix for menu title image */
#rmp-menu-title-image {
    width: auto !important;
    height: auto !important;
    max-width: 100%;
    object-fit: contain;
}

/* Fix video CLS - CRITICAL: Prevents layout shift */
.elementor-background-video-container {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 100vh !important;
    overflow: hidden !important;
    z-index: 0 !important;
    background-color: #000 !important; /* Fallback while video loads */
}

.elementor-background-video-hosted {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    min-width: 100% !important;
    min-height: 100% !important;
}

/* Performance optimizations */
* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

.elementor-element,
.elementor-widget {
    contain: layout style;
}

.elementor-animated {
    transform: translateZ(0);
    backface-visibility: hidden;
    perspective: 1000px;
}

/* Mobile Performance Optimizations - Video still enabled */
@media (max-width: 768px) {
    /* Reduce animations on mobile for better performance */
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        animation-delay: 0ms !important;
        transition-delay: 0ms !important;
    }
    
    /* Ensure video container has proper dimensions on mobile */
    .elementor-background-video-container {
        min-height: 100vh !important;
    }
    
    /* Note: Image optimization (loading/decoding) handled via JavaScript */
    
    /* Prevent layout shifts */
    .slick-slider,
    .projects-slider {
        min-height: 300px;
        contain: layout style paint;
    }
    
    /* Reduce repaints */
    .elementor-element,
    .elementor-widget {
        contain: layout style paint;
        will-change: auto;
    }
    
    /* EXCEPTION: Don't contain header elements - iOS 18 fix */
    .ashmd-header .elementor-element,
    .ashmd-header .elementor-widget,
    .ashmd-header .elementor-widget-image,
    .ashmd-header .elementor-widget-container {
        contain: none !important;
        will-change: auto !important;
        content-visibility: visible !important;
    }
    
    /* Optimize font loading on mobile */
    * {
        text-rendering: optimizeSpeed;
        -webkit-font-smoothing: subpixel-antialiased;
    }
    
    /* Optimize scrolling */
    * {
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }
    
    /* Reduce paint complexity */
/*     .ashmd-header,
    .elementor-location-header {
        contain: layout style paint;
    } */
    
    /* Prevent FOUC */
    body {
        visibility: visible;
    }
    
    /* Reduce JavaScript execution */
    .elementor-element {
        content-visibility: auto;
    }
    
    /* EXCEPTION: Force header elements visible - iOS 18 fix */
    .ashmd-header .elementor-element,
    .ashmd-header .elementor-widget,
    .ashmd-header .elementor-widget-image,
    .ashmd-header img {
        content-visibility: visible !important;
        contain: none !important;
    }
}

/* ========================================
   Responsive Menu Button - Pure CSS Solution
   When header scrolls, button will also scroll accordingly
   ======================================== */

/* Base button position - always fixed */
#rmp_menu_trigger-159 {
    position: fixed !important;
    right: 10px !important;
    z-index: 999999 !important;
    top: 12px !important;
    transition: top 0.3s ease-in-out !important;
}

/* When header scrolls (ashmd-fixed-header class is active), adjust button position */
/* Using :has() property for modern browsers */
body:has(.ashmd-fixed-header) #rmp_menu_trigger-159,
body:has(.ashmd-header.ashmd-fixed-header) #rmp_menu_trigger-159 {
    top: 8px !important;
}

/* Hide hamburger menu on desktop - only show on tablets and mobile */
@media (min-width: 1025px) {
    #rmp_menu_trigger-159,
    button#rmp_menu_trigger-159 {
        display: none !important;
    }
}


@media (max-width: 400px) {
	#rmp-menu-title-159 {
		padding: 15px;
	}
	#rmp-menu-title-159 img.rmp-menu-title-image {
		width: 180px;
		margin: 0;
	}
	#rmp-menu-wrap-159 .rmp-menu-item-link {
		font-size: 14px;
		width: 180px;
	}
	div#rmp-container-159 {
		min-width: 200px;
		width: fit-content;
	}
}

/* ============================================
   iOS SAFARI COMPATIBILITY FIXES - TARGETED
   Based on actual header structure: .ashmd-header
   ============================================ */

/* Fix YOUR specific header on iOS */
.ashmd-header {
  position: -webkit-fixed !important;
  position: fixed !important;
  -webkit-transform: translateZ(0) !important;
  transform: translateZ(0) !important;
  -webkit-backface-visibility: hidden !important;
  backface-visibility: hidden !important;
  will-change: transform !important;
  z-index: 9999 !important;
}

/* Fix sticky header state on iOS */
.ashmd-header.ashmd-fixed-header {
  -webkit-transform: translateZ(0) !important;
  transform: translateZ(0) !important;
  background-color: rgba(0, 60, 113, 0.8) !important;
}

/* Fix header inner container on iOS */
.ashmd-header .e-con-inner {
  -webkit-transform: translateZ(0) !important;
  transform: translateZ(0) !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Fix logo visibility on iOS - AGGRESSIVE for iPhone 16 Pro */
.ashmd-header .elementor-widget-image,
.ashmd-header .elementor-widget-image img,
.ashmd-header .elementor-widget-image .elementor-image,
.ashmd-header .elementor-widget-image .elementor-image img,
.ashmd-header .elementor-widget-theme-site-logo,
.ashmd-header .elementor-widget-theme-site-logo img,
.ashmd-header img,
.ashmd-header .elementor-image,
.ashmd-header .site-logo,
.ashmd-header .site-branding,
.ashmd-header .custom-logo,
.ashmd-header .custom-logo-link,
.ashmd-header .custom-logo-link img,
.ashmd-header a img,
.ashmd-header .elementor-element img,
.ashmd-header picture,
.ashmd-header picture img {
  position: relative !important;
  -webkit-transform: translateZ(0) !important;
  transform: translateZ(0) !important;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
  pointer-events: auto !important;
}

/* Extra aggressive for Elementor containers in header */
.ashmd-header .elementor-widget-container,
.ashmd-header .elementor-widget-wrap,
.ashmd-header .elementor-column {
  -webkit-transform: translateZ(0) !important;
  transform: translateZ(0) !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Fix YOUR specific Menu-BTN buttons on iOS */
.Menu-BTN a,
.Menu-BTN a.rmp-menu-item-link,
body .ashmd-header #menu-1-177a43ae > li.Menu-BTN > a {
  -webkit-transform: translateZ(0) !important;
  transform: translateZ(0) !important;
  opacity: 1 !important;
  visibility: visible !important;
  display: inline-block !important;
}

/* Fix hero section buttons on iOS (Start Your Project, View Our Work) */
.elementor-button,
.elementor-button-link,
.elementor-button-wrapper a {
  -webkit-transform: translateZ(0) !important;
  transform: translateZ(0) !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Fix mobile menu trigger on iOS - PRESERVE positioning */
#rmp_menu_trigger-159 {
  position: -webkit-fixed !important;
  position: fixed !important;
  right: 10px !important;
  top: 12px !important;
  z-index: 999999 !important;
  -webkit-transform: translateZ(0) !important;
  transform: translateZ(0) !important;
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
}

/* Ensure button stays visible when header is sticky - iOS fix */
body:has(.ashmd-fixed-header) #rmp_menu_trigger-159,
body:has(.ashmd-header.ashmd-fixed-header) #rmp_menu_trigger-159 {
  position: -webkit-fixed !important;
  position: fixed !important;
  top: 5px !important;
  z-index: 999999 !important;
  -webkit-transform: translateZ(0) !important;
  transform: translateZ(0) !important;
}

/* Fix mobile menu logo on iOS */
#rmp-menu-title-159 .rmp-menu-title-image,
#rmp-menu-title-159 img.rmp-menu-title-image {
  -webkit-transform: translateZ(0) !important;
  transform: translateZ(0) !important;
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
}

/* Fix HeaderMenu navigation on iOS */
.HeaderMenu,
.HeaderMenu .elementor-nav-menu,
.HeaderMenu ul li a {
  -webkit-transform: translateZ(0) !important;
  transform: translateZ(0) !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* iOS viewport height fix - ONLY for iOS */
@supports (-webkit-touch-callout: none) {
  .elementor-section {
    min-height: -webkit-fill-available !important;
  }
  
  /* Ensure header stays visible on iOS */
  .ashmd-header {
    -webkit-transform: translate3d(0, 0, 0) !important;
    transform: translate3d(0, 0, 0) !important;
  }
}

/* Force GPU acceleration for smooth scrolling on iOS */
.elementor-section,
.elementor-column,
.elementor-widget-wrap {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* ============================================
   iOS VERSION-SPECIFIC FIXES
   iPhone 16 Pro and newer iOS versions
   ============================================ */

/* Extremely aggressive logo fix for iOS 18+ / iPhone 16 Pro */
@supports (-webkit-backdrop-filter: blur(20px)) {
  /* Modern iOS devices with advanced backdrop filters */
  .ashmd-header *[class*="logo"],
  .ashmd-header *[class*="image"],
  .ashmd-header *[class*="brand"],
  .ashmd-header img {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    -webkit-transform: translate3d(0, 0, 0) !important;
    transform: translate3d(0, 0, 0) !important;
    will-change: auto !important;
    contain: none !important;
  }
  
  /* Force all images in header to be visible */
  .ashmd-header .elementor-widget-container > * {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
}

/* Video performance optimization - General (applies to all pages) */
@media (max-width: 767px) {
  /* Ensure video doesn't block other elements if it plays */
  .elementor-background-video-container {
    z-index: -1 !important;
    pointer-events: none !important;
  }
}