/* ==========================================================================
   CLEAN POWER AUSTRALIA — CSS OVERLAY (2026 rebuild)
   Loaded after style.css by hello_elementor_child_enqueue_styles().

   The Elementor Global Kit owns colours, fonts, sizes, button radius/padding.
   This file owns hover/focus/active states, cards, forms, accordion, prose.
   Form field config and submit actions are never touched — styling only.
   ========================================================================== */

/* This block redeclares the tokens and loads after cpa-tokens.css, so it wins
   sitewide. Any change in cpa-tokens.css must be mirrored here or the old
   value silently survives. See the contrast note in cpa-tokens.css. */
:root {
  --cpa-blue: #0096CC;
  --cpa-blue-action: #005F82;
  --cpa-blue-hover: #00506E;
  --cpa-blue-deep: #005F82;
  --cpa-blue-bright: #3DBFF0;
  --cpa-blue-numeral: #3E88A6;
  --cpa-wash: #D8F4FF;
  --cpa-mist: #F2F6F7;
  --cpa-cream: #F7F2E8;
  --cpa-ink: #303130;
  --cpa-ink-2: #4A4E50;
  --cpa-yellow: #FAB94B;
  --cpa-line: #E7E2D8;
  --cpa-error: #E30613;
  --cpa-error-text: #B3000F;
  --cpa-shadow-card: 0 4px 16px rgba(48, 49, 48, 0.15);
  --cpa-shadow-input: 0 1px 2px rgba(16, 24, 40, 0.05);
  --cpa-ease: 220ms ease-out;
}

/* 1 · GLOBAL: focus, skip link, motion */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--cpa-blue);
  outline-offset: 2px;
  border-radius: 4px;
}
.cpa-skip {
  position: absolute; left: -9999px; top: 0; z-index: 999;
  background: var(--cpa-ink); color: #fff;
  padding: 12px 20px; border-radius: 0 0 8px 0; font-weight: 700;
}
.cpa-skip:focus { left: 0; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}

