/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
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: 2.0.0
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 */

h1.entry-title {
	display: none !important;
}

.sticky-header {
  position: sticky;
  top: 0;
  z-index: 50;
  transition: background-color 0.2s ease, box-shadow 0.2s ease;
  background-color: transparent !important;
}

/* Scrolled state – cover both the inner section and its container */
.sticky-header.scrolled,
.sticky-header.scrolled > .elementor-container,
.sticky-header.scrolled > .elementor-container > .elementor-column-gap-default {
  background-color: rgba(250, 129, 40, 0.6) !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35);
border-radius: 0 0 15px 15px;
}

.contentpost h2, .contentpost h3, .contentpost h1, .contentpost h4 {
  font-size: 26px !important;
  font-weight: 500 !important;
  padding-top: 15px !important;
}

.logo-sticky {
    display: none; /* hide the sticky logo initially */
}
.logo-default {
    display: block; /* show the default logo initially */
}
.elementor-sticky--effects .logo-sticky {
    display: block; /* show the sticky logo when header is sticky */
}
.elementor-sticky--effects .logo-default {
    display: none; /* hide the default logo when header is sticky */
}

/* =========================================
   Cluemasters Support Form – Form ID 65
   ========================================= */

#gform_wrapper_65 {
  max-width: 720px;
  margin: 0 auto 3rem;
  padding: 24px;
  border-radius: 16px;
  background: #111827;
  box-shadow: 0 18px 40px rgba(0,0,0,.5);
  color: #fff;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Heading */
#gform_wrapper_65 .gform_heading {
  margin-bottom: 1.5rem;
  border-bottom: 1px solid rgba(255,255,255,.06);
  padding-bottom: .75rem;
}
#gform_wrapper_65 .gform_title {
  font-size: 1.6rem;
  font-weight: 600;
  margin: 0 0 .25rem;
}
#gform_wrapper_65 .gform_description {
  font-size: .95rem;
  color: #9ca3af;
}

/* Steps (if enabled) */
#gform_wrapper_65 .gf_page_steps {
  display:flex;
  gap:10px;
  margin:1.25rem 0 1.5rem;
  list-style:none;
  padding:0;
}
#gform_wrapper_65 .gf_step {
  flex:1;
  display:flex;
  align-items:center;
  gap:8px;
  font-size:.8rem;
  color:#9ca3af;
}
#gform_wrapper_65 .gf_step_number {
  width:22px;
  height:22px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:.75rem;
  font-weight:600;
  background:#020617;
  border:1px solid #374151;
  color:#9ca3af;
}
#gform_wrapper_65 .gf_step_active .gf_step_number {
  background:#fa8128;
  border-color:#fa8128;
  color:#111827;
}
#gform_wrapper_65 .gf_step_active .gf_step_label {
  color:#fff;
  font-weight:500;
}

/* Layout: 2-column grid by default */
#gform_wrapper_65 .gform_page .gform_fields {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px 20px;
}
#gform_wrapper_65 .gfield--width-full {
  grid-column:1 / -1;
}

/* Labels */
#gform_wrapper_65 .gfield_label {
  font-size:.9rem;
  font-weight:500;
  color:#ffffff;
  margin-bottom:4px;
}
#gform_wrapper_65 .gfield_required {
  color:#fa8128; /* required asterisk */
}

/* Inputs / selects / textareas */
#gform_wrapper_65 input[type="text"],
#gform_wrapper_65 input[type="email"],
#gform_wrapper_65 input[type="tel"],
#gform_wrapper_65 input[type="number"],
#gform_wrapper_65 select,
#gform_wrapper_65 textarea {
  width:100%;
  padding:10px 12px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.35); /* thin white border */
  background:#020617;
  color:#ffffff;
  font-size:.95rem;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

#gform_wrapper_65 input::placeholder,
#gform_wrapper_65 textarea::placeholder {
  color:#9ca3af; /* light grey */
}

/* Focus state */
#gform_wrapper_65 input:focus,
#gform_wrapper_65 select:focus,
#gform_wrapper_65 textarea:focus {
  outline:none;
  border-color:#fa8128;
  box-shadow:0 0 0 1px rgba(250,129,40,.6);
}

/* Textarea size */
#gform_wrapper_65 textarea {
  min-height:140px;
  resize:vertical;
}

/* File upload */
#gform_wrapper_65 .ginput_container_fileupload input[type="file"] {
  padding:8px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.35);
  background:#020617;
  color:#ffffff;
}

/* Checkboxes */
#gform_wrapper_65 .gfield_checkbox li {
  display:flex;
  align-items:flex-start;
  gap:8px;
}
#gform_wrapper_65 .gfield_checkbox input[type="checkbox"] {
  width:18px;
  height:18px;
  margin-top:2px;
}
#gform_wrapper_65 .gfield_checkbox label {
  font-size:.9rem;
  color:#ffffff;
}

