.elementor-kit-517{--e-global-color-primary:#0B6BD3;--e-global-color-secondary:#1B8F5A;--e-global-color-text:#111827;--e-global-color-accent:#094F9E;--e-global-color-3c6dfac6:#075AAE;--e-global-color-5e994acd:#F3F8FB;--e-global-color-5e032590:#000000;--e-global-color-23b4090a:#000000;--e-global-color-3b9812cc:#646E80;--e-global-color-6ec22fb6:#000000;--e-global-color-2f34f4bd:#000000;--e-global-color-27a7d136:#FFFFFF;--e-global-color-e0ac7d8:#F1F6FC;--e-global-color-583417e:#FFFFFF;--e-global-color-c8d18ae:#4B5563;--e-global-color-4ea915b:#D1D5DB;--e-global-color-8cf21e1:#0B6BD3;--e-global-color-d9ec423:#094F9E;--e-global-color-27dc32e:#FFFFFF;--e-global-color-25c995b:#E0E7FF;--e-global-color-4e74de9:#C7D2FE;--e-global-color-efb67f0:#1E3A8A;--e-global-typography-primary-font-family:"Inter";--e-global-typography-primary-font-weight:700;--e-global-typography-secondary-font-family:"Inter";--e-global-typography-secondary-font-weight:600;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Inter";--e-global-typography-accent-font-weight:700;color:#000000;font-family:"Open Sans", Sans-serif;font-size:18px;font-weight:400;line-height:1.7px;letter-spacing:0px;}.elementor-kit-517 button,.elementor-kit-517 input[type="button"],.elementor-kit-517 input[type="submit"],.elementor-kit-517 .elementor-button{background-color:#065BD3;font-size:18px;font-weight:700;line-height:1.2px;letter-spacing:0px;color:#FFFFFF;box-shadow:0px 2px 5px 0px rgba(0, 0, 0, 0.2);border-style:solid;border-width:2px 2px 2px 2px;border-color:#064BD3;border-radius:8px 8px 8px 8px;padding:014px 022px 014px 022px;}.elementor-kit-517 button:hover,.elementor-kit-517 button:focus,.elementor-kit-517 input[type="button"]:hover,.elementor-kit-517 input[type="button"]:focus,.elementor-kit-517 input[type="submit"]:hover,.elementor-kit-517 input[type="submit"]:focus,.elementor-kit-517 .elementor-button:hover,.elementor-kit-517 .elementor-button:focus{background-color:#09449E;color:#FFFFFF;box-shadow:0px 4px 8px 0px rgba(0, 0, 0, 0.25);border-style:solid;border-width:2px 2px 2px 2px;border-radius:8px 8px 8px 8px;}.elementor-kit-517 e-page-transition{background-color:#FFBC7D;}.elementor-kit-517 a{color:#075AAE;}.elementor-kit-517 h1{font-size:36px;font-weight:700;line-height:1.2px;letter-spacing:0px;}.elementor-kit-517 h2{font-size:30px;font-weight:700;line-height:1.25px;}.elementor-kit-517 h3{font-size:26px;font-weight:700;line-height:1.3px;}.elementor-kit-517 h4{font-size:22px;font-weight:600;line-height:1.35px;}.elementor-kit-517 h5{font-size:20px;font-weight:600;line-height:1.4px;}.elementor-kit-517 h6{font-size:18px;font-weight:600;line-height:1.4px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ---- Global Focus Ring (Elementor + Fluent Forms + native buttons) ---- */

/* Adjustable colors */
:root{
  --focus-ring: #FFD24C;              /* outline color (accessible amber) */
  --focus-halo: rgba(255,210,76,.35); /* outer glow for visibility */
}

/* General buttons & links */
a.elementor-button,
.elementor-button,
.wp-element-button,
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.ff-btn {
  outline-offset: 3px; /* keeps the ring away from the edge */
}

/* Show the focus ring when navigating by keyboard */
a.elementor-button:focus-visible,
.elementor-button:focus-visible,
.wp-element-button:focus-visible,
button:focus-visible,
input[type="submit"]:focus-visible,
input[type="button"]:focus-visible,
input[type="reset"]:focus-visible,
.ff-btn:focus-visible {
  outline: 3px solid var(--focus-ring);
  box-shadow: 0 0 0 4px var(--focus-halo);
}

/* Safari / older browsers fallback */
a.elementor-button:focus,
.elementor-button:focus,
.wp-element-button:focus,
button:focus,
input[type="submit"]:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
.ff-btn:focus {
  outline: 3px solid var(--focus-ring);
  box-shadow: 0 0 0 4px var(--focus-halo);
}

/* Make sure nothing removes the outline */
a.elementor-button:focus,
.elementor-button:focus { outline-style: solid; }
/* ===== 3MPD – TTS polish + floating controls ===== */

/* 1) Make existing listen buttons look polished (non-destructive .elementor-kit-517s)
   This catches common classes/attributes without you changing widgets. */
.tts-button,
.listen-btn,
button[aria-label*="listen" i],
a[aria-label*="listen" i],
[data-tts-btn],
[data-tts] {
  --tts-radius: 999px;
  --tts-pad-x: 1.05rem;
  --tts-pad-y: 0.72rem;
  --tts-bg: #1f2937;         /* slate-800 */
  --tts-bg-hover: #0f172a;   /* slate-900 */
  --tts-text: #fff;
  --tts-shadow: 0 6px 18px rgba(0,0,0,.12);
  --tts-shadow-hover: 0 10px 24px rgba(0,0,0,.16);

  display: inline-flex;
  align-items: center;
  gap: .55rem;
  border: 0;
  border-radius: var(--tts-radius);
  padding: var(--tts-pad-y) var(--tts-pad-x);
  background: var(--tts-bg);
  color: var(--tts-text);
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  box-shadow: var(--tts-shadow);
  cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.tts-button:hover,
.listen-btn:hover,
button[aria-label*="listen" i]:hover,
a[aria-label*="listen" i]:hover,
[data-tts-btn]:hover,
[data-tts]:hover {
  background: var(--tts-bg-hover);
  box-shadow: var(--tts-shadow-hover);
  transform: translateY(-1px);
}
.tts-button:active,
.listen-btn:active,
button[aria-label*="listen" i]:active,
a[aria-label*="listen" i]:active,
[data-tts-btn]:active,
[data-tts]:active { transform: translateY(0); }

/* Tiny “status dot” before text */
.tts-button::before,
.listen-btn::before,
button[aria-label*="listen" i]::before,
a[aria-label*="listen" i]::before,
[data-tts-btn]::before,
[data-tts]::before {
  content: "";
  width: .55rem; height: .55rem; border-radius: 50%;
  background: #22c55e; /* green */
  box-shadow: 0 0 0 2px rgba(255,255,255,.22) inset;
}
.is-tts-speaking::before { background: #ef4444; } /* red when speaking */


.tts-panel.is-open { display: block; }

.tts-panel h3 {
  margin: 0 0 8px 0;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .2px;
  color:#f3f4f6;
}

.tts-row { display: grid; grid-template-columns: 74px 1fr auto; align-items: center; gap: 10px; margin: 10px 0; }
.tts-row label { font-size: 13px; color:#cbd5e1; }
.tts-row input[type="range"] { width: 100%; }

.tts-val { font-variant-numeric: tabular-nums; font-size: 12px; color:#cbd5e1; min-width: 44px; text-align:right; }

.tts-actions { display:flex; gap: 8px; margin-top: 8px; }
.tts-actions button {
  flex: 1 1 auto;
  border: 0; border-radius: 10px;
  padding: .55rem .75rem;
  background:#1f2937; color:#fff; font-weight:600;
  cursor:pointer;
  transition: background .12s ease, transform .12s ease;
}
.tts-actions button:hover{ background:#111827; transform:translateY(-1px); }
.tts-actions button:active{ transform:translateY(0); }

 cursor:pointer;
  transition:transform .12s, box-shadow .12s, background .12s;
}
.tts-button:hover,
.listen-btn:hover,
button[aria-label*="listen" i]:hover,
a[aria-label*="listen" i]:hover,
[data-tts-btn]:hover,
[data-tts]:hover{
  background:var(--tts-bg-hover);
  box-shadow:var(--tts-shadow-hover);
  transform:translateY(-1px);
}
.tts-button:active,
.listen-btn:active,
button[aria-label*="listen" i]:active,
a[aria-label*="listen" i]:active,
[data-tts-btn]:active,
[data-tts]:active{ transform:translateY(0); }

/* tiny status dot (green idle → red when speaking) */
.tts-button::before,
.listen-btn::before,
button[aria-label*="listen" i]::before,
a[aria-label*="listen" i]::before,
[data-tts-btn]::before,
[da/* Gear Icon Styling */
.tts-gear {
  position: fixed !important;
  bottom: 18px !important;
  right: 18px !important;
  background-color: #3333 !important;
  color: white !important;
  font-size: 20px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 9999 !important; /* Ensure gear icon is on top */
}

.tts-gear:hover {
  filter: brightness(1.3);
}

/* Accessibility Checkmark Styling */
.wp-accessibility-checklist {
  display: block !important;
  position: fixed !important;
  bottom: 120px; /* Adjust positioning below the gear */
  left: 18px;
  z-index: 9999 !important;
  font-size: 18px;
  cursor: pointer;
}

.wp-accessibility-checklist:hover {
  filter: brightness(1.3);
}

/* Ensure placeholders behind the gear icon */
.tts-placeholder {
  z-index: -1 !important;
}
.tts-placeholder {
    display: block; /* Ensure the placeholder is visible */
    position: relative; /* Adjust its position to fit within the layout */
    z-index: 2; /* Position it above the background or other content */
}
.tts-gear {
    z-index: 9999 !important; /* Ensure gear icon is on top */
}/* End custom CSS */