/*
Theme Name: Martex Demo 26
Theme URI: https://example.com/
Author: Converted by ChatGPT for Martin
Description: Martex HTML Demo-26 converted into a simple WordPress theme.
Version: 1.0
Text Domain: martex-demo-26
*/

/* Primary-color */
:root{
    --primary-color:#720eec;
}


.features-section .icon svg path {
    fill:#f74780;
    width: 50px;
    height: 50px;

}
.features-section .ico-50 .shape-ico .icon  {
    background-image: url("https://funnelsystem.ch/wp-content/uploads/2025/11/shape.png");
    content: '';
    width: 130px;
    height:90px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 70%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.features-section .ico-50 .shape-ico .icon  svg{
    width:50px;
    height: 50px;
    position: unset;
    top:unset;
    left:unset;
}

 /* Wrapper pill container */
    .martex-tabs-wrapper {
      display: inline-block;
      padding: 4px;
      border-radius: 999px;
      background: linear-gradient(90deg, #f6f6f8 0%, #f9f9fb 100%);
      box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06);
    }

    .martex-tabs-wrapper button{
        border-radius: 100px !important;
    }

    .nav-pills .nav-link.active{
        --bs-nav-pills-link-active-bg:#720eec;
    }

    .martex-tabs .nav-link{
         --bs-nav-link-color:#353f4f;
    }

     .nav-link:not(.active):hover{
         color:var(--primary-color) ;
     }

    /* Base nav styles */
    .martex-tabs {
      --bs-nav-link-padding-x: 1.8rem;
      --bs-nav-link-padding-y: 0.55rem;
      --bs-nav-link-font-weight: 500;
      --bs-nav-link-font-size: 0.95rem;
      --bs-nav-link-color: #111827;
      --bs-nav-pills-link-active-bg: #ffffff;
    }

    .martex-tabs .nav-link {
      border-radius: 999px;
      border: 1px solid transparent;
      background: transparent;
      color: var(--bs-nav-link-color);
      font-weight: var(--bs-nav-link-font-weight);
      font-size: var(--bs-nav-link-font-size);
      letter-spacing: 0.01em;
      transition: all 0.18s ease-out;
      white-space: nowrap;
    }

    .martex-tabs .nav-link:hover {
      background: rgba(255, 255, 255, 0.45);
    }

    .martex-tabs .nav-link.active {
      background: #ffffff;
      border-color: rgba(148, 163, 184, 0.7);
      color: #000000;
      box-shadow: 0 4px 10px rgba(15, 23, 42, 0.08);
    }

    /* Optional demo content styling */
    .tab-content {
      margin-top: 24px;
      max-width: 640px;
    }
    /* .tab-pane {
      background: #ffffff;
      border-radius: 20px;
      padding: 24px 28px;
      box-shadow: 0 18px 45px rgba(15, 23, 42, 0.08);
      border: 1px solid #e5e7eb;
    } */


    #hero-26{
    background: linear-gradient(135deg, #6A5CF6 0%, #8E3BFF 100%);

    }



    /* Creative Title Styles */
.title-gradient {
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	position: relative;
	display: inline-block;
}

/* .title-gradient::after {
	content: '';
	position: absolute;
	bottom: -5px;
	left: 0;
	width: 100%;
	height: 3px;
	background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
	border-radius: 2px;
} */

/* Feature Number Styling */
.feature-number {
	display: inline-block;
	font-size: 0.85em;
	color: var(--theme-color, #667eea);
	font-weight: 700;
	margin-right: 8px;
	opacity: 0.7;
}

/* Text Highlight */
.text-highlight {
	position: relative;
	display: inline-block;
	color: var(--theme-color, #667eea);
	font-weight: 700;
}

.text-highlight::before {
	content: '';
	position: absolute;
	bottom: 2px;
	left: -2px;
	right: -2px;
	height: 8px;
	background: rgba(102, 126, 234, 0.15);
	z-index: -1;
	border-radius: 2px;
}

/* Enhanced Feature Box Titles */
.fbox-txt h6 {
	line-height: 1.4;
	margin-bottom: 15px;
	transition: all 0.3s ease;
}

.fbox-11:hover .fbox-txt h6 {
	transform: translateX(5px);
}

/* Responsive adjustments */
@media (max-width: 768px) {
	.title-gradient::after {
		height: 2px;
		bottom: -3px;
	}
	
	.feature-number {
		font-size: 0.8em;
	}
}




/* ===================================
   FEATURES-2 ENHANCED STYLES
   =================================== */

/* Title Enhancements */
.text-highlight-gradient {
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	font-weight: 700;
	position: relative;
	display: inline-block;
}

.ai-badge {
	display: inline-block;
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	color: #fff;
	padding: 4px 16px;
	border-radius: 20px;
	font-size: 0.9em;
	font-weight: 700;
	margin:20px 8px;
	box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
	animation: pulse-glow 2s ease-in-out infinite;
}

@keyframes pulse-glow {
	0%, 100% {
		box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
	}
	50% {
		box-shadow: 0 4px 25px rgba(102, 126, 234, 0.5);
	}
}

/* Feature Box Enhancements */
.fbox-2 {
	position: relative;
	padding: 30px 20px;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 5px 30px rgba(0, 0, 0, 0.08);
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	height: 100%;
	overflow: hidden;
}

.fbox-2::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.4s ease;
}

.fbox-2:hover {
	transform: translateY(-10px);
	box-shadow: 0 15px 50px rgba(102, 126, 234, 0.2);
}

.fbox-2:hover::before {
	transform: scaleX(1);
}

/* Feature Badge */
.feature-badge {
	position: absolute;
	top: 20px;
	right: 20px;
	z-index: 10;
	display: flex;
	align-items: center;
	gap: 8px;
}

.badge-number {
	display: inline-block;
	width: 36px;
	height: 36px;
	line-height: 36px;
	text-align: center;
	background: rgba(102, 126, 234, 0.1);
	color: #667eea;
	border-radius: 50%;
	font-weight: 700;
	font-size: 14px;
	transition: all 0.3s ease;
}

.fbox-2:hover .badge-number {
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	color: #fff;
	transform: rotate(360deg);
}

.popular-tag {
	background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
	color: #fff;
	padding: 4px 12px;
	border-radius: 12px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	animation: bounce 2s ease-in-out infinite;
}

@keyframes bounce {
	0%, 100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(-5px);
	}
}

/* Image Container Enhancements */
.fbox-img {
	border-radius: 12px;
	margin-bottom: 25px;
	position: relative;
	overflow: hidden;
}

.image-overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(135deg, rgba(102, 126, 234, 0.1) 0%, rgba(118, 75, 162, 0.1) 100%);
	opacity: 0;
	transition: opacity 0.4s ease;
	z-index: 1;
}