/* Descriptions / help text */
#gform_wrapper_65 .gfield_description {
  font-size:.8rem;
  color:#9ca3af;
  margin-top:4px;
}

/* Validation */
#gform_wrapper_65 .gfield_error input,
#gform_wrapper_65 .gfield_error select,
#gform_wrapper_65 .gfield_error textarea {
  border-color:#f97373;
}
#gform_wrapper_65 .gfield_error .gfield_description {
  color:#fecaca;
}
#gform_wrapper_65 .validation_error {
  border-radius:8px;
  background:#7f1d1d;
  color:#fee2e2;
  padding:10px 12px;
  font-size:.9rem;
  margin-bottom:1rem;
  border:1px solid #fecaca;
}

/* ==============================
   Buttons & navigation
   ============================== */

/* Page footer (Prev / Next / Submit on multi-step) */
#gform_wrapper_65 .gform_page_footer {
  margin-top:1.75rem;
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
}

/* General button look */
#gform_wrapper_65 .gform_next_button,
#gform_wrapper_65 .gform_previous_button,
#gform_wrapper_65 .gform_button {
  display:block;
  width:100%;
  border-radius:999px;
  border:1px solid #fa8128;
  background:transparent;
  color:#ffffff;
  padding:10px 18px;
  font-weight:600;
  font-size:.95rem;
  cursor:pointer;
  text-align:center;
  transition:background .18s ease, color .18s ease,
             transform .1s ease, box-shadow .18s ease;
}

/* Next & Previous share columns (50/50 when both, 100% when one) */
#gform_wrapper_65 .gform_next_button,
#gform_wrapper_65 .gform_previous_button {
  grid-column:auto;
}

/* Submit button spans full width */
#gform_wrapper_65 .gform_page_footer .gform_button {
  grid-column:1 / -1;  /* full width on last page */
}

/* Non-paged fallback submit footer */
#gform_wrapper_65 .gform_footer {
  margin-top:1.75rem;
}
#gform_wrapper_65 .gform_footer .gform_button {
  width:100%;
}

/* Hover / active states */
#gform_wrapper_65 .gform_next_button:hover,
#gform_wrapper_65 .gform_button:hover {
  background:#fa8128;
  color:#111827;
  box-shadow:0 12px 30px rgba(250,129,40,.35);
  transform:translateY(-1px);
}
#gform_wrapper_65 .gform_previous_button {
  border-color:#4b5563;
}
#gform_wrapper_65 .gform_previous_button:hover {
  background:#374151;
  color:#ffffff;
  box-shadow:0 10px 24px rgba(0,0,0,.4);
  transform:translateY(-1px);
}
#gform_wrapper_65 .gform_next_button:active,
#gform_wrapper_65 .gform_previous_button:active,
#gform_wrapper_65 .gform_button:active {
  transform:translateY(0);
  box-shadow:0 4px 15px rgba(0,0,0,.6);
}

/* ==============================
   Responsive
   ============================== */

@media (max-width:640px) {
  #gform_wrapper_65 {
    padding:18px;
  }
  #gform_wrapper_65 .gform_page .gform_fields {
    grid-template-columns:1fr;
    gap:14px;
  }
  #gform_wrapper_65 .gform_page_footer {
    grid-template-columns:1fr 1fr;
  }
}

/* =========================================
   Progress bar colors – Form ID 65
   ========================================= */

/* Wrapper and background of the bar */
#gform_wrapper_65 .gf_progressbar_wrapper {
  margin-bottom: 18px;
}

#gform_wrapper_65 .gf_progressbar {
  background-color: #ffe3c7; /* very light orange based on #fa8128 */
  border-radius: 999px;
  overflow: hidden;
  height: 10px;
}

#gform_wrapper_65 .gform_heading {
  display: none !important;
}

/* Filled part of the bar */
#gform_wrapper_65 .gf_progressbar_percentage {
  background-color: #fa8128 !important; /* main Cluemasters orange */
  border-radius: 999px;
  height: 16px !important;
  transition: width 0.25s ease-out;
}

/* Last page: Previous + Submit = 50% / 50% */
#gform_wrapper_65 .gform_page_footer {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

/* Only for the final page buttons */
#gform_wrapper_65 #gform_previous_button_65,
#gform_wrapper_65 #gform_submit_button_65 {
  grid-column: auto !important; /* no full-width span */
  width: 100%;
}

/* Percentage text above the bar (if enabled) */
#gform_wrapper_65 .gf_progressbar_title {
  font-size: 0.85rem;
  color: #e5e7eb;
  margin-bottom: 6px;
}