/* 2 · BUTTONS */
.elementor-button {
  transition: background-color var(--cpa-ease), transform 120ms ease-in;
  letter-spacing: -0.01em;
}
.elementor-button:hover { background-color: var(--cpa-blue-hover); }
.elementor-button:active { transform: scale(0.98); }
.elementor-button:focus-visible {
  outline: 2px solid var(--cpa-blue); outline-offset: 3px; border-radius: 999px;
}
.cpa-btn--secondary .elementor-button {
  background: transparent; color: var(--cpa-ink); border: 2px solid var(--cpa-blue);
}
.cpa-btn--secondary .elementor-button:hover {
  background: rgba(0, 150, 204, 0.08); color: var(--cpa-ink);
}
.cpa-btn--white .elementor-button {
  background: #fff; color: var(--cpa-ink);
  box-shadow: 0 5px 20px rgba(48, 49, 48, 0.15);
}
.cpa-btn--white .elementor-button:hover { background: var(--cpa-wash); }
.cpa-btn--white .elementor-button:focus-visible { outline-color: #fff; }
.cpa-link a {
  color: var(--cpa-blue-deep); font-weight: 700; text-decoration: none;
  transition: color var(--cpa-ease);
}
.cpa-link a:hover { color: var(--cpa-blue); }
.cpa-link a svg, .cpa-link a .cpa-chev { transition: transform var(--cpa-ease); }
.cpa-link a:hover svg, .cpa-link a:hover .cpa-chev { transform: translateX(2px); }
.elementor-widget-text-editor a,
.elementor-widget-theme-post-content a {
  text-decoration: underline; text-underline-offset: 3px;
}

/* 3 · HEADER + NAV */
.elementor-sticky--effects { box-shadow: 0 2px 12px rgba(48, 49, 48, 0.08); }
.elementor-widget-nav-menu .elementor-item {
  color: var(--cpa-ink); transition: color var(--cpa-ease);
}
.elementor-widget-nav-menu .elementor-item:hover,
.elementor-widget-nav-menu .elementor-item.elementor-item-active { color: var(--cpa-blue-deep); }
.elementor-nav-menu--dropdown {
  border: 1px solid var(--cpa-line); border-radius: 0 0 12px 12px;
  box-shadow: 0 12px 32px rgba(48, 49, 48, 0.14); padding: 12px;
}
.elementor-nav-menu--dropdown .elementor-item { border-radius: 10px; padding: 12px 14px; }
.elementor-nav-menu--dropdown .elementor-item:hover { background: var(--cpa-mist); }

/* 4 · CARDS, CHIPS, ACCENTS */
.cpa-card { background: #fff; border: 1px solid var(--cpa-line); border-radius: 12px; }
.cpa-card--link { transition: box-shadow var(--cpa-ease); }
.cpa-card--link:hover { box-shadow: var(--cpa-shadow-card); }
.cpa-chip {
  display: inline-flex; align-items: center; padding: 5px 13px;
  border-radius: 999px; background: var(--cpa-wash); color: var(--cpa-blue-deep);
  font-size: 12.5px; font-weight: 700; line-height: 1.4;
}
.cpa-chip--outline {
  background: transparent; border: 1px solid rgba(0, 150, 204, 0.4);
  transition: background var(--cpa-ease);
}
.cpa-chip--outline:hover { background: rgba(0, 150, 204, 0.08); }
.cpa-eyebrow {
  font-family: "Open Sans", sans-serif; font-size: 14px; font-weight: 700;
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--cpa-blue-deep);
}
.cpa-step {
  width: 64px; height: 64px; border-radius: 50%;
  background: var(--cpa-blue-action); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: "Gilroy", sans-serif; font-weight: 500; font-size: 26px; flex: none;
}
.cpa-step--yellow { background: var(--cpa-yellow); color: var(--cpa-ink); }
.cpa-step--sm { width: 44px; height: 44px; font-size: 18px; }
.cpa-frosted {
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(61, 191, 240, 0.4); border-radius: 24px;
  -webkit-backdrop-filter: blur(44px); backdrop-filter: blur(44px);
}
.cpa-stars { color: var(--cpa-yellow); letter-spacing: 2px; }

/* 5 · FORMS — styling only. Field config and submit actions are untouched. */
.elementor-field-group .elementor-field-label {
  font-size: 14px; font-weight: 700; color: var(--cpa-ink); margin-bottom: 8px;
}
.elementor-field-textual {
  border-radius: 26px; border: 1px solid rgba(120, 122, 120, 0.6);
  background: #fff; padding: 14px 20px; font-size: 16px; color: var(--cpa-ink);
  box-shadow: var(--cpa-shadow-input);
  transition: border-color var(--cpa-ease), box-shadow var(--cpa-ease);
}
.elementor-field-textual::placeholder { color: #787A78; }
.elementor-field-textual:focus {
  border: 2px solid var(--cpa-blue); padding: 13px 19px;
  box-shadow: 0 0 0 3px rgba(0, 150, 204, 0.22); outline: none;
}
.elementor-error .elementor-field-textual,
.elementor-field-textual.elementor-error {
  border: 2px solid var(--cpa-error); padding: 13px 19px;
}
.elementor-message.elementor-message-danger,
.elementor-field-group .elementor-message-danger {
  color: var(--cpa-error-text); font-size: 13px; font-weight: 600; margin-top: 7px;
}
.elementor-error .elementor-field-label { color: var(--cpa-error-text); }
.elementor-message.elementor-message-success {
  color: var(--cpa-ink); background: var(--cpa-wash);
  border-radius: 12px; padding: 16px 20px; font-size: 15px;
}
.e-form__indicators { margin-bottom: 18px; }
.e-form__indicators__indicator__label { font-weight: 700; color: var(--cpa-blue-deep); }
.e-form__buttons__wrapper__button-previous {
  background: transparent; color: var(--cpa-blue-deep); font-weight: 700;
}
.elementor-field-type-honeypot { position: absolute !important; left: -9999px !important; }

/* 6 · ACCORDION */
.e-n-accordion-item {
  background: #fff; border: 1px solid rgba(61, 191, 240, 0.35);
  border-radius: 12px; margin-bottom: 12px; overflow: hidden;
}
.e-n-accordion-item-title {
  padding: 20px 24px; font-weight: 700; font-size: 17px; color: var(--cpa-ink);
}
.e-n-accordion-item-title-icon {
  width: 36px; height: 36px; border-radius: 50%; background: var(--cpa-mist);
  display: flex; align-items: center; justify-content: center;
  transition: transform 150ms ease-out;
}
.e-n-accordion-item[open] .e-n-accordion-item-title-icon { transform: rotate(45deg); }
.e-n-accordion-item > div { padding: 0 24px 20px; color: var(--cpa-ink-2); }

/* 7 · BLOG PROSE */
.elementor-widget-theme-post-content { max-width: 760px; margin: 0 auto; }
.elementor-widget-theme-post-content p {
  font-size: 17px; line-height: 1.7; color: var(--cpa-ink); margin: 0 0 20px;
}
.elementor-widget-theme-post-content p:first-of-type { font-size: 18px; }
.elementor-widget-theme-post-content h2 {
  font-family: "Gilroy", sans-serif; font-weight: 500; font-size: 30px;
  line-height: 1.3; letter-spacing: -0.02em; margin: 40px 0 16px;
}
.elementor-widget-theme-post-content h3 { font-size: 23px; margin: 32px 0 12px; }
.elementor-widget-theme-post-content ul { padding-left: 22px; margin: 0 0 20px; }
.elementor-widget-theme-post-content li { margin-bottom: 8px; line-height: 1.65; }
.elementor-widget-theme-post-content li::marker { color: var(--cpa-blue); }
.elementor-widget-theme-post-content img { border-radius: 10px; }
.elementor-widget-theme-post-content blockquote {
  background: var(--cpa-wash); border-radius: 12px; padding: 28px 32px;
  margin: 32px 0; font-family: "Gilroy", sans-serif; font-weight: 500;
  font-size: 22px; line-height: 1.45; letter-spacing: -0.01em; color: var(--cpa-ink);
}
.elementor-widget-theme-post-content blockquote cite {
  display: block; margin-top: 12px; font-family: "Open Sans", sans-serif;
  font-style: normal; font-size: 13px; font-weight: 700; color: var(--cpa-blue-deep);
}
@media (max-width: 767px) {
  .elementor-widget-theme-post-content p { font-size: 16px; }
  .elementor-widget-theme-post-content h2 { font-size: 24px; }
}

/* 8 · STICKY MOBILE CTA BAR + BREADCRUMB */
.cpa-ctabar {
  position: sticky; bottom: 0; z-index: 90; background: #fff;
  border-top: 1px solid var(--cpa-line);
  box-shadow: 0 -4px 16px rgba(48, 49, 48, 0.10);
  padding: 10px 14px; display: none; gap: 10px;
}
@media (max-width: 767px) {
  .cpa-ctabar { display: flex; }
  body.page-get-a-quote .cpa-ctabar { display: none; }
}
.cpa-ctabar .cpa-ctabar-quote { background: var(--cpa-blue-deep); color: #fff; }
.cpa-ctabar .elementor-button {
  flex: 1 1 0; text-align: center; padding: 13px 12px;
  font-size: 15px; font-weight: 700; border-radius: 999px;
  text-decoration: none; min-height: 46px;
  display: inline-flex; align-items: center; justify-content: center;
}
.cpa-ctabar .cpa-ctabar-call {
  background: #fff; color: var(--cpa-ink); border: 2px solid var(--cpa-blue);
}
.cpa-ctabar .cpa-ctabar-call:hover { background: var(--cpa-wash); }
.cpa-breadcrumb { font-size: 13px; color: var(--cpa-ink-2); }
.cpa-breadcrumb a { color: var(--cpa-ink-2); text-decoration: none; }
.cpa-breadcrumb a:hover { color: var(--cpa-blue); }
.cpa-breadcrumb .current { font-weight: 700; color: var(--cpa-ink); }

/* 9 · RESPONSIVE ODDS AND ENDS */
@media (max-width: 767px) {
  .cpa-chip-row {
    display: flex; flex-wrap: nowrap; overflow-x: auto;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
    gap: 8px; padding-bottom: 4px;
  }
  .cpa-chip-row::-webkit-scrollbar { display: none; }
}
.swiper-pagination-bullet { background: var(--cpa-blue); opacity: 0.35; }
.swiper-pagination-bullet-active { opacity: 1; }
.elementor-widget-image img { border-radius: 10px; }
.elementor-widget-theme-post-featured-image img { border-radius: 12px; }

/* 10 · LEGACY HEX RETIREMENT
   Rules in style.css predate the kit change and still carry the old accent
   #006F9C. These override them without rewriting that file's history. */
.get-quote-form a, .refer-from a, .team-form a, .subsc-text a { color: var(--cpa-blue-deep); }
.refer-from .e-form__indicators__indicator--state-active .e-form__indicators__indicator__number {
  background: var(--cpa-blue);
}
.e-form__indicators__indicator--state-active:after,
.e-form__indicators__indicator--state-completed:after { background-color: var(--cpa-blue); }

/* ==========================================================================
   11 · RESPONSIVE TYPE SCALE
   The Global Kit only stores desktop values, so tablet and mobile steps are
   applied here by overriding Elementor's own typography custom properties.
   Kit ID is 6, hence .elementor-kit-6. IDs match the kit preset _id values.
   ========================================================================== */

@media (max-width: 1024px) {
  body.elementor-kit-6 {
    --e-global-typography-03da0eb-font-size: 48px;   /* H1 */
    --e-global-typography-03da0eb-line-height: 53px;
    --e-global-typography-e6a38f9-font-size: 34px;   /* H2 */
    --e-global-typography-e6a38f9-line-height: 44px;
    --e-global-typography-2950bd7-font-size: 26px;   /* H3 */
    --e-global-typography-2950bd7-line-height: 36px;
    --e-global-typography-66c1259-font-size: 20px;   /* H4 */
    --e-global-typography-66c1259-line-height: 27px;
    --e-global-typography-90d7e91-font-size: 17px;   /* H5 */
    --e-global-typography-90d7e91-line-height: 23px;
    --e-global-typography-a39696a-font-size: 18px;   /* Text / lead */
    --e-global-typography-a39696a-line-height: 28px;
  }
}

@media (max-width: 767px) {
  body.elementor-kit-6 {
    --e-global-typography-03da0eb-font-size: 38px;   /* H1 */
    --e-global-typography-03da0eb-line-height: 42px;
    --e-global-typography-e6a38f9-font-size: 30px;   /* H2 */
    --e-global-typography-e6a38f9-line-height: 38px;
    --e-global-typography-2950bd7-font-size: 24px;   /* H3 */
    --e-global-typography-2950bd7-line-height: 34px;
    --e-global-typography-66c1259-font-size: 19px;   /* H4 */
    --e-global-typography-66c1259-line-height: 26px;
    --e-global-typography-a39696a-font-size: 16px;   /* Text / lead */
    --e-global-typography-a39696a-line-height: 26px;
  }
}

/* Button padding steps down with the breakpoints (label stays 19/25 bold,
   which is what keeps white-on-blue inside the WCAG large-text allowance). */
@media (max-width: 1024px) {
  .elementor-button { padding: 14px 28px; }
}
@media (max-width: 767px) {
  .elementor-button { padding: 12px 24px; }
}

/* ==========================================================================
   12 · GILROY SWITCH
   H1, H2 and H3 currently render in Space Grotesk at the correct Gilroy
   metrics. Once Gilroy 400/500 are uploaded to Elementor Custom Fonts,
   change the three families in the kit and delete this comment block.
   Everything else in the system is Open Sans and is already final.
   ========================================================================== */

/* ==========================================================================
   13 · CONTRAST CORRECTIONS
   Blue on cream measures 3.02:1, which clears the 3:1 UI threshold by 0.02.
   A border removes the rounding risk without changing the look.
   ========================================================================== */
.cpa-cream .elementor-button,
[style*="F7F2E8"] .elementor-button { border: 1px solid var(--cpa-blue-hover); }

/* Secondary text never uses the old #787A78 grey (4.33:1, fails body size). */
.elementor-widget-text-editor .cpa-muted,
.cpa-muted { color: var(--cpa-ink-2); }

/* Visually hidden, still announced. Used for column headers that are blank by
   design and for new-tab warnings on external links. Standard clip-path
   pattern: avoids display:none (which removes it from the a11y tree) and
   avoids a negative text-indent (which breaks RTL and can trigger horizontal
   scroll). */
.cpa-sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* Star rows are decorative yellow only, never text. */
.cpa-stars { speak: never; }

/* ==========================================================================
   14 · WCAG 2.2 AA REMEDIATION — August 2026 audit
   Everything below corrects contrast that is generated outside this theme:
   Elementor's per-template CSS and the Trustindex plugin. Neither can be
   fixed at the token layer, so each one is pinned here with enough
   specificity to win regardless of stylesheet load order.
   ========================================================================== */

/* Privacy policy page (19 Oct 2026). Its lists are body items in the prose
   block, which inherits the theme's list reset, so bullets and the body
   type size are restored here, scoped to this page only. */
.page-id-1110 .wrap--prose { max-width: 860px; }
.page-id-1110 .wrap--prose ul { list-style: disc; padding-left: 1.4em; margin-top: 12px; }
.page-id-1110 .wrap--prose li { font-size: 17px; line-height: 1.7; margin-top: 4px; }

/* Privacy microcopy under the quote form. Elementor writes
   .elementor-3734 .elementor-element-4b289a6 { color:#868686 } (3.64:1) into
   its generated stylesheet, so this needs four classes to outrank it.
   #595959 is 7.0:1 on white and clears AAA. */
.form-panel .elementor-3734 .elementor-element.elementor-element-4b289a6,
.form-panel .elementor-3734 .elementor-element.elementor-element-4b289a6 p {
  color: #595959;
}

/* The same #868686 microcopy ships from other Elementor form templates on
   /careers/ and /join-the-team/, which use their own element ids. Elementor
   writes .elementor-{page} .elementor-element.elementor-element-{id} — three
   classes — into its generated stylesheet, and that outranks any selector we
   can write here without knowing the ids. !important is the honest tool for
   this: we are overriding a generated stylesheet we do not control, not
   patching over our own cascade. */
.elementor-field-type-html,
.elementor-field-type-html p,
.elementor-widget-form .elementor-field-type-html,
.elementor-widget-form .elementor-field-type-html p,
.elementor-field-type-acceptance .elementor-field-label,
.elementor-widget-form .elementor-field-subgroup label {
  color: #595959 !important;
}

/* The quote form heading was an h6 chosen for its size, which skipped from
   h2 to h6 in the document outline on 20 pages. cpa_form() now promotes it
   to h2. Elementor pins the visual size via the widget's element class
   rather than the tag, so the promotion is invisible; this rule only guards
   against a stray bare-h2 margin or family rule reaching it. */
.form-panel h2.elementor-heading-title {
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
  font-family: inherit;
  color: inherit;
  margin: 0;
}

/* Trustindex review widget. Plugin-generated greys: .ti-rating and
   .ti-verified-by ship around #808080 (3.95:1) and the "Read more" control
   the same. All are body-sized text. */
.ti-widget .ti-rating,
.ti-widget .ti-verified-by,
.ti-widget .ti-read-more,
.ti-widget .ti-read-more-active,
.ti-widget .ti-name,
.ti-widget .ti-date {
  color: #595959 !important;
}

/* Solid blue circle in the legacy overlay: white glyph on brand blue. */
.cpa-circle-icon,
.cpa-overlay-circle {
  background: var(--cpa-blue-action);
}