.fbox-2:hover .image-overlay {
	opacity: 1;
}

.fbox-img img {
	transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.fbox-2:hover .fbox-img img {
	transform: scale(1.08);
}

/* AI Icon */
.ai-icon {
	position: absolute;
	bottom: 15px;
	left: 15px;
	width: 50px;
	height: 50px;
	background: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(10px);
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #667eea;
	opacity: 0;
	transform: translateY(10px);
	transition: all 0.4s ease;
	z-index: 2;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.fbox-2:hover .ai-icon {
	opacity: 1;
	transform: translateY(0);
}

/* Text Content */
.fbox-txt h6 {
	margin-bottom: 15px;
	color: #1a1a1a;
	transition: color 0.3s ease;
}

.fbox-2:hover .fbox-txt h6 {
	color: #667eea;
}

.fbox-txt p {
	line-height: 1.7;
	color: #666;
	margin-bottom: 15px;
}

/* Feature Link */
.feature-link {
	margin-top: 15px;
	opacity: 0;
	transform: translateY(10px);
	transition: all 0.4s ease;
}

.fbox-2:hover .feature-link {
	opacity: 1;
	transform: translateY(0);
}

.feature-link span {
	color: #667eea;
	font-weight: 600;
	font-size: 15px;
	cursor: pointer;
	transition: all 0.3s ease;
	display: inline-block;
}

.feature-link span:hover {
	color: #764ba2;
	transform: translateX(5px);
}

/* Row Gap Enhancement */
.g-4 {
	--bs-gutter-y: 2rem;
	--bs-gutter-x: 2rem;
}

/* Responsive Adjustments */
@media (max-width: 991px) {
	.fbox-2 {
		padding: 25px 15px;
		margin-bottom: 30px;
	}
	
	.ai-badge {
		padding: 3px 12px;
		font-size: 0.85em;
	}
	
	.feature-badge {
		top: 15px;
		right: 15px;
	}
}

@media (max-width: 767px) {
	.text-highlight-gradient {
		display: block;
		margin: 10px 0;
	}
	
	.ai-badge {
		display: block;
		width: fit-content;
		margin: 15px auto 0;
	}
	
	.fbox-2 {
		margin-bottom: 25px;
	}
	
	.popular-tag {
		font-size: 10px;
		padding: 3px 8px;
	}
}

/* Animation Delays for Staggered Effect */
.wow.fadeInUp {
	animation-duration: 0.8s;
}

.function-section .text-highlight::before{
	z-index: 9;
}
.features-section .fbox-7{
	height: 100% !important;
}