/* Have fun adding your style here :) - PS: At all times this file should contain a comment or a rule, otherwise opera might act buggy :( */

/* General Custom CSS */

/* Homepage refresh (safe, style-only) */
body.home {
  --trk-primary: #0f2d5c;
  --trk-secondary: #2f6fe4;
  --trk-accent: #1ea7ff;
  --trk-text: #172136;
  --trk-muted: #5f6c85;
  --trk-surface: #f5f8ff;
  --trk-radius: 16px;
}

body.home #top {
  color: var(--trk-text);
}

body.home #header_main {
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  background: rgba(255, 255, 255, 0.92);
  border-bottom: 1px solid rgba(15, 45, 92, 0.08);
}

body.home #header_main .container,
body.home #header_main_alternate .container {
  max-width: 1220px;
}

body.home #top .main_menu .menu > li > a {
  font-weight: 600;
  letter-spacing: 0.2px;
}

body.home .container_wrap {
  border-top: none;
}

body.home #top .avia-section {
  padding-top: 72px;
  padding-bottom: 72px;
}

body.home #top .av-special-heading .av-special-heading-tag {
  letter-spacing: -0.02em;
  line-height: 1.15;
}

body.home #top .av-special-heading .av-subheading,
body.home #top .avia_textblock {
  color: var(--trk-muted);
  line-height: 1.75;
}

body.home #top .avia-button {
  border-radius: 999px;
  padding: 12px 24px;
  font-weight: 700;
  letter-spacing: 0.2px;
  border: 1px solid transparent;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

body.home #top .avia-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(15, 45, 92, 0.18);
}

body.home #top .avia-button.avia-color-theme-color,
body.home #top .avia-button.avia-color-light {
  background: linear-gradient(135deg, var(--trk-secondary), var(--trk-accent));
  color: #fff;
}

body.home #top .flex_column .avia_textblock,
body.home #top .iconbox,
body.home #top .avia-testimonial {
  background: #fff;
  border: 1px solid rgba(15, 45, 92, 0.08);
  border-radius: var(--trk-radius);
  box-shadow: 0 10px 30px rgba(15, 45, 92, 0.06);
}

body.home #top .iconbox,
body.home #top .avia-testimonial {
  padding: 22px;
}

body.home #top .avia-image-container img.avia_image {
  border-radius: 14px;
}

body.home #top .alternate_color {
  background-color: var(--trk-surface);
}

body.home #top .main_color strong,
body.home #top .alternate_color strong {
  color: var(--trk-primary);
}

body.home #top .wpforms-container form {
  background: #fff;
  border: 1px solid rgba(15, 45, 92, 0.08);
  border-radius: var(--trk-radius);
  padding: 28px;
  box-shadow: 0 10px 30px rgba(15, 45, 92, 0.06);
}




/*
Desktop Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the desktop view of your site */

@media only screen and (min-width: 768px) {
  /* Add your Desktop Styles here */

  body.home #top .av-special-heading .av-special-heading-tag {
    font-size: clamp(32px, 4vw, 52px);
  }

  body.home #top .avia-section:first-of-type {
    padding-top: 96px;
    padding-bottom: 88px;
  }

}



/*
Mobile Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the Mobile and Tablet Portrait view */

@media only screen and (max-width: 767px) {
  /* Add your Mobile Styles here */

  body.home #top .avia-section {
    padding-top: 46px;
    padding-bottom: 46px;
  }

  body.home #top .wpforms-container form {
    padding: 18px;
  }

  body.home #top .av-special-heading .av-special-heading-tag {
    font-size: 30px;
    line-height: 1.2;
  }

}

/*
Chat widget visibility fix (Tawk)
Enfold uses overflow-x hidden on responsive layouts; this keeps the widget inside viewport.
*/
iframe[title="chat widget"] {
  right: 16px !important;
  bottom: 16px !important;
  max-width: calc(100vw - 32px) !important;
}