/*
Theme Name: Kord-Electric
Theme URI: https://wpastra.com/
Template: astra
Author: Jonathan Espinoza
Author URI: https://www.linkedin.com/in/jonathan-espinoza-bb3a42204
Description: Child Theme of astra, usable for most use cases.
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.11.16.1764781883
Updated: 2025-12-03 17:11:23

*/

:root {
	--electric-yellow: #f6ff00;
	--animation-rotate: rotate(360deg);
}

.wp-block-cover.billboard-innerpage .wp-block-cover__background {
    background: transparent;
    background-image: url('/wp-content/uploads/2024/06/Banner-bg.webp'); 
    background-repeat: no-repeat;
    background-size: 45% 100%;
    opacity: 1!important;
}

.wp-block-cover.billboard-innerpage .wp-block-cover__image-background {
    width: 71%;
    right: 0;
    left: auto;
}

.wp-block-cover.main-billboard .wp-block-cover__background {
    opacity: 0.5!important;
    background-color: var(--ast-global-color-0);
    width: 60%;
    transform: skewX(-15deg) translateX(-10%);
}

@media only screen and (max-width: 1450px) {
    .wp-block-cover.main-billboard .wp-block-cover__background {
        width: 70%;
        transform: skewX(-15deg) translateX(-20%);
    }
}



.content-card {
	position: relative;
	bottom:0;
	transition: all 150ms ease-in;
	overflow: hidden !important;
}

.content-card:hover {
	background-color: #f0f0f0;
	transform: scale(1.05);
}

h1::after, .wp-block-column h2::after {
	opacity: 0;
	content: "";
	display: block;
	height: 4px;
	width: 30%;
	margin: 10px auto 0 auto;
	background: linear-gradient(90deg, var(--electric-yellow), #ff4325);
	box-shadow: 0 0 14px rgba(255, 211, 0, 0.5);
	animation: slide-in 1250ms ease-in 0.5s 1 forwards;
	will-change: transform, opacity;
}

/* SVG animations */
.gear {
	transform-origin: center;
  	transition: all 1500ms ease;
}
.gear:hover {
	transform: var(--animation-rotate);
}

.arrows line, .arrows polygon {
  stroke-dasharray: 100; approximation */
  stroke-dashoffset: 0;
  transition: stroke-dashoffset 0.5s ease;
}

.arrows:hover line, 
.arrows:hover polygon {
  stroke-dashoffset: 100; 
}



/* end */
.content-container {
	overflow: hidden;
}
.proposition-text {
	position: relative;
	z-index: 5;
}
.object-shape {
	opacity: 0.6;
	position: absolute;
	width: 500px;
	height: 500px;
	bottom: 0;
	left: 0;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	/* background-color: #060c80; */
	border: 5px solid #FFC107;
	/* border-radius: 50% 50% 50% 0; */
	border-width: 5px 5px 0 0;
	z-index: 3;
	background: radial-gradient(circle at center,
	  rgba(0, 162, 255, 0.55),
	  rgba(0, 90, 150, 0.45),
	  rgba(0, 40, 80, 0.20)
	);
	filter: blur(60px);
	border-radius: 50%;
	box-shadow:
	  0 0 80px rgba(0, 180, 255, 0.6),
	  0 0 140px rgba(0, 120, 255, 0.4);

	animation: electricGlow 2s ease-in-out infinite alternate;
}

@keyframes electricGlow {
  0% {
    transform: scale(1) rotate(0deg);
    filter: blur(60px);
  }
  100% {
    transform: scale(1.5) rotate(15deg);
    filter: blur(75px);
  }
}

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