#gform_wrapper_65 .gf_progressbar_percentage span {
  color: #111827;
  font-weight: 600;
}

#gform_wrapper_65 .gfield_label {
  font-family: "Josefin Slab", serif;
  font-size: 1rem;
  color: #ffffff;
}

#gform_wrapper_65 #gform_next_button_65_9 {
  grid-column: 1 / -1;   /* span both grid columns */
  width: 100%;           /* full width */
}

/* =========================================
   Progress bar colors – Form ID 65 (dup block)
   ========================================= */

/* Wrapper and background of the bar */
#gform_wrapper_65 .gf_progressbar_wrapper {
  margin-bottom: 18px;
}

#gform_wrapper_65 .gf_progressbar {
  height: 16px !important;
}

#gform_wrapper_65 .gf_progressbar {
  background-color: #ffe3c7; /* very light orange based on #fa8128 */
  border-radius: 999px;
  overflow: hidden;
  height: 10px;
}

/* Filled part of the bar */
#gform_wrapper_65 .gf_progressbar_percentage {
  background-color: #fa8128 !important; /* main Cluemasters orange */
  border-radius: 999px;
  height: 16px;
  height: 10px;
  transition: width 0.25s ease-out;
}

/* Percentage text above the bar (if enabled) */
#gform_wrapper_65 .gf_progressbar_title {
  font-size: 0.85rem;
  color: #e5e7eb;
  margin-bottom: 6px;
}

#gform_wrapper_65 .gf_progressbar_percentage span {
  color: #111827;
  font-weight: 600;
  line-height: 16px;
  font-size: 0.8rem;
}



/* Jumpy heading wave */
/* Typography lock for the jumping heading */
/* Typography lock for the jumping heading (wrapper) */
.jumpyhead {
  font-family: "Josefin Slab", serif !important;
  font-size: 24px !important;
  font-weight: 600 !important;
  color: white !important;      /* idle color */
  line-height: 1.2;
  letter-spacing: normal;
  display: inline-block;
  white-space: nowrap;
}

/* Target the actual inner title as the letter container */
.jumpyhead .elementor-heading-title { display: inline; } /* safe baseline */

/* Per-letter baseline */
.jumpyhead .jumpy-letter {
  display: inline-block;
  font: inherit;
  letter-spacing: inherit;
  color: currentColor;          /* allows animation to override */
  transform-origin: 50% 100%;
  --delay: calc(var(--i) * 35ms);
  will-change: transform, color;
}

/* Triggered wave on the wrapper class */
.jumpyhead.do-jump .jumpy-letter {
  animation: jumpy-wave 500ms ease-out var(--delay) 1;
}

