/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*
    Add your custom styles here
*/


/* ----------------------------- */
/* BASIC RESET                   */
/* ----------------------------- */

*, *::before, *::after {
    box-sizing: border-box;
}

html, body {
    margin: 0;
    padding: 0;
	width:100%;
	max-width:100%;
overflow-x:hidden;
    scroll-behavior: smooth;
}

/* Remove default WP/Elementor margins */
p, h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
}

/* Optional: remove bottom margin from last element in a container */
.elementor-widget-container > *:last-child {
    margin-bottom: 0 !important;
}

/* Remove default UL/OL padding */
ul, ol {
    padding-left: 1.2rem;
    margin-top: 0;
}

/* Remove paragraph bottom margin globally */
p {
    margin-bottom: 0;

}

/* Make images responsive */
img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* ----------------------------- */
/* TYPOGRAPHY CLEANUP            */
/* ----------------------------- */

/* Improve heading line-height consistency */
h1, h2, h3, h4, h5, h6 {
    line-height: 1;
    font-weight: inherit; /* Let Elementor handle it */
}

/* Remove weird spacing between headings + elements */
.elementor-heading-title + p {
    margin-top: 0.5rem;
}

/* ----------------------------- */
/* ELEMENTOR GENERAL FIXES       */
/* ----------------------------- */


/* Remove image widget default bottom padding */
.elementor-widget-image {
    margin-bottom: 0;
}

/* Remove spacer margins on mobile */
@media (max-width: 767px) {
    .elementor-spacer-inner {
        height: var(--spacer-mobile, 20px) !important;
    }
}

/* ----------------------------- */
/* LINKS & BUTTONS               */
/* ----------------------------- */

a {
    text-decoration: none;
    color: inherit;
}

a:hover {
    
    transition: all 0.2s ease;
}

/* Remove ugly default button spacing */
.elementor-button {
    margin: 0;
  
}

/* ----------------------------- */
/* IMAGES & MEDIA                */
/* ----------------------------- */

figure {
    margin: 0;
}

/* Remove Elementor Image box spacing */
.elementor-widget-image-box .elementor-image-box-img {
    margin-bottom: 0;
}

/* ----------------------------- */
/* FORMS                         */
/* ----------------------------- */



/* Remove WP default form margin */
form p {
    margin-bottom: 0 !important;
}

/* ----------------------------- */
/* GLOBAL UTILITIES (optional)   */
/* ----------------------------- */

/* Smooth fade-in utility */
.fade-in {
    opacity: 0;
    transform: translateY(10px);
    transition: all 0.4s ease;
}
.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}

.shrinker {
	background: transparent;
width:100% !important;
	transition: all .2s linear!important;
	-webkit-transition: all .2s linear!important;
	-moz-transition: all .2s linear!important;
}

.shrinker.elementor-sticky--effects {
	background:#124549;
	width: 100% !important;
	transition: all .2s linear!important;
	-webkit-transition: all .2s linear!important;
	-moz-transition: all .2s linear!important;
	box-shadow: 0 10px 30px rgb(143 143 143 / 10%);

}

.elementor-button .elementor-button-icon{
	font-size:10px!important;
	transform: translateY(0px)!important;
}

.white-btn .elementor-button {
    display: inline-block;
}

.white-btn .elementor-button .elementor-button-text {
    --h: 1.2em;
    color: transparent;
    line-height: var(--h);
    overflow: hidden;
    text-shadow: 
        0 calc(-1 * var(--t, 0em)) #040E0F,
        0 calc(var(--h) - var(--t, 0em)) #040E0F;
    transition: .3s;
}

.transparent-btn .elementor-button .elementor-button-text {
    --h: 1.2em;
    color: transparent;
    line-height: var(--h);
    overflow: hidden;
    text-shadow: 
        0 calc(-1 * var(--t, 0em)) #ffffff,
        0 calc(var(--h) - var(--t, 0em)) #ffffff!important;
    transition: .3s;
}

.white-btn .elementor-button:hover .elementor-button-text {
    --t: var(--h);
}

.white-btn .elementor-button .elementor-button-icon {
    transform: translateY(1.5px);
}




/* za belo dugme sa duplim borderom */
.white-btn .elementor-button {
    position: relative;
    z-index: 1;
    border-radius: 4px; /* isti radius kao dugme */
    background: white;
    border: 1px solid #d0d7e2; /* unutrašnji border (po potrebi promeni) */
}

/* spoljašnji border */
.white-btn .elementor-button:after {
    content: "";
    position: absolute;
    top: -4px;    /* udaljenost – pravi onaj “gap” efekat */
    left: -4px;
    right: -4px;
    bottom: -4px;

    border-radius: 6px; /* 10px više od radiusa unutrašnjeg — da bude čist */
    border: 1px solid rgb(68 241 255 / 30%); /* spoljašnji border fade */
    z-index: -1;
}






/* specific sections */

.feature-box {
    position: relative;
    flex: 1;
}


.feature-box:not(:last-child)::after {
    content: "";
    position: absolute;
    right: -32px; 
    top: 25%;
    height: 50%; 
    width: 1px;
    background: #13a3ae29;
}


@media (max-width: 1024px) {
    .feature-box {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .feature-box::after {
        content: none;
    }

    .feature-box:nth-child(odd)::after {
        content: "";
        position: absolute;
        right: 0px;    
        top: 25%;
        height: 50%;
        width: 1px;
        background: #13a3ae29;
    }
}

@media (max-width: 768px) {

    .feature-box {
        flex: 0 0 100%;
        max-width: 100%;
    }

    /* Ugasimo sve pseudo-linije na mobile */
    .feature-box::after {
        content: none !important;
    }

   
    .feature-box:not(:last-child) {
        border-bottom: 1px solid #13a3ae29;
        padding-bottom: 24px;   
        margin-bottom: 24px;    
    }
}


.promise-icon-box .elementor-icon-box-wrapper{
    height: 100%;
}

.promise-icon-box .elementor-icon-box-wrapper .elementor-icon-box-icon{
   margin-bottom: 208px;
}

@media(max-width:1024px){
    
.promise-icon-box .elementor-icon-box-wrapper .elementor-icon-box-icon{
   margin-bottom: 160px;
}
}




.our-identity {
    position: relative;
    overflow: hidden;
}


.our-identity::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    inset: 0;
    background-image: 
        linear-gradient(to right, #166970 1px, transparent 1px);
    background-size: 64px 100%; /* širina kolone – promeni ako treba */
    opacity: 0.06; /* da bude suptilno kao na screenshotu */
    pointer-events: none;
}


.our-identity::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    inset: 0;
    background-image: 
        linear-gradient(to bottom, #166970 1px, transparent 1px);
    background-size: 100% 64px; /* visina reda */
    opacity: 0.06;
    pointer-events: none;
}




.left-icon img{
    width: 48px!important;
    height: 48px!important;
   
}

.left-icon {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    color: #C4CACA;
    font-size: 24px;
    transition: color 0.2s ease-in-out;
}

.e-n-accordion-item{
    border: 1px solid #f0fcfc3b;
    border-radius: 4px;
}

.mission-accordion .e-n-accordion-item-title{
    display: flex!important;
  justify-content: space-between!important;
}

.mission-accordion .e-n-accordion-item {
    border: 1px solid #f0fcfc3b;
    border-radius: 4px;
    background: transparent;
    transition: border 0.2s ease-in-out;
}

.mission-accordion .e-n-accordion-item:hover {
    border: 1px solid #f0fcfc5e;
    
}

.mission-accordion .e-n-accordion-item:hover .left-icon {
    
    color: #ffffff;
    
}
   
.mission-accordion .e-n-accordion-item.is-active {
    border: 1px solid #13A3AE;
    background: #13a3ae17;
}

.mission-accordion .e-n-accordion-item.is-active .left-icon {
    color: #ffffff;
}



.img-diagonal-overlay {
    position: relative;
    overflow: hidden;
}

.img-diagonal-overlay::after {
    content: "";
    position: absolute;
    inset: 0; 
    background: linear-gradient(
        to top left,
        rgba(7, 31, 33, 0.7) ,   /* jak black u donjem desnom */
        rgba(7, 31, 33, 0)      /* 0% black (transparent) u gornjem levom */
    );
    pointer-events: none;
}

.lead-form div.wpforms-container-full:not(:empty){
    margin: 0 auto!important;
}

.lead-form .wpforms-container .wpforms-field{
    padding: 8px 0!important;
}

@media (max-width: 768px) {
    .wpforms-field.wpforms-one-half,
    .wpforms-field.wpforms-one-third,
    .wpforms-field.wpforms-two-thirds {
        width: 100% !important;
        float: none !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
    }
}



.lead-form button{
    transition: all 0.3 ease!important;
    font-size: 16px!important;
    padding: 20px 32px!important;
    height: auto!important;
    line-height: 1.3em!important;
	background-color:white;
}


.lead-form button:hover{
    background-color:#F0FCFC!important;
	background:#F0FCFC!important;
}

@media(max-width:768px){
	.lead-form button{
   
    font-size: 14px!important;
		padding:20px auto;
		width:100%!important;
		max-width:100%!important;
   
}
}




.wpforms-container{
	background:transparent!important;
	background-image: none !important;
}

#wpforms-form-727{
	background:transparent!important;
	background-image: none !important;
}

.wpforms-field-container{
	background:transparent!important;
	background-image: none !important;
	
	
}


body,
button,
input,
select,
textarea {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}






/* Vertical client logos marquee */
.client-marquee {
  width: 100%;
  display: flex;
  justify-content: center;
  background: #ffffff; 
}

.client-marquee-inner {
  position: relative;
  width: 100%;
  max-width: 1200px;
  box-sizing: border-box;
  overflow: hidden;
}

.client-marquee-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  height: 420px;
  overflow: hidden;
}

@media (min-width: 768px) {
  .client-marquee-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    height: 520px; /* visina prozora na desktopu */
  }

  
}

.client-marquee-col {
  display: flex;
  flex-direction: column;
  gap: 14px;
  will-change: transform;
}

@media (min-width: 768px) {
  .client-marquee-col {
    gap: 18px;
  }
}

/* Kartica logotipa */
.client-logo {
  position: relative;
  width: 100%;
  height: 100px;                      /* fiksna visina – svi isti */
  border-radius: 4px;
 border: 1px solid rgba(169, 185, 186, 0.2);        
  background: radial-gradient(
    circle at top left,
    rgba(255, 255, 255, 0.5) 0%,   /* White ~50% */
    rgba(240, 252, 252, 0.5) 100% /* Lightest Bg ~50% */
  );                                 /* White -> Lightest Bg -> Text Dark Bg */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px 64px;
  box-sizing: border-box;
  box-shadow: 0 6px 18px -14px rgba(4, 14, 15, 0.20);
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    border-color 0.25s ease,
    filter 0.25s ease;
  overflow: hidden;
}

@media(max-width:768px){
	.client-logo{
		padding:16px;
	}
}

.client-logo img {
  width: auto;
  height: 100%;
  max-width: 100%;
  object-fit: contain;
  display: block;
  filter: grayscale(1);
  opacity: 0.9;
  transition:
    filter 0.25s ease,
    opacity 0.25s ease,
    transform 0.25s ease;
}

/* Hover efekat – malo “brand” naglašavanje */
.client-logo:hover {
  transform: translateY(-2px) ;
  box-shadow: 0 10px 22px -18px rgba(4, 14, 15, 0.34);
  border-color: rgba(63, 241, 255, 0.8); /* Secondary, malo suptilniji */
}

.client-logo:hover img {
  filter: grayscale(0);
  opacity: 1;
  transform: scale(1.03);
}

/* top & bottom fade overlays */
.client-marquee-overlay {
  position: absolute;
  left: 0;
  right: 0;
  height: 96px;
  pointer-events: none;
  z-index: 2;
}

@media(max-width:767px){
	.client-marquee-overlay {
  
  height: 56px;
 
}
}

.client-marquee-overlay-top { top: 0; background: linear-gradient( to bottom, #ffffff 0%, rgba(255, 255, 255, 0.95) 40%, rgba(255, 255, 255, 0) 100% ); } .client-marquee-overlay-bottom { bottom: 0; background: linear-gradient( to top, #ffffff 0%, rgba(255, 255, 255, 0.95) 40%, rgba(255, 255, 255, 0) 100% ); }