/**
Theme Name: Agraya Child-Theme
Author: jut-so GmbH
Author URI: https://jut-so.de
Description: Agraya Custom Child Theme basierend auf dem Hello Elementor Theme. 
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: jut-so-child-theme
Template: hello-elementor
*/

/* variable.css and layout.css included via functions.php */

/* Default headline margins
 * Note: Pay attention to widget spacing. 
 * When using heading widget, margin-bottom is set to 0
 * then the spacing is controlled by the widget spacing
  .elementor-widget.elementor-widget.elementor-widget-heading .elementor-widget-container 
 */

body {
  -webkit-font-smoothing: antialiased;
  /* requested by design for retina displays */
  font-synthesis: none;
}
/* iOs horizontal scroll fix */
html,
body {
  overflow-x: hidden;
}

h1,
h1.elementor-heading-title,
.elementor-widget-container h1,
h3,
h3.elementor-heading-title,
.elementor-widget-container h3,
h4,
h4.elementor-heading-title,
.elementor-widget-container h4,
h5,
h5.elementor-heading-title,
.elementor-widget-container h5,
h6,
h6.elementor-heading-title,
.elementor-widget-container h6 {
  margin: 0 0 0.6em 0;
}

h2,
h2.elementor-heading-title,
.elementor-widget-container h2 {
  margin: 0 0 0.5em 0;
}

.overline div {
  margin-bottom: 1.2em;
}

/* Utility classes for headlines */
.h1,
.h1 .elementor-heading-title,
[class*="elementor-kit-"] .h1 {
  font-family: var(--h1-font-family);
  color: var(--h1-default-color);
  font-size: var(--h1-font-size);
  line-height: var(--h1-line-height);
  font-weight: var(--h1-font-weight);
}

.h2,
.h2 .elementor-heading-title,
[class*="elementor-kit-"] .h2 {
  font-family: var(--h2-font-family);
  color: var(--h2-default-color);
  font-size: var(--h2-font-size);
  line-height: var(--h2-line-height);
  font-weight: var(--h2-font-weight);
}

.h3,
.h3 .elementor-heading-title,
[class*="elementor-kit-"] .h3 {
  font-family: var(--h3-font-family);
  color: var(--h3-default-color);
  font-size: var(--h3-font-size);
  line-height: var(--h3-line-height);
  font-weight: var(--h3-font-weight);
}

.h4,
.h4 .elementor-heading-title,
[class*="elementor-kit-"] .h4 {
  font-family: var(--h4-font-family);
  color: var(--h4-default-color);
  font-size: var(--h4-font-size);
  line-height: var(--h4-line-height);
  font-weight: var(--h4-font-weight);
}

.card-header,
h3.card-header {
  font-size: var(--cardheader-font-size);
  line-height: var(--cardheader-line-height);
  font-family: var(--cardheader-font-family);
  font-weight: var(--cardheader-font-weight);
  text-transform: var(--cardheader-text-transform);
  letter-spacing: var(--cardheader-letter-spacing);
  word-spacing: var(--cardheader-word-spacing);
}

::selection {
  background: var(--e-global-color-primary);
  color: white;
}
::-moz-selection {
  background: var(--e-global-color-primary);
  color: white;
}

.elementor-widget-text-editor a {
  text-decoration: underline;
  text-underline-offset: 0.25em;
  text-decoration-color: var(--prmary);
  text-decoration-thickness: 2px;
  text-underline-offset: 2px;
}

.swiper {
  z-index: 0;
}

/* Prevent overflow if clip-path isn't supported */
.notched {
  overflow: hidden;
}

/* Secondary button */
.secondary-button a.elementor-button {
  color: var(--white);
  background-color: var(--primary500);
  border-style: solid;
  border-color: var(--primary500);
}

.secondary-button a.elementor-button:hover {
  background-color: var(--e-global-color-secondary);
  border-color: var(--e-global-color-secondary);
}

/* Hero button */
.hero-button a.elementor-button {
  mix-blend-mode: difference;
}

/* Hero button hover */
.hero-button a.elementor-button:hover {
  mix-blend-mode: normal;
}

.agr-cta-button .elementor-button {
  padding: 10px 32px 10px 32px !important;
}

.agr-cta-button:hover a {
  background-color: var(--secondary);
  color: var(--white);
}

.agr-svg-hover-blue:hover svg path:last-child {
  color: var(--primary500);
  fill: var(--primary500);
}

.agr-svg-hover-white:hover svg path:last-child {
  color: var(--white);
  fill: var(--white);
}

/* Style for text content */
.agr-text-content h2 {
  font-size: var(--cardheader-font-size);
  font-family: var(--cardheader-font-family);
  line-height: var(--cardheader-line-height);
  font-weight: var(--cardheader-font-weight);
  text-transform: var(--cardheader-text-transform);
  letter-spacing: var(--cardheader-letter-spacing);
  word-spacing: var(--cardheader-word-spacing);
}

.agr-text-content,
.agr-text-content p {
  font-size: var(--cardtext-font-size);
  line-height: var(--cardtext-line-height);
  font-family: var(--cardtext-font-family);
  letter-spacing: var(--cardtext-letter-spacing);
}

.agr-text-content p {
  max-width: 735px;
}

.agr-text-content a {
  color: var(--primary500);
  text-decoration: underline;
}

.agr-text-content ul,
.agr-text-content ol {
  max-width: 735px;
  margin-bottom: 1.6em;
  padding-left: 1em;
}

.agr-text-content ul li,
.agr-text-content ol li {
  margin-bottom: 0.5em;
}

.agr-text-content ul li::marker {
  color: var(--primary500);
}

.agr-text-content blockquote {
  margin-bottom: 1.6em;
}

/* 0) CSS variables (mobile‑first) */
:root {
  /* label default (un‑focused) */
  --label-default-top: 20px;
  --label-default-left: 30px;
  --label-default-font-size: inherit;

  /* label floated (focus OR filled) */
  --label-float-top: 1em;
  --label-float-left: 22px;
  --label-float-font-size: 10px;

  /* input/textarea vertical padding */
  --field-padding-top: 18px;
  --field-padding-bottom: 0;

  /* input/textarea min-height */
  --field-min-height: 55px;
}

/* Tablet (Elementor: 768px–1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
  :root {
    --label-default-top: 20px;
    --label-default-left: 36px;
    --label-default-font-size: inherit;
    --label-float-top: 1em;
    --label-float-left: 22px;
    --label-float-font-size: 12px;
    --field-padding-top: 30px;
    --field-padding-bottom: 10px;
    --field-min-height: auto;
  }
}

/* Desktop (Elementor: 1025px and up) */
@media (min-width: 1025px) {
  :root {
    --label-default-top: 20px;
    --label-default-left: 36px;
    --label-default-font-size: inherit;
    --label-float-top: 0.8em;
    --label-float-left: 22px;
    --label-float-font-size: 14px;
    --field-padding-top: 30px;
    --field-padding-bottom: 10px;
    --field-min-height: auto;
  }

  .agr-cta-button .elementor-button-content-wrapper span {
    line-height: 1em;
  }
}

.agr-header-menu ul {
  flex-wrap: nowrap !important;
}

.agr-header-menu li:nth-child(1) a {
  width: 108px;
}
.agr-header-menu li:nth-child(2) a {
  width: 150px;
}
.agr-header-menu li:nth-child(3) a {
  width: 149px;
}
.agr-header-menu li:nth-child(4) a {
  width: 101px;
}

.agr-header-menu .contact {
  background-color: var(--secondary);
  border-radius: 100px;
  transition: background-color 0.3s ease;
}

.agr-header-menu .contact a {
  color: var(--white) !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.agr-header-menu .contact:hover {
  background-color: var(--primary);
}

.agr-header-menu li:not(.contact) a:hover {
  font-weight: 700 !important;
}

.agr-header-menu .elementor-item-active {
  font-weight: 700 !important;
}

.agr-header-menu a.elementor-item-active:not(.contact) {
  font-weight: 700;
}

@media screen and (max-width: 1069px) {
  .agr-header-menu .elementor-item {
    padding-left: 13px !important;
    padding-right: 13px !important;
  }
}

/* 1) Wrapper positioning */
.elementor-form .elementor-field-group {
  position: relative;
}

/* 2) Label when not focused */
.elementor-form .elementor-field-group .elementor-field-label {
  position: absolute;
  top: var(--label-default-top);
  left: var(--label-default-left);
  font-size: var(--label-default-font-size);
  pointer-events: none;
  transition: all 0.2s ease;
}

/* 3) Inputs & textareas */
.elementor-form .elementor-field-group input.elementor-field,
.elementor-form .elementor-field-group textarea.elementor-field {
  width: 100%;
  padding-top: var(--field-padding-top);
  padding-bottom: var(--field-padding-bottom);
  padding-left: 10px;
  padding-right: 24px;
  outline: none;
  font-size: 1rem;
  min-height: var(--field-min-height);
}
.elementor-form .elementor-field-group input.elementor-field,
.elementor-form .elementor-field-group .elementor-field select,
.elementor-form .elementor-field-group textarea.elementor-field {
  border: 3px solid #e0e3e9;
}
.elementor-form .elementor-field-group.elementor-error input,
.elementor-form .elementor-field-group.elementor-error select,
.elementor-form .elementor-field-group.elementor-error textarea {
  border: 3px solid #bf0e18;
}

.elementor-form .elementor-field-group.elementor-error .elementor-message {
  display: none;
}

.elementor-form .elementor-field-group input.elementor-field:focus,
.elementor-form .elementor-field-group .elementor-field select:focus,
.elementor-form .elementor-field-group textarea.elementor-field:focus {
  border: 3px solid var(--primary500);
}

/* 4) Float label on focus OR when filled */
.elementor-form .elementor-field-group:focus-within .elementor-field-label,
.elementor-form .elementor-field-group.filled .elementor-field-label {
  top: var(--label-float-top);
  left: var(--label-float-left);
  font-size: var(--label-float-font-size);
}

/* 5) Leave select fields untouched */
.elementor-form .elementor-field-type-select {
  position: static;
  margin-top: 0;
}
.elementor-form .elementor-field-type-select .elementor-field-label {
  position: static;
  background: none;
  padding: 0;
  margin-bottom: 0.5rem;
  color: inherit;
  font-size: inherit;
}

/* Tablet & Mobile (Elementor: 1025px and up) */
@media (max-width: 1025px) {
  .agr-cta-button .elementor-button-icon {
    display: none;
  }
}

.event-loop-item .event-button-container {
	min-width:fit-content!important;
}