/* Jump + highlight */
@keyframes jumpy-wave {
  0%   { transform: translateY(0) scaleY(1);   color: currentColor; }
  20%  { transform: translateY(-0.6em) scaleY(1.04); color: #fa8128; }
  45%  { transform: translateY(0) scaleY(0.98);      color: #fa8128; }
  100% { transform: translateY(0) scaleY(1);   color: currentColor; }
}

@media (prefers-reduced-motion: reduce) {
  .jumpyhead .jumpy-letter,
  .jumpyhead.do-jump .jumpy-letter { animation: none !important; }
}

/* Fancy auto-wave (Elementor-safe) */
.fancyhead {
  font-family: "Josefin Slab", serif !important;
  font-size: 24px !important;
  font-weight: 600 !important;
  color: white !important;
  line-height: 1.2;
  display: inline-block;
  white-space: nowrap;
}

.fancyhead .elementor-heading-title { display: inline; }

/* per-letter baseline */
.fancyhead .jumpy-letter {
  display: inline-block;
  font: inherit;
  color: currentColor;
  transform-origin: 50% 100%;
  will-change: transform, color;
}

/* Run one wave; delays are injected per direction via CSS vars */
.fancyhead.play-ltr .jumpy-letter {
  animation: fancy-wave 600ms ease-out var(--delay-ltr, 0ms) 1;
}
.fancyhead.play-rtl .jumpy-letter {
  animation: fancy-wave 600ms ease-out var(--delay-rtl, 0ms) 1;
}

@keyframes fancy-wave {
  0%   { transform: translateY(0) scaleY(1); color: currentColor; }
  20%  { transform: translateY(-0.6em) scaleY(1.04); color: #fa8128; }
  45%  { transform: translateY(0)        scaleY(0.98); color: #fa8128; }
  100% { transform: translateY(0)        scaleY(1);   color: currentColor; }
}

@media (prefers-reduced-motion: reduce) {
  .fancyhead .jumpy-letter,
  .fancyhead.play-ltr .jumpy-letter,
  .fancyhead.play-rtl .jumpy-letter { animation: none !important; }
}

/* Auto gradient shimmer for Elementor headings with class "gradienthead" */
.gradienthead {
  /* Optional: lock typography to match your other heads */
  font-family: "Josefin Slab", serif !important;
  font-size: 24px !important;
  font-weight: 600 !important;
  color: white; /* base text color when gradient passes */
}

.gradienthead .elementor-heading-title {
  display: inline-block;
  /* Tweakables */
  --gh-base: currentColor;     /* base color (inherits white) */
  --gh-accent: #fa8128;        /* highlight color */
  --gh-band: 10%;              /* width of the highlight band */
  --gh-speed: 2.2s;            /* full sweep duration */

  background-image: linear-gradient(
    90deg,
    var(--gh-base) 0%,
    var(--gh-base) calc(50% - var(--gh-band)),
    var(--gh-accent) 50%,
    var(--gh-base) calc(50% + var(--gh-band)),
    var(--gh-base) 100%
  );
  background-size: 200% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;

  animation: gradient-sweep var(--gh-speed) ease-in-out infinite alternate;
}

/* Left→right then right→left */
@keyframes gradient-sweep {
  from { background-position: 0% 50%; }
  to   { background-position: 100% 50%; }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .gradienthead .elementor-heading-title {
    animation: none !important;
    -webkit-text-fill-color: currentColor; /* show solid text */
  }
}

/* Icon in front of "Support" menu item */
.menu-item-7016 > a::after {
  font-family: "Font Awesome 5 Free"; /* adjust if needed */
  font-weight: 900;
  content: "\f002"; /* magnifying glass */
  display: inline-block;
  margin-left: 0.35em;
  font-size: 0.9em;
  vertical-align: middle;
}

/* /wp-content/themes/your-child-theme/css/cm-mobile-acf-slider.css */

/* Hide wrapper on desktop by default */
.cm-mobile-acf-slider-wrapper {
  display: none;
}

/* Mobile / tablet view */
@media (max-width: 768px) {
  .cm-mobile-acf-slider-wrapper {
    display: block;
    width: 100%;
  }

  .cm-mobile-acf-slider {
    width: 100%;
    /* smaller arrows via Swiper CSS variable */
    --swiper-navigation-size: 22px;
  }

  .cm-mobile-acf-slider-slide img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 8px;
  }

  /* Dots under slider */
  .cm-mobile-acf-slider-pagination {
    margin-top: 10px;
    text-align: center;
  }

  /* Inactive dots: white */
  .cm-mobile-acf-slider .swiper-pagination-bullet {
    background-color: #ffffff;
    opacity: 0.6;
    width: 8px;
    height: 8px;
  }

  /* Active dot: #fa8128 */
  .cm-mobile-acf-slider .swiper-pagination-bullet-active {
    background-color: #fa8128;
    opacity: 1;
  }

  /* Arrows: white, small */
  .cm-mobile-acf-slider .swiper-button-prev,
  .cm-mobile-acf-slider .swiper-button-next {
    color: #ffffff;
    text-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
  }

  /* Optional: slightly smaller click area */
  .cm-mobile-acf-slider .swiper-button-prev::after,
  .cm-mobile-acf-slider .swiper-button-next::after {
    font-size: 18px; /* arrow icon size */
  }
}

/* Default button state (before scroll) – adjust if needed */
.headbtn {
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Default state – keeps your current orange style, just adds transition */
.headbtn .elementor-button {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* Default state – keeps your current orange style, just adds transition */
.headbtn .elementor-button:hover {
  background-color: #FFA562 !important;
}

/* When header is scrolled */
.sticky-header.scrolled .headbtn .elementor-button {
  background-color: #292929 !important;
  border-color: #292929 !important; /* in case the button has a border */
  color: #ffffff !important;
}

/* When header is scrolled */
.sticky-header.scrolled .headbtn .elementor-button:hover {
  background-color: #FFA562 !important;
}

/* Make sure the inner text also turns white */
.sticky-header.scrolled .headbtn .elementor-button .elementor-button-text,
.sticky-header.scrolled .headbtn .elementor-button span {
  color: #ffffff !important;
}

/* CM Simple Lightbox */
.cm-lightbox-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.88);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 999999;
}

.cm-lightbox-overlay.is-open {
  display: flex;
}

.cm-lightbox-overlay img {
  max-width: 90vw;
  max-height: 90vh;
  width: auto;
  height: auto;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.8);
  border-radius: 8px;
}

.cm-lightbox-overlay__close {
  position: fixed;
  top: 20px;
  right: 24px;
  font-size: 26px;
  color: #fff;
  cursor: pointer;
  font-weight: 600;
  z-index: 1000000;
}