/*
Theme Name: TransformX
Theme URI: 
Author: SS
Author URI: 
Description: Tema za spletno stran transformx.si.
Requires at least: 6.8
Tested up to: 6.8
Requires PHP: 5.7
Version: 
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: transformx
Tags: 
*/

/* style.css (front) - wp_enqueue_scripts */

/*
BACKGROUNDS - MESH GRADIENTS
 */
@keyframes hero-gradient-animation{0%{--c-0:hsla(8.72093023255814,80%,58%,1); --x-0:83%; --y-0:37%; --s-start-0:0%; --s-end-0:62%; --c-1:hsla(182.90322580645162,55%,56%,1); --x-1:17%; --y-1:58%; --s-start-1:0%; --s-end-1:62%;}100%{--c-0:hsla(8.72093023255814,80%,58%,1); --x-0:48%; --y-0:26%; --s-start-0:0; --s-end-0:62; --c-1:hsla(182.90322580645162,55%,56%,1); --x-1:55%; --y-1:47%; --s-start-1:0; --s-end-1:62;}}@property --c-0{syntax:'<color>';inherits:false;initial-value:hsla(8.72093023255814,80%,58%,1)}@property --x-0{syntax:'<percentage>';inherits:false;initial-value:83%}@property --y-0{syntax:'<percentage>';inherits:false;initial-value:37%}@property --s-start-0{syntax:'<percentage>';inherits:false;initial-value:0%}@property --s-end-0{syntax:'<percentage>';inherits:false;initial-value:62%}@property --c-1{syntax:'<color>';inherits:false;initial-value:hsla(182.90322580645162,55%,56%,1)}@property --x-1{syntax:'<percentage>';inherits:false;initial-value:17%}@property --y-1{syntax:'<percentage>';inherits:false;initial-value:58%}@property --s-start-1{syntax:'<percentage>';inherits:false;initial-value:0%}@property --s-end-1{syntax:'<percentage>';inherits:false;initial-value:62%}@property --c-2{syntax:'<color>';inherits:false;initial-value:hsla(39.529411764705884,100%,50%,1)}@property --x-2{syntax:'<percentage>';inherits:false;initial-value:98%}@property --y-2{syntax:'<percentage>';inherits:false;initial-value:1%}@property --s-start-2{syntax:'<percentage>';inherits:false;initial-value:0%}@property --s-end-2{syntax:'<percentage>';inherits:false;initial-value:28.775690024315526%}@property --c-3{syntax:'<color>';inherits:false;initial-value:hsla(39.529411764705884,0%,0%,1)}@property --x-3{syntax:'<percentage>';inherits:false;initial-value:1%}@property --y-3{syntax:'<percentage>';inherits:false;initial-value:0%}@property --s-start-3{syntax:'<percentage>';inherits:false;initial-value:0%}@property --s-end-3{syntax:'<percentage>';inherits:false;initial-value:68.33518706914361%}.mesh-bg{--c-0:hsla(8.72093023255814,80%,58%,1);--x-0:83%;--y-0:37%;--c-1:hsla(182.90322580645162,55%,56%,1);--x-1:17%;--y-1:58%;--c-2:hsla(39.529411764705884,100%,50%,1);--x-2:98%;--y-2:1%;--c-3:hsla(39.529411764705884,0%,0%,1);--x-3:1%;--y-3:0%;;background-color:hsla(183.44827586206895,40%,42%,1);background-image:radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0),transparent var(--s-end-0)),radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1),transparent var(--s-end-1)),radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2),transparent var(--s-end-2)),radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3),transparent var(--s-end-3));animation:hero-gradient-animation 10s linear infinite alternate;background-blend-mode:normal,normal,normal,normal;}

/*
ICONS
 */
.transx-arrow_right {
  mask: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 14 18"><path d="M5.224.333 13.89 9l-8.666 8.668L3.056 15.5l6.5-6.502-6.5-6.5L5.224.333Z"/><path d="M3.057 11.165 5.224 9 3.057 6.832.89 9l2.167 2.166Z"/></svg>') no-repeat 50% 50%;
  background-color: currentColor;
}
.hg-process-icon {
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><path stroke="white" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m14.5 5.5-9 9m0-9 9 9"/></svg>') no-repeat 50% 50%;
}


/*
CONVERTED BLOCKS
 */
/* transx-accordion- */
.transx-accordion {
  margin-top: 60px; margin-bottom: 60px;
}
.transx-accordion .accordion-list {
  display: flex; justify-content: space-between;
  grid-column-gap: 24px; grid-row-gap: 24px;
}
.transx-accordion .accordion-list-item {
  position: relative;
  cursor: pointer; height: 414px;
  display: flex; width: 100%; overflow: visible;

  background-color: dimgray;
}
.transx-accordion .accordion-list-item-opened {
  width: 0; opacity: 0;
  background-color: darkslateblue;
}
.transx-accordion .accordion-list-item-closed {
  flex-grow: 1;
  background-color: darkslategray;
}
.hg-process-icon {
  position: absolute; bottom: 5px; right: 5px;

  display: flex; justify-content: center; align-items: center;
  width: 38px; height: 38px; padding: 9px;
  background-color: var(--fill-dark);
  border: 1px solid var(--primary-color); border-radius: 50%;
  z-index: 1;
}


/**
MAIN MENU - header
 */
.wp-block-navigation .wp-block-navigation-item:hover,
.wp-block-navigation .wp-block-navigation-item.current-menu-ancestor,
.wp-block-navigation .wp-block-navigation-item.current-menu-item {
  color: var(--primary-color);
}


/**
GRAVITY FORMS
 */
.gform_confirmation_message_1 {
  color: var(--transx-dark-blue);
}
.wp-theme-transformx .gform_wrapper {
  --gf-color-danger: var(--transx-red) !important;
  --gf-color-success: var(--transx-blue) !important;
}


.btn-icon { min-width: 20px; height: 18px; color: var(--body-bg); }
.service-arrow-icon { height: 33px; width: 25px; }


.page .entry-content ul { grid-column-gap: 16px; grid-row-gap: 16px; flex-flow: column; margin-top: 16px; display: flex }

.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container { /*margin-top: 1em*/ }
.wp-block-navigation__container > .wp-block-navigation-item { padding: 1em 0 }

.wp-site-blocks > .entry-content { margin-block-start: unset; }

/* ************************************************************* */

.banner-wrapper { display: flex; justify-content: space-between; min-height: 400px }

.banner-wrapper > div { display: flex; flex-flow: column; justify-content: space-between; }

.section.top-section.about-us {
  margin-block-start: unset;

  background-image: url(assets/images/transx_banner_2.webp);
  background-position: 50%; background-repeat: no-repeat; background-size: cover;
  padding-top: 195px; padding-bottom: 80px
}

@media screen and (max-width: 991px) {
  .banner-wrapper { flex-flow: wrap; }
}


@media screen and (max-width: 479px) {
  .banner-wrapper { grid-column-gap: 20px; grid-row-gap: 20px; margin-top: 40px; position: relative }
  .section.top-section.about-us { padding-top: 180px; padding-bottom: 40px }
}

/* ************************************************************* */

/* color overrides (needs to be after other styles) */
.white { color: var(--white); }

.max-h-250px { max-height: 250px; }
.max-h-350px { max-height: 350px; }