/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *




 */

#submit-loading {
  display: none;
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  text-align: center;
  background: rgba(0, 0, 0, .4);
  margin: 0;
  padding: 0;
  z-index: 9999;    
}

#submit-loading div {
  opacity: 25%;
}

p:empty {
  height: 0!important;
  padding: 0!important;
  margin: 0!important;
  width: 0!important;
}

.ca-blog-card__img img.no-img,
.ca-news-card__img img.no-img {
  background-color: #2e4740;
  object-fit: contain;
  padding: 30px;
}

div.alert ul.danger {
  margin: 0;
}

.ca-contact-card__desc strong {
  color: var(--accent);
}
/*
 * Cookie Consent Module — ws_consent.css
 * =======================================
 * All classes prefixed .ws-consent-* to avoid colliding with client themes.
 *
 * Overridable CSS custom properties:
 *   --ws-consent-banner-bg           (banner background color)
 *   --ws-consent-banner-color        (banner text color)
 *   --ws-consent-banner-link-color   (banner link color)
 *   --ws-consent-header-bg           (modal header background)
 *   --ws-consent-header-color        (modal header text color)
 *   --ws-consent-header-link-color   (modal header link color)
 *   --ws-consent-header-border-color (modal header border color)
 *   --ws-consent-body-bg             (modal body background color)
 *   --ws-consent-body-color          (modal body text color)
 *   --ws-consent-body-link-color     (modal body link color)
 *   --ws-consent-accent              (buttons, toggle on-state, focus rings)
 *
 * Override in your site stylesheet:
 *   :root {
 *     --ws-consent-accent: #e63946;
 *     --ws-consent-bg: #fdf6ec;
 *     etc...
 *   }
 *
 * Responsive layout:
 *   Desktop (>640px) — banner is a bottom-bar spanning full viewport width
 *   Mobile  (≤640px) — banner is a bottom-sheet card with rounded top corners
 */

/* ── Default Theme Variables ──────────────────────────────────────── */
:root {
  --ws-consent-accent: #2563eb;
  --ws-consent-preference-button-nudge-amount: 1rem;

  --ws-consent-banner-bg: #fff;
  --ws-consent-banner-color: #000;
  --ws-consent-banner-link-color: #2563eb;
  --ws-consent-header-bg: #fff;
  --ws-consent-header-color: #000;
  --ws-consent-header-link-color: #6b7280;
  --ws-consent-header-border-color: var(--ws-consent-accent);
  --ws-consent-body-bg: #fff;
  --ws-consent-body-color: #000;
  --ws-consent-body-link-color: #2563eb;
  --ws-consent-preference-button-bg: #2563eb;
  --ws-consent-preference-button-color: #fff;
}

/* ── Reset / scoping ──────────────────────────────────────────────── */
.ws-consent-banner,
.ws-consent-modal,
.ws-consent-banner *,
.ws-consent-modal * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
.ws-consent-banner,
.ws-consent-modal {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.55;
  color: #1a1a2e;
}

/* Shield child elements from bare site selectors (e.g. `p { font-size: 16px }`).
   :where() zeroes the element specificity so our own .ws-consent-* rules still win. */
.ws-consent-banner :where(p, a, h1, h2, h3, h4, span, li, ul, ol),
.ws-consent-modal :where(p, a, h1, h2, h3, h4, span, li, ul, ol) {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
  letter-spacing: normal;
  text-transform: none;
  font-weight: normal;
  text-decoration: none;
}

/* ── Screenreader-only ────────────────────────────────────────────── */
.ws-consent-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ═══════════════════════════════════════════════════════════════════ */
/* BANNER — first-visit bottom bar / bottom sheet                     */
/* ═══════════════════════════════════════════════════════════════════ */
.ws-consent-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 99999;
  background: var(--ws-consent-banner-bg, #fff);
  box-shadow: 0 -2px 16px rgba(0, 0, 0, 0.1);
}
.ws-consent-banner[hidden] {
  display: none !important;
}

/* Desktop: full-width bottom bar, horizontal layout */
.ws-consent-banner__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  max-width: 1200px;
  margin: 0 auto;
  padding: 1rem 1.5rem;
}
.ws-consent-banner__text {
  flex: 1 1 auto;
  min-width: 0;
}
.ws-consent-banner__desc {
  color: var(--ws-consent-banner-color, #3a3a4e);
}
.ws-consent-banner__desc a {
  color: var(--ws-consent-banner-link-color, #2563eb);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.ws-consent-banner__desc a:hover {
  opacity: 0.8;
}
.ws-consent-banner__desc a:focus-visible {
  outline: 2px solid var(--ws-consent-accent);
  outline-offset: 2px;
}
.ws-consent-banner__actions {
  display: flex;
  gap: 0.5rem;
  flex-shrink: 0;
}

/* Mobile: bottom-sheet style */
@media (max-width: 992px) {
  .ws-consent-banner {
    border-radius: 14px 14px 0 0;
  }
  .ws-consent-banner__inner {
    flex-direction: column;
    align-items: stretch;
    padding: 1.25rem 1rem;
    gap: 1rem;
  }
  .ws-consent-banner__actions {
    flex-direction: column;
  }
}

/* ═══════════════════════════════════════════════════════════════════ */
/* OVERLAY                                                            */
/* ═══════════════════════════════════════════════════════════════════ */
.ws-consent-overlay {
  position: fixed;
  inset: 0;
  z-index: 100000;
  background: rgba(0, 0, 0, 0.45);
}
.ws-consent-overlay[hidden] {
  display: none !important;
}

/* ═══════════════════════════════════════════════════════════════════ */
/* MODAL — category toggles                                           */
/* ═══════════════════════════════════════════════════════════════════ */
.ws-consent-modal {
  position: fixed;
  inset: 0;
  z-index: 100001;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.ws-consent-modal[hidden] {
  display: none !important;
}
.ws-consent-modal__inner {
  position: relative;
  width: 100%;
  max-width: 560px;
  max-height: 85vh;
  overflow-y: auto;
  background: var(--ws-consent-body-bg);
  border-radius: 12px;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.2);
  /* padding: 1.5rem; */
}

.ws-consent-modal__content {
  padding: 1.5rem;
  padding-top: 1rem;
}

/* Header */
.ws-consent-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.5rem;
  border-bottom: 1px solid var(--ws-consent-header-border-color, #2563eb);
  background-color: var(--ws-consent-header-bg, #fff);
}
.ws-consent-modal__title {
  font-family: inherit;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--ws-consent-header-color, #1a1a2e);
}
.ws-consent-modal__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: transparent;
  border: none;
  border-radius: 6px;
  color: var(--ws-consent-header-link-color, #6b7280);
  cursor: pointer;
  transition: background 0.15s;
}
.ws-consent-modal__close:hover {
  background: #f0f0f5;
  color: #1a1a2e;
}
.ws-consent-modal__close:focus-visible {
  outline: 2px solid var(--ws-consent-accent);
  outline-offset: 2px;
}

/* Description */
.ws-consent-modal__desc {
  font-family: inherit;
  color: var(--ws-consent-body-color, #3a3a4e);
  margin-bottom: 1rem;
}
.ws-consent-modal__desc a {
  color: var(--ws-consent-body-link-color, #2563eb);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.ws-consent-modal__desc a:hover {
  opacity: 0.8;
}
.ws-consent-modal__desc a:focus-visible {
  outline: 2px solid var(--ws-consent-body-link-color, #2563eb);
  outline-offset: 2px;
}

/* Modal actions */
.ws-consent-modal__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1.25rem;
}

/* Mobile modal: bottom-sheet */
@media (max-width: 640px) {
  .ws-consent-modal {
    align-items: flex-end;
    padding: 0;
  }
  .ws-consent-modal__inner {
    max-width: 100%;
    max-height: 90vh;
    border-radius: 14px 14px 0 0;
    /* padding: 1.25rem 1rem; */
  }
  .ws-consent-modal__actions {
    flex-direction: column;
  }
}

/* ═══════════════════════════════════════════════════════════════════ */
/* CATEGORIES + TOGGLES                                               */
/* ═══════════════════════════════════════════════════════════════════ */
.ws-consent-categories {
  border: none;
}
.ws-consent-category {
  border-top: 1px solid #e5e7eb;
  padding: 0.75rem 0;
}
.ws-consent-category:last-child {
  border-bottom: 1px solid #e5e7eb;
}
.ws-consent-category__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.ws-consent-category__name {
  font-weight: 600;
  color: #1a1a2e;
}
.ws-consent-category__desc {
  margin-top: 0.3rem;
  font-size: 0.875rem;
  color: #6b7280;
  line-height: 1.45;
}
.ws-consent-category__badge {
  font-size: 0.7rem;
  font-weight: 600;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* Toggle switch */
.ws-consent-toggle {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  cursor: pointer;
}
.ws-consent-toggle input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.ws-consent-toggle__track {
  display: inline-flex;
  align-items: center;
  width: 38px;
  height: 22px;
  background: #cbd5e1;
  border-radius: 11px;
  padding: 2px;
  transition: background 0.2s;
  flex-shrink: 0;
}
.ws-consent-toggle__thumb {
  width: 18px;
  height: 18px;
  background: #fff;
  border-radius: 50%;
  transition: transform 0.2s;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}
/* Checked */
.ws-consent-toggle input:checked + .ws-consent-toggle__track {
  background: var(--ws-consent-accent, #2563eb);
}
.ws-consent-toggle input:checked + .ws-consent-toggle__track .ws-consent-toggle__thumb {
  transform: translateX(16px);
}
/* Disabled (necessary) */
.ws-consent-toggle input:disabled + .ws-consent-toggle__track {
  background: #94a3b8;
  cursor: not-allowed;
}
/* Focus ring (T-4) */
.ws-consent-toggle input:focus-visible + .ws-consent-toggle__track {
  outline: 2px solid var(--ws-consent-accent, #2563eb);
  outline-offset: 2px;
}

/* ═══════════════════════════════════════════════════════════════════ */
/* BUTTONS                                                            */
/* ═══════════════════════════════════════════════════════════════════ */
.ws-consent-btn {
  flex: 1 1 0;
  min-width: 150px;
  padding: 0.6rem 1rem;
  border: none;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  transition: background 0.15s, transform 0.1s;
}
.ws-consent-btn:active {
  transform: scale(0.97);
}
.ws-consent-btn:focus-visible {
  outline: 2px solid var(--ws-consent-accent, #2563eb);
  outline-offset: 2px;
}

/* QC-3: Reject all & Accept all — identical visual weight */
.ws-consent-btn--primary {
  background: #1a1a2e;
  color: #ffffff;
}
.ws-consent-btn--primary:hover {
  background: #2a2a40;
}

/* Customize / secondary */
.ws-consent-btn--secondary {
  background: #f0f0f5;
  color: #1a1a2e;
  border: 1px solid #d0d0da;
}
.ws-consent-btn--secondary:hover {
  background: #e4e4ec;
}

/* Save my choices — accent-coloured */
.ws-consent-btn--accent {
  background: var(--ws-consent-accent, #2563eb);
  color: #ffffff;
}
.ws-consent-btn--accent:hover {
  filter: brightness(0.9);
}

/* ═══════════════════════════════════════════════════════════════════ */
/* PRIVACY POLICY MODAL                                                */
/* ═══════════════════════════════════════════════════════════════════ */
.ws-consent-privacy__inner {
  max-width: 720px;
}
.ws-consent-privacy__body {
  font-family: inherit;
  color: #3a3a4e;
  line-height: 1.65;
}
.ws-consent-modal .ws-consent-privacy__body {
  max-height: 60vh;
  overflow-y: auto;
  padding-right: 0.5rem;
}
.ws-consent-privacy__body h1,
.ws-consent-privacy__body h2,
.ws-consent-privacy__body h3,
.ws-consent-privacy__body h4 {
  font-family: inherit;
  color: #1a1a2e;
  font-weight: 700;
  margin-top: 1.25rem;
  margin-bottom: 0.5rem;
}
.ws-consent-privacy__body h1 { font-size: 1.5rem; }
.ws-consent-privacy__body h2 { font-size: 1.1rem; }
.ws-consent-privacy__body h3 { font-size: 1rem; }
.ws-consent-privacy__body h4 { font-size: 0.9375rem; }
.ws-consent-privacy__body p {
  margin-bottom: 0.75rem;
}
.ws-consent-privacy__body address {
  margin-bottom: 1rem;
}
.ws-consent-privacy__body ul,
.ws-consent-privacy__body ol {
  margin-bottom: 0.75rem;
  padding-left: 1.5rem;
}
.ws-consent-privacy__body li {
  margin-bottom: 0.25rem;
}
.ws-consent-privacy__body address p {
  margin-bottom: 0;
}
.ws-consent-privacy__body a {
  color: var(--ws-consent-body-link-color);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.ws-consent-privacy__body a:hover {
  opacity: 0.8;
}
@media (max-width: 640px) {
  .ws-consent-privacy__inner {
    max-width: 100%;
  }
}

/* ═══════════════════════════════════════════════════════════════════ */
/* BLOCKED ELEMENT PARTIAL                                             */
/* ═══════════════════════════════════════════════════════════════════ */
.ws-consent-form-blocked button {
  color: var(--ws-consent-preference-button-color, #FFF);
  background-color: var(--ws-consent-preference-button-bg, #2563eb);
}

.ws-consent-form-blocked a {
  color: var(--ws-consent-body-link-color);
  display: inline-block;
  padding: 5px;
}


/* ═══════════════════════════════════════════════════════════════════ */
/* FOOTER LINK (QC-4 persistent re-access)                             */
/* ═══════════════════════════════════════════════════════════════════ */
.ws-consent-footer-link {
  position: fixed;
  bottom: 1rem;
  left: 1rem;
  z-index: 999;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: var(--ws-consent-preference-button-bg, #2563eb);
  color: var(--ws-consent-preference-button-color, #fff);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 2rem;
  font-size: 0.8125rem;
  cursor: pointer;
  padding: 0.5rem 1rem;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  transition: opacity 0.15s, box-shadow 0.15s, bottom 0.15s;
}
.ws-consent-footer-link:hover {
  color: #fff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}
.ws-consent-footer-link:focus-visible {
  outline: 2px solid var(--ws-consent-accent, #2563eb);
  outline-offset: 2px;
  color: #fff;
}
.ws-consent-footer-link--nudge {
  bottom: var(--ws-consent-preference-button-nudge-amount, 1rem);
}
.ws-consent-footer-link__icon {
  flex-shrink: 0;
}
.ws-consent-last-modified {
  margin: 0;
  margin-top: 0.75rem;
}


/* ═══════════════════════════════════════════════════════════════════ */
/* REDUCED MOTION                                                     */
/* ═══════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  .ws-consent-toggle__track,
  .ws-consent-toggle__thumb,
  .ws-consent-btn,
  .ws-consent-modal__close,
  .ws-consent-footer-link {
    transition: none;
  }
}
/* ------------------- */
/*        setup        */
/* ------------------- */
:root {
  --primary: #2E4740;
  --primary-dark: #1C2421;
  --mist: #C8DDD7;
  --accent: #476559;
  --forest-green: #5D8575;
  --dark: #1C2421;
  --white: #ffffff;
  --txt-color: #525252;
  --light-grey: #F8F9FA;
  --border: #D9D9D9;
  --border-light: #e9eaeb;
  --amber-oak: #A0622A;
  
  /* Fonts */
  --heading-font: "Libre Baskerville", serif;
  --body-font: "Source Sans 3", sans-serif;

  /* Cookie Consent Theming */
  --ws-consent-header-bg: var(--primary);
  --ws-consent-header-color: var(--white);
  --ws-consent-header-link-color: var(--white);
  --ws-consent-header-border-color: var(--border);
  --ws-consent-body-bg: #fff;
  --ws-consent-body-color: var(--txt-color);
  --ws-consent-preference-button-bg: var(--primary);
  --ws-consent-preference-button-color: #fff;
  
  --ws-consent-accent: var(--forest-green);
}


@media screen and (max-width: 1080px) {
:root {
        --ws-consent-preference-button-nudge-amount: 5.5rem;
    }
}
@media screen and (max-width: 400px) {
:root {
        --ws-consent-preference-button-nudge-amount: 6.75rem;
    }
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  font-family: var(--body-font);
  color: var(--txt-color);
  background-color: var(--white);
}

.main {
  flex: 1;
}

body a {
  text-decoration: none;
  color: inherit;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--heading-font);
  margin-bottom: 0;
}

/* Text wrap: balance for headings, pretty for body text.
   Progressive enhancement -- ignored by unsupported browsers. */
h1, h2, h3, h4, h5, h6,
.ca-box__title,
.ca-cta-banner__heading,
.ca-hero__heading,
.ca-blog-card__heading,
.ca-news-card__title,
.ca-report-card__title,
.ca-job-card__title,
.ca-team-card__name,
.ca-faq-group-title,
.footer-col-title {
  text-wrap: balance;
}

.section-title,
.rich-text-section,
.ca-hero__lead,
.ca-lead-text,
.ca-about-body,
.ca-guide-section-desc,
.ca-cta-banner__body,
.ca-timeline-text,
.ca-news-card__excerpt,
.ca-box__text,
.ca-faq-answer,
.ca-bio-modal__body-text,
.ca-contact-card__desc,
.ca-form-legal,
.ca-step__text,
.ca-report-card__desc,
.ca-job-card__excerpt {
  text-wrap: pretty;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

::selection {
  background-color: var(--amber-oak);
  color: white;
}

::-moz-selection {
  background-color: var(--amber-oak);
  color: white;
}

/* ------------------- */
/*      utilities      */
/* ------------------- */

/* max-width helpers */
.mw-280 {
  max-width: 280px;
}

.mw-576 {
  max-width: 576px;
}

.mw-480 {
  max-width: 480px;
}

.mw-768 {
  max-width: 768px;
}

.mw-991 {
  width: 100%;
  max-width: 991px;
}

.mw-1024 {
  width: 100%;
  max-width: 1024px;
}

/* these go full-width on mobile, capped at laptop+ (see responsive.css) */
.mw-lg-576 {
  width: 100%;
}

/* background utilities */
.bg-light-grey {
  background-color: var(--light-grey);
}

.bg-mist {
  background-color: var(--mist);
}


/* ------------------- */
/*   section layout    */
/* ------------------- */
.section-p {
  padding-top: 64px;
  padding-bottom: 64px;
}

.single-p {
  padding-bottom: 64px;
}

.section-divider {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.section-divider div {
  height: 1px;
  width: 100%;
  max-width: 1300px;
  padding: 0 32px;
  align-self: center;
  background-color: var(--border);
}


/* ------------------- */
/*     typography      */
/* ------------------- */

/* section titles */
.section-title h2 {
  color: var(--primary);
  font-size: 30px;
  font-weight: 700;
  line-height: 38px;
  margin-bottom: 24px;
}

.section-title h3 {
  color: var(--primary);
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  margin-bottom: 16px;
}

/* body text — WCAG minimum 16px for body copy */
.section-title p,
.section-title ul {
  color: var(--txt-color);
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
}

/* inline links within section text */
.section-title p a {
  color: var(--primary);
  font-weight: 500;
  text-decoration: underline 2px transparent;
  transition: text-decoration-color 0.2s ease;
}

.section-title p a:hover {
  text-decoration-color: var(--primary);
}

/* rich-text / CMS content block */
.rich-text-section {
  color: var(--txt-color);
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
}

.rich-text-section h2 {
  color: var(--primary);
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
  margin-bottom: 24px;
  margin-top: 32px;
}

.rich-text-section h3 {
  color: var(--primary);
  font-size: 20px;
  font-weight: 700;
  line-height: 30px;
  margin-top: 24px;
  margin-bottom: 16px;
}

.rich-text-section p {
  color: var(--txt-color);
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
}

.rich-text-section a {
  color: var(--primary);
  font-weight: 500;
  text-decoration: underline 2px transparent;
  transition: text-decoration-color 0.2s ease;
}

.rich-text-section a:hover {
  text-decoration-color: var(--primary);
}

.rich-text-section .section-divider {
  margin-top: 48px;
}

/* ordered list nesting: 1. → a. → i. */
.rich-text-section ol {
  list-style: decimal;
  padding-left: 24px;
}

.rich-text-section ol li {
  color: var(--txt-color);
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  margin-bottom: 8px;
}

.rich-text-section ol ol {
  list-style: lower-alpha;
  margin-top: 8px;
}

.rich-text-section ol ol ol {
  list-style: lower-roman;
}

/* ----------------------- */
/*    image containers     */
/* ----------------------- */

/* rich-text inline image */
.rich-text-img {
  margin-bottom: 48px;
  width: 100%;
  height: 200px;
  box-shadow:
    0.3px 0.5px 0.7px hsl(0deg 0% 63% / 0.34),
    0.4px 0.8px 1px -1.2px hsl(0deg 0% 63% / 0.34),
    1px 2px 2.5px -2.5px hsl(0deg 0% 63% / 0.34);
}

.rich-text-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}



/* -------------------- */
/* skip to main content */
/* -------------------- */
.skip-to-main-content {
  position: absolute;
  left: -9999px;
  z-index: 9999;
  padding: 1em;
  background-color: var(--dark);
  color: var(--white);
  opacity: 0;
}

.skip-to-main-content:focus {
  left: 50%;
  top: 1%;
  transform: translateX(-50%);
  opacity: 1;
  outline: 3px solid var(--primary);
  outline-offset: 2px;
}


/* ------------------- */
/*       buttons       */
/* ------------------- */
/*
 * Base: padding 12px 18px / border 1px solid / border-radius 8px
 * Bootstrap's .btn class already handles :focus-visible ring — don't duplicate.
 * Transitions on bg-color, color, and border-color only.
 */
.btn {
  font-family: var(--body-font);
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  padding: 12px 18px;
  border-radius: 8px;
  border: 1px solid transparent;
  white-space: nowrap;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

/* primary — deep-forest background */
.btn-ca-primary {
  background-color: var(--accent);
  border-color: var(--mist);
  color: var(--white);
  font-weight: 600;
  font-size: 16px;
}

.btn-ca-primary:is(:hover, :focus-visible) {
  background-color: var(--mist);
  border-color: var(--forest-green);
  color: var(--primary);
}

.btn-ca-primary:active {
  background-color: var(--mist);
  border-color: var(--forest-green);
  color: var(--primary);
  box-shadow: none;
}

/* secondary — white background */
.btn-ca-secondary {
  background-color: var(--white);
  border-color: var(--forest-green);
  color: var(--primary);
  font-weight: 600;
  font-size: 16px;
}

.btn-ca-secondary:is(:hover, :focus-visible) {
  background-color: var(--accent);
  border-color: var(--forest-green);
  color: var(--white);
}

.btn-ca-secondary:active {
  background-color: var(--accent);
  border-color: var(--forest-green);
  color: var(--white);
  box-shadow: none;
}


/* ------------------- */
/*        navbar       */
/* ------------------- */
/*
 * Rename .ws-nav to a project-specific class and update navScroll.js to match.
 * The .scrolled class is added by navScroll.js on scroll.
 */
.ws-nav {
  background-color: var(--primary);
  border-bottom: 2px solid var(--mist);
  transition: box-shadow 0.3s ease;
}

.ws-nav.scrolled {
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}

.ws-nav .navbar {
  --bs-navbar-padding-y: 16px;
}

/* logo */
.navbar-brand {
  padding: 0;
}

.navbar-brand img {
  /* height: 54px; */
  height: 50px;
  width: auto;
  object-fit: contain;
}

/* nav links */
.ws-nav .nav-item .nav-link {
  color: var(--white);
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  border-bottom: 2px solid transparent;
  transition: color 0.2s ease, border-color 0.2s ease;
}

.ws-nav .nav-item .nav-link:is(:hover, :active, .active, .show) {
  color: var(--mist);
  border-bottom-color: var(--mist);
}

/* hamburger */
.navbar-toggler {
  width: 44px;
  height: 44px;
  padding: 10px 9px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  color: var(--white);
  background-color: transparent;
  transition: background-color 0.2s ease;
}

.navbar-toggler:is(:hover, :active, :focus-visible) {
  background-color: rgba(255, 255, 255, 0.15);
}

/* offcanvas */
.offcanvas {
  background-color: var(--primary);
}

.ws-nav .btn-close {
  background-image: none;
  color: var(--white);
  opacity: 1;
}

/* dropdown menu */
.nav-item .dropdown-menu {
  background-color: var(--primary-dark);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  padding: 6px;
  min-width: 180px;
  margin-top: 4px !important;

  &.show {
    display: flex;
  }

  flex-direction: column;
  row-gap: 4px;
}

.nav-item .dropdown-item {
  color: rgba(255, 255, 255, 0.85);
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  border-radius: 6px;
  padding: 8px 12px;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.nav-item .dropdown-item:is(:hover, :focus, .active) {
  background-color: rgba(255, 255, 255, 0.1);
  color: var(--white);
}

/* language toggle */
.lang-toggle {
  display: flex;
  width: fit-content;
  background-color: #1c2b38;
  border: 1px solid var(--forest-green);
  border-radius: 8px;
  overflow: hidden;
  padding: 0;
}

.btn.lang-btn {
  background-color: transparent;
  border: none;
  border-radius: 0;
  color: var(--light-grey);
  font-weight: 700;
  font-size: 14px;
  /* WCAG: UI label, 14px minimum */
  min-width: 40px;
  height: auto;
  padding: 8px 12px;
  transition: background-color 0.2s ease, color 0.2s ease;
  text-transform: capitalize;
}

.btn.lang-btn:is(:hover, :active, :focus-visible) {
  background-color: rgba(255, 255, 255, 0.1);
}

/* active language (current page language) */
.btn.lang-btn.active {
  background-color: var(--mist);
  color: var(--primary);
}

.btn.lang-btn.active:is(:hover, :focus-visible) {
  background-color: var(--mist);
  color: var(--primary);
}



/* ------------------- */
/*       footer        */
/* ------------------- */
footer {
  background-color: var(--primary);
  border-top: 1px solid #4a9469;
  padding: 64px 0 32px;
}

/* logo */
.footer-logo-link {
  display: block;
}

/*
 * Footer column labels — use <p class="footer-col-title"> NOT <h2/h3>.
 * These are visual labels, not content headings. Using heading tags here
 * pollutes the page's heading outline for screen reader users.
 */
.footer-col-title {
  color: var(--mist);
  font-size: 14px;
  /* WCAG: label, 14px minimum */
  font-weight: 700;
  line-height: 20px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 12px;
}

/* footer internal divider */
footer .section-divider div {
  background-color: rgba(255, 255, 255, 0.15);
}

/* bottom strip */
.footer-end {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: flex-start;
}

.footer-end * {
  color: rgba(255, 255, 255, 0.75);
  font-size: 16px;
  line-height: 24px;
}

.footer-end a:hover {
  color: var(--white);
}




/* ------------------------------------------------------------ */
/*  Consumer Advocate for Insurance — Project Styles            */
/* ------------------------------------------------------------ */


/* ---- Hero ---- */
.ca-hero {
  background-color: var(--primary);
  position: relative;
  overflow: hidden;
  padding-top: 106px;
  padding-bottom: 64px;
}

.ca-hero__bg-vector {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 1333px;
  height: 1109px;
  pointer-events: none;
  z-index: 0;
}

.ca-hero__bg-vector img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ca-hero>.container {
  position: relative;
  z-index: 1;
}

.ca-hero__eyebrow {
  display: block;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--mist);
  margin-bottom: 24px;
}

.ca-hero__heading {
  font-family: var(--heading-font);
  font-size: 30px;
  font-weight: 400;
  line-height: 40px;
  letter-spacing: -0.6px;
  color: var(--white);
  max-width: 1024px;
  margin-bottom: 24px;
}

.ca-hero__accent {
  color: var(--mist);
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 2px;
  font-family: var(--heading-font);
}

.ca-hero__lead {
  font-size: 20px;
  line-height: 30px;
  color: var(--white);
  max-width: 640px;
}

.ca-hero__image {
  width: 100%;
  height: 220px;
  border-radius: 16px;
  overflow: hidden;
  margin-top: 32px;
  position: relative;
  z-index: 1;
}

.ca-hero__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}


/* ---- Badge / Eyebrow pill ---- */
.ca-badge {
  display: inline-flex;
  align-items: center;
  background-color: var(--mist);
  border: 1px solid var(--forest-green);
  border-radius: 6px;
  padding: 2px 8px;
  font-size: 14px;
  font-weight: 500;
  color: var(--primary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 16px;
}


/* ---- Section headings (project-specific) ---- */
.ca-section-h2 {
  font-size: 28px;
  font-weight: 700;
  line-height: 36px;
  letter-spacing: -0.56px;
  color: var(--primary);
  margin-bottom: 24px;
}

.ca-italic-accent {
  font-style: italic;
  color: var(--accent);
  font-family: var(--heading-font);
}

.ca-lead-text {
  font-size: 18px;
  line-height: 28px;
  color: var(--txt-color);
  margin-bottom: 0;
}


/* ---- Step card ("How to file") ---- */
.ca-step-card {
  width: 100%;
  max-width: 100%;
  background-color: var(--white);
  border-radius: 16px;
  overflow: hidden;
  box-shadow:
    0 12px 16px -4px rgba(0, 0, 0, 0.08),
    0 4px 6px -2px rgba(0, 0, 0, 0.03),
    0 2px 2px -1px rgba(0, 0, 0, 0.04);
  border: 1px solid rgba(0, 0, 0, 0.1);
}

.ca-step-card__banner {
  background-color: var(--primary);
  padding: 12px 8px;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  color: var(--mist);
  letter-spacing: 0.02em;
}

.ca-step-card__body {
  padding: 32px;
}

.ca-step-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.ca-step {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.ca-step__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-color: var(--mist);
  border-radius: 50%;
  font-size: 16px;
  font-weight: 400;
  color: var(--txt-color);
  line-height: 1;
}

.ca-step__text {
  color: var(--txt-color);
  font-size: 16px;
  line-height: 24px;
  margin: 0;
}

.ca-step-card__footer {
  padding: 0 32px 32px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
}

.ca-step-card__note {
  font-size: 14px;
  color: var(--accent);
  margin: 0;
  text-align: center;
}


/* ---- Feature cards ---- */
h2.ca-features-title {
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  letter-spacing: -0.48px;
  color: var(--primary);
  margin-bottom: 0;
}

.ca-feature-col {
  padding-top: 32px;
  /* room for the icon that overflows the card top */
}

.ca-feature-card {
  background-color: var(--primary);
  border-radius: 16px;
  padding: 52px 24px 32px;
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
}

/* ---- Icon box (unified) ---- */
/* Base class: shared appearance. Size modifiers: --sm 40px, --md 48px, --lg 64px (floating) */
.ca-icon-box {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background-color: var(--mist);
  border: 1px solid var(--forest-green);
  color: var(--primary);
}

.ca-icon-box--sm {
  width: 40px;
  height: 40px;
  border-radius: 6px;
  font-size: 20px;
}

.ca-icon-box--md {
  width: 48px;
  height: 48px;
  border-radius: 10px;
  font-size: 22px;
}

.ca-icon-box--lg {
  position: absolute;
  top: -32px;
  left: 50%;
  transform: translateX(-50%);
  width: 64px;
  height: 64px;
  border-radius: 13px;
  font-size: 26px;
}

.ca-feature-card h3 {
  font-family: var(--body-font);
  font-size: 18px;
  font-weight: 700;
  line-height: 28px;
  color: var(--mist);
  margin-bottom: 0;
}

.ca-feature-card p {
  font-size: 16px;
  line-height: 24px;
  color: var(--white);
  margin-bottom: 0;
  flex: 1;
}

.ca-feature-link {
  font-size: 16px;
  font-weight: 600;
  color: var(--white);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: gap 0.2s ease, color 0.2s ease;
  margin-top: auto;
}

.ca-feature-link:hover {
  color: var(--mist);
  gap: 10px;
}


/* ---- Stats / Impact section ---- */
.ca-stats-section {
  background-color: var(--mist);
  position: relative;
  overflow: hidden;
}

.ca-stats-bg-vector {
  position: absolute;
  top: 50%;
  left: calc(50% - 401px);
  transform: translateY(-50%);
  width: 523px;
  height: 434px;
  pointer-events: none;
  opacity: 0.6;
  filter: brightness(0);
}

.ca-stats-bg-vector img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

h2.ca-stats-heading {
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
  letter-spacing: -0.48px;
  color: var(--primary);
  margin-bottom: 20px;
}

.ca-stat-card {
  background-color: var(--white);
  border-radius: 16px;
  padding: 32px;
  text-align: center;
  height: 100%;
}

.ca-stat-number {
  font-size: 32px;
  font-weight: 600;
  line-height: 40px;
  letter-spacing: -0.64px;
  color: var(--primary);
  margin-bottom: 8px;
}

.ca-stat-label {
  font-size: 18px;
  line-height: 28px;
  color: var(--txt-color);
  margin-bottom: 0;
}


/* ---- Blog / News section ---- */
h2.ca-news-heading {
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  letter-spacing: -0.48px;
  color: var(--primary);
  margin-bottom: 0;
}

.ca-blog-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  color: inherit;
  text-decoration: none;
}

.ca-blog-card__img {
  width: 100%;
  height: 240px;
  border-radius: 16px;
  overflow: hidden;
  border: 0.5px solid rgba(0, 0, 0, 0.1);
  flex-shrink: 0;
}

.ca-blog-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.2s ease;
}

.ca-blog-card:hover .ca-blog-card__img img {
  opacity: 0.85;
}

.ca-blog-card__date {
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--accent);
  margin-bottom: 8px;
}

.ca-blog-card__heading-row {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.ca-blog-card__heading {
  font-size: 18px;
  font-weight: 600;
  line-height: 28px;
  color: var(--dark);
  margin-bottom: 0;
  flex: 1;
  text-decoration: underline 2px transparent;
  transition: text-decoration-color 0.2s ease;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-family: var(--body-font);
}

.ca-blog-card:hover .ca-blog-card__heading {
  text-decoration-color: var(--dark);
}

.ca-blog-card__icon {
  flex-shrink: 0;
  color: var(--dark);
  font-size: 16px;
  margin-top: 4px;
}


/* ---- Footer project additions ---- */
.footer-logo-link img {
  max-height: 80px;
  width: auto;
  object-fit: contain;
  margin-left: auto;
  margin-right: auto;
}

/* footer nav columns */
.footer-nav-col__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.footer-nav-col__link {
  color: rgba(255, 255, 255, 0.72);
  font-size: 16px;
  line-height: 24px;
  transition: color 0.2s ease;
}

.footer-nav-col__link:hover {
  color: var(--white);
}

.footer-info-text {
  color: var(--light-grey);
  font-size: 18px;
  line-height: 28px;
  margin: 0;
}

a.footer-info-text {
  transition: color 0.2s ease;
  text-decoration: none;
}

a.footer-info-text:hover {
  color: var(--white);
}

.footer-contact-icon {
  display: flex;
  align-items: center;
  gap: 8px;
}

.footer-social-icon-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background-color: var(--mist);
  border-radius: 8px;
  color: var(--primary);
  font-size: 18px;
  transition: background-color 0.2s ease;
  text-decoration: none;
}

.footer-social-icon-box:hover {
  background-color: var(--white);
  color: var(--primary);
}


/* ---- FAQ page ---- */

/* Tab bar */
.ca-faq-tabs {
  display: flex;
  justify-content: center;
  margin-bottom: 48px;
}

.ca-faq-tab-list {
  display: flex;
  gap: 4px;
  background-color: var(--light-grey);
  border: 1px solid var(--border-light);
  border-radius: 12px;
  padding: 6px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  max-width: 100%;
}

.ca-faq-tab-list::-webkit-scrollbar {
  display: none;
}

.ca-faq-tab-btn {
  flex-shrink: 0;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 10px 12px;
  font-family: var(--body-font);
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: var(--accent);
  cursor: pointer;
  white-space: nowrap;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.ca-faq-tab-btn.active {
  background-color: var(--accent);
  border-color: var(--mist);
  color: var(--white);
}

.ca-faq-tab-btn:hover:not(.active) {
  background-color: rgba(71, 101, 89, 0.08);
}

.ca-faq-tab-btn:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}

/* FAQ content column */
.ca-faq-content {
  max-width: 768px;
  margin-left: auto;
  margin-right: auto;
}

/* Category group */
.ca-faq-group {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ca-faq-group+.ca-faq-group {
  margin-top: 48px;
}

.ca-faq-group-title {
  font-family: var(--heading-font);
  font-size: 20px;
  font-weight: 700;
  line-height: 30px;
  color: var(--primary);
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border-light);
  margin-bottom: 4px;
}

/* Accordion item */
.ca-faq-item {
  border: 1px solid var(--border);
  border-radius: 16px;
  background-color: var(--white);
  overflow: hidden;
  transition: background-color 0.2s ease;
}

/* Bootstrap removes top border and border-radius on non-first items — restore both */
.ca-faq-group .ca-faq-item:not(:first-of-type) {
  border-top: 1px solid var(--border);
}

.ca-faq-group .ca-faq-item:first-of-type,
.ca-faq-group .ca-faq-item:last-of-type {
  border-radius: 16px;
}

.ca-faq-item:has(.accordion-button:not(.collapsed)) {
  background-color: rgba(93, 133, 117, 0.10);
}

.ca-faq-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  padding: 20px 24px;
  background: transparent;
  border: none;
  text-align: left;
  cursor: pointer;
  font-family: var(--body-font);
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: var(--dark);
}

/* Remove Bootstrap's built-in chevron */
.accordion-button.ca-faq-btn::after {
  display: none;
}

/* Reset Bootstrap active-state and focus overrides */
.accordion-button.ca-faq-btn:not(.collapsed) {
  background-color: transparent;
  box-shadow: none;
  color: var(--dark);
}

.accordion-button.ca-faq-btn:focus {
  outline: none;
  box-shadow: none;
  /* removes Bootstrap's default ring; branded ring applied via :focus-visible below */
}

/* Reset Bootstrap's border-radius on first/last item buttons */
.ca-faq-group .ca-faq-item:first-of-type>.accordion-header .ca-faq-btn,
.ca-faq-group .ca-faq-item:last-of-type>.accordion-header .ca-faq-btn {
  border-radius: 0;
}

.ca-faq-btn:focus-visible {
  outline: 2px solid var(--forest-green);
  outline-offset: 2px;
  border-radius: 14px;
  box-shadow: 0 0 0 4px rgba(93, 133, 117, 0.2);
}

.ca-faq-chevron {
  flex-shrink: 0;
  font-size: 14px;
  color: var(--primary);
  transition: transform 0.25s ease;
}

.accordion-button.ca-faq-btn:not(.collapsed) .ca-faq-chevron {
  transform: rotate(180deg);
}

.ca-faq-answer {
  padding: 0 24px 20px;
}

.ca-faq-answer p {
  font-size: 16px;
  line-height: 26px;
  color: var(--txt-color);
  margin-bottom: 0;
}

/* CTA banner */
.ca-cta-banner {
  background-color: var(--mist);
  border-radius: 16px;
  padding: 40px 32px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.ca-cta-banner__text-col {
  max-width: 768px;
}

.ca-cta-banner--white {
  background-color: var(--white);
}

.ca-cta-banner__heading {
  font-family: var(--heading-font);
  font-size: 26px;
  font-weight: 700;
  line-height: 36px;
  letter-spacing: -0.52px;
  color: var(--accent);
  margin-bottom: 12px;
}

.ca-cta-banner__body {
  font-size: 18px;
  line-height: 28px;
  color: var(--txt-color);
  margin-bottom: 0;
}

/* ---- About page ---- */
h2.ca-about-h2 {
  font-size: 28px;
  font-weight: 700;
  line-height: 36px;
  letter-spacing: -0.56px;
  color: var(--primary);
  margin-bottom: 20px;
}

h3.ca-about-h3 {
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  color: var(--primary);
  margin-bottom: 20px;
}

.ca-about-body p {
  font-size: 18px;
  line-height: 28px;
  color: var(--txt-color);
  margin-bottom: 18px;
}

.ca-about-body p:last-child {
  margin-bottom: 0;
}

.ca-about-img {
  width: 100%;
  height: 300px;
  border-radius: 16px;
  overflow: hidden;
}

.ca-about-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ---- Timeline ---- */
.ca-timeline {
  max-width: 680px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  padding-left: 24px;
  list-style: none;
}

.ca-timeline::before {
  content: '';
  position: absolute;
  left: 3px;
  top: 14px;
  bottom: 0;
  width: 2px;
  background-color: var(--mist);
}

.ca-timeline-item {
  position: relative;
  padding-bottom: 28px;
}

.ca-timeline-item:last-child {
  padding-bottom: 0;
}

.ca-timeline-item::before {
  content: '';
  position: absolute;
  left: -24px;
  top: 10px;
  width: 9px;
  height: 9px;
  background-color: var(--primary);
  border: 2px solid var(--mist);
  border-radius: 50%;
}

.ca-timeline-year {
  font-size: 18px;
  font-weight: 700;
  line-height: 28px;
  color: var(--primary);
  margin-bottom: 4px;
}

.ca-timeline-text {
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  color: var(--txt-color);
  margin-bottom: 0;
}


/* ---- Team page ---- */
.ca-team-card {
  border: 1px solid var(--border-light);
  border-radius: 16px;
  background-color: var(--white);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.ca-team-card__photo {
  width: 100%;
  height: 220px;
  background-color: var(--mist);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}

.ca-team-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ca-team-card__avatar {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background-color: var(--primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--heading-font);
  font-size: 28px;
  font-weight: 700;
  color: var(--white);
  letter-spacing: 0.5px;
  flex-shrink: 0;
}

.ca-team-card__body {
  padding: 20px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.ca-team-card__name {
  font-family: var(--heading-font);
  font-size: 18px;
  font-weight: 700;
  color: var(--dark);
  margin-bottom: 4px;
  line-height: 26px;
}

.ca-team-card__role {
  font-size: 14px;
  font-weight: 600;
  color: var(--forest-green);
  margin-bottom: 14px;
  line-height: 20px;
}

.ca-team-bullets {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}

.ca-team-bullets li {
  font-size: 14px;
  line-height: 20px;
  color: var(--txt-color);
  padding-left: 16px;
  position: relative;
}
.ca-team-bullets span {
  font-size: 14px;
  line-height: 20px;
  color: var(--txt-color);
  position: relative;
}

.ca-team-bullets li::before {
  content: '–';
  position: absolute;
  left: 0;
  color: var(--forest-green);
}

/* Team CTA card — links to careers page */
.ca-team-cta {
  display: flex;
  flex-direction: column;
  gap: 16px;
  height: 100%;
  padding: 20px;
  background-color: var(--mist);
  border: 2px dashed var(--forest-green);
  border-radius: 16px;
  text-decoration: none;
  color: var(--primary);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.ca-team-cta:hover {
  border-color: var(--primary);
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.07);
}

.ca-team-cta:hover .ca-card-link {
  color: var(--accent);
  border-color: var(--accent);
}

.ca-team-cta:hover .ca-card-link i {
  transform: translateX(2px);
}

.ca-team-cta__icon {
  width: 48px;
  height: 48px;
  border-radius: 10px;
  background-color: var(--primary);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  flex-shrink: 0;
}

.ca-team-cta__heading {
  font-family: var(--heading-font);
  font-size: 18px;
  font-weight: 700;
  line-height: 26px;
  color: var(--primary);
  margin-bottom: 0;
}

.ca-team-cta__body {
  font-size: 14px;
  line-height: 22px;
  color: var(--primary);
  opacity: 0.8;
  margin-bottom: 0;
  flex: 1;
}

/* Team bio modal */
.ca-bio-modal .modal-header {
  border-bottom: 1px solid var(--border-light);
  padding: 20px 24px;
  align-items: flex-start;
}

.ca-bio-modal .modal-title {
  font-family: var(--heading-font);
  font-size: 20px;
  font-weight: 700;
  color: var(--dark);
  line-height: 28px;
}

.ca-bio-modal__role {
  font-size: 14px;
  font-weight: 600;
  color: var(--forest-green);
  margin-top: 2px;
}

.ca-bio-modal__photo-wrap {
  width: 100%;
  height: 220px;
  background-color: var(--mist);
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  flex-shrink: 0;
}
.ca-bio-modal__photo-wrap:has(img) {
  background-color: transparent;
}

.ca-bio-modal__photo-wrap img {
  width: auto;
  height: 100%;
  object-fit: cover;
  aspect-ratio: calc(61 / 44.0);
  border-radius: inherit;
}

.ca-bio-modal__avatar {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background-color: var(--primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--heading-font);
  font-size: 24px;
  font-weight: 700;
  color: var(--white);
}

.ca-bio-modal__body-text p {
  font-size: 16px;
  line-height: 26px;
  color: var(--txt-color);
  margin-bottom: 14px;
}

.ca-bio-modal__body-text p:last-child {
  margin-bottom: 0;
}

.ca-bio-modal .modal-footer {
  border-top: 1px solid var(--border-light);
  padding: 16px 24px;
}


/* ---- Insurance guides page ---- */
/* (selector rules use element prefix for specificity parity with .section-title h2) */
.ca-guide-section-intro {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

h2.ca-guide-section-h2 {
  font-family: var(--heading-font);
  font-size: 28px;
  font-weight: 600;
  line-height: 36px;
  letter-spacing: -0.56px;
  color: var(--primary);
  margin-bottom: 0;
}

.ca-guide-section-desc {
  font-size: 18px;
  line-height: 28px;
  color: var(--txt-color);
  margin-bottom: 0;
}

.ca-coverage-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  white-space: nowrap;
  flex-shrink: 0;
}

.ca-coverage-badge--mandatory {
  background-color: var(--mist);
  border: 1px solid var(--forest-green);
  color: var(--primary);
}

.ca-coverage-badge--optional {
  background-color: rgba(74, 87, 83, 0.10);
  border: 1px solid rgba(74, 87, 83, 0.75);
  color: var(--accent);
}

.ca-coverage-badge--numbered {
  background-color: var(--mist);
  border: 1px solid var(--forest-green);
  color: var(--primary);
  min-width: 24px;
  justify-content: center;
}

/* ---- Shared content box (ca-box) ---- */
/*
 * Default: white background + border — used as anchor tags on useful-links.
 * Modifier ca-box--tinted: translucent green fill — used on insurance-guides.
 */
.ca-box-container{
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    align-items: stretch;
}
.ca-box {
    background-color: var(--white);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    height: auto;
    flex: 1 1 280px;
    /* max-width: 596px; */
}

.ca-box--tinted {
  background-color: rgba(93, 133, 117, 0.10);
  border-color: transparent;
}

a.ca-box {
  text-decoration: none;
  color: inherit;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

a.ca-box:is(:hover, :active) {
  border-color: var(--forest-green);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

.ca-box__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.ca-box__action-icon {
  flex-shrink: 0;
  font-size: 16px;
  color: var(--txt-color);
  transition: color 0.2s ease;
}

a.ca-box:hover .ca-box__action-icon {
  color: var(--primary);
}

.ca-box__title {
  font-size: 18px;
  font-weight: 600;
  line-height: 28px;
  color: var(--dark);
  margin-bottom: 4px;
}

.ca-box__text {
  font-size: 16px;
  line-height: 24px;
  color: var(--txt-color);
  margin-bottom: 0;
}

.ca-guide-subsection-title {
  font-size: 20px;
  font-weight: 700;
  line-height: 30px;
  color: var(--primary);
  padding-top: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border-light);
  margin-bottom: 0;
}

/*
 * Useful-links group heading — smaller than ca-guide-section-h2.
 * Sits inside .section-title so needs element prefix for specificity parity.
 * Base: 20px/28px → 24px/32px at 768px (see responsive.css).
 */
h2.ca-links-group-h2 {
  font-family: var(--heading-font);
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: -0.4px;
  color: var(--primary);
  margin-bottom: 0;
}


/* ---- Annual reports page ---- */
.ca-reports-featured {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  width: 100%;
  max-width: 768px;
}

.ca-report-card {
  flex: 1 0 240px;
  min-width: 240px;
  background-color: var(--white);
  border: 1px solid var(--border);
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.ca-report-card__cover {
  position: relative;
  height: 160px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.ca-report-card__cover--mist {
  background-color: var(--mist);
}

.ca-report-card__cover--cream {
  background-color: #F5E6D3;
}

.ca-report-card__year {
  font-family: var(--heading-font);
  font-size: 36px;
  font-weight: 600;
  line-height: 44px;
  color: var(--primary);
  text-align: center;
}

.ca-report-card__latest-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background-color: var(--white);
  border: 1px solid var(--forest-green);
  border-radius: 9999px;
  padding: 2px 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  color: var(--primary);
  letter-spacing: 0.03em;
}

.ca-report-card__body {
  padding: 16px;
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 16px;
}

.ca-report-card__text-wrap {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ca-report-card__title {
  font-size: 18px;
  font-weight: 600;
  line-height: 28px;
  color: var(--dark);
  margin-bottom: 0;
  opacity: 0.9;
}

.ca-report-card__desc {
  font-size: 16px;
  line-height: 24px;
  color: var(--accent);
  margin-bottom: 0;
}

.ca-report-card__actions {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.ca-report-card__pub {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  line-height: 20px;
  color: var(--txt-color);
  flex: 1;
}

.ca-report-card__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: var(--forest-green);
  flex-shrink: 0;
}

.ca-report-card__dl-btn {
  flex: 1;
  min-width: 110px;
  background-color: var(--white);
  border: 1px solid var(--forest-green);
  color: var(--primary);
  font-size: 16px;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 18px;
}

.ca-report-card__dl-btn:is(:hover, :active, :focus-visible) {
  background-color: var(--accent);
  border-color: var(--forest-green);
  color: var(--white);
}

/* Previous reports list */
.ca-reports-list {
  width: 100%;
  max-width: 768px;
}

.ca-reports-list__heading {
  font-family: var(--heading-font);
  font-size: 20px;
  font-weight: 700;
  line-height: 30px;
  color: var(--primary);
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border-light);
  margin-bottom: 0;
}

.ca-report-rows {
  list-style: none;
  padding: 0;
  margin: 0;
}

.ca-report-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 24px;
  border-bottom: 1px solid var(--border);
  background-color: var(--white);
}

.ca-report-row:last-child {
  border-bottom: none;
}

.ca-report-row__meta {
  display: flex;
  align-items: center;
  gap: 24px;
  flex: 1;
  min-width: 0;
}

.ca-report-row__year {
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: var(--dark);
  white-space: nowrap;
  flex-shrink: 0;
}

.ca-report-row__name {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: var(--txt-color);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ca-report-row__btn {
  background-color: var(--white);
  border: 1px solid var(--forest-green);
  color: var(--primary);
  font-size: 14px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  flex-shrink: 0;
  white-space: nowrap;
}

.ca-report-row__btn:is(:hover, :active, :focus-visible) {
  background-color: var(--accent);
  border-color: var(--forest-green);
  color: var(--white);
}


/* ---- News page ---- */

.ca-news-card {
  background-color: var(--white);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 30px;
  height: 100%;
  text-decoration: none;
  color: inherit;
  transition: box-shadow 0.2s ease, border-color 0.2s ease;

  i {
    transition: transform 0.2s ease;
  }
}

.ca-news-card:hover {
  border-color: var(--forest-green);
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.07);

  .ca-card-link {
    color: var(--accent);
    border-color: var(--accent);
  }

  i {
    transform: translateX(2px);
  }
}

.ca-news-card__img {
  width: 100%;
  height: 264px;
  border-radius: 10px;
  overflow: hidden;
  flex-shrink: 0;
}

.ca-news-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: opacity 0.2s ease;
}

.ca-news-card:hover .ca-news-card__img img {
  opacity: 0.88;
}

.ca-news-card__content {
  display: flex;
  flex-direction: column;
  gap: 20px;
  flex: 1;
}

.ca-news-card__meta {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ca-news-card__title-block {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ca-news-card__title {
  font-size: 24px;
  font-weight: 600;
  line-height: 30px;
  color: var(--primary);
  margin-bottom: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ca-news-card__date {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: var(--txt-color);
  margin-bottom: 0;
}

.ca-news-card__excerpt {
  font-size: 18px;
  line-height: 28px;
  color: var(--txt-color);
  margin-bottom: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ---- Shared card link (underline + arrow) ---- */
/* Used in: .ca-news-card, .ca-job-card, .ca-team-cta */
.ca-card-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: var(--primary);
  border-bottom: 1px solid var(--primary);
  padding-bottom: 2px;
  align-self: flex-start;
  margin-top: auto;
  transition: color 0.2s ease, border-color 0.2s ease;
}


/* ---- News detail page ---- */

/* Centered hero variant */
.ca-hero--centered {
  text-align: center;
}

/* Featured image */
.ca-news-detail__img {
  width: 100%;
  height: 240px;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 48px;
}

.ca-news-detail__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Share bar */
.ca-news-share {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px 24px;
  border-top: 1px solid var(--border-light);
  padding-top: 24px;
  margin-top: 48px;
}

.ca-news-share__label {
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
  color: var(--primary);
  margin-bottom: 0;
}

.ca-news-share__buttons {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
}

/* Override rich-text-section anchor colour on share buttons */
.ca-news-share .btn {
  color: var(--white);
  text-decoration: none;
  font-size: 16px;
  line-height: 24px;
  padding-left: 14px;
  padding-right: 14px;
}

.ca-news-share .btn:is(:hover, :focus-visible) {
  color: var(--primary);
}

.ca-news-share .btn:active {
  color: var(--primary);
}


/* ---- Contact page ---- */

/* Contact info cards */
.ca-contact-card {
  background-color: rgba(93, 133, 117, 0.10);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  height: 100%;
}

.ca-contact-card__body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
  justify-content: flex-end;
}

.ca-contact-card__label {
  font-size: 18px;
  font-weight: 600;
  line-height: 28px;
  color: #171717;
  margin-bottom: 0;
}

.ca-contact-card__desc {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: var(--txt-color);
  margin-bottom: 0;
}

.ca-contact-card__value {
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: var(--accent);
  margin-bottom: 0;
}

a.ca-contact-card__value {
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color 0.2s ease;
}

a.ca-contact-card__value:hover {
  color: var(--primary);
}

/* Phone card dl list */
.ca-contact-dl {
  margin: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2px 12px;
  align-items: baseline;
}

.ca-contact-dl dt {
  font-size: 14px;
  font-weight: 600;
  line-height: 24px;
  color: var(--txt-color);
  white-space: nowrap;
}

.ca-contact-dl dd {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
}

/* Social list (contact card) */
.ca-social-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ca-social-list__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: var(--accent);
  text-decoration: none;
  transition: color 0.2s ease;
}

.ca-social-list__link span {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.ca-social-list__link:hover {
  color: var(--primary);
}

.ca-social-list__link i {
  font-size: 18px;
  width: 20px;
  text-align: center;
  flex-shrink: 0;
}

/* Contact map */
.ca-map-wrap {
  width: 100%;
  border-radius: 16px;
  overflow: hidden;
  margin-top: 48px;
}

.ca-map-wrap iframe {
  width: 100%;
  height: 360px;
  border: 0;
  display: block;
}

/* Required asterisk */
.ca-required {
  color: var(--accent);
  font-style: normal;
  text-decoration: none;
}

/* Optional label modifier */
.ca-form-optional {
  font-weight: 400;
  color: var(--txt-color);
}

/* Labels */
.ca-form-label {
  display: block;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: var(--primary);
  margin-bottom: 6px;
}

/* Text inputs & textarea */
.ca-form-input,
.ca-form-textarea {
  display: block;
  width: 100%;
  padding: 10px 14px;
  font-family: var(--body-font);
  font-size: 16px;
  line-height: 24px;
  color: var(--dark);
  background-color: var(--white);
  border: 1px solid var(--border);
  border-radius: 8px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  appearance: none;
}

.ca-form-input:focus,
.ca-form-textarea:focus {
  outline: none;
  border-color: var(--forest-green);
  box-shadow: 0 0 0 3px rgba(93, 133, 117, 0.18);
}

.ca-form-input::placeholder,
.ca-form-textarea::placeholder {
  color: #a3a3a3;
}

.ca-form-textarea {
  height: 160px;
  resize: none;
}

/* Phone field with country prefix */
.ca-phone-wrap {
  display: flex;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.ca-phone-wrap:focus-within {
  border-color: var(--forest-green);
  box-shadow: 0 0 0 3px rgba(93, 133, 117, 0.18);
}

.ca-phone-prefix {
  padding: 10px 12px;
  background-color: var(--light-grey);
  border-right: 1px solid var(--border);
  font-size: 16px;
  line-height: 24px;
  color: var(--txt-color);
  white-space: nowrap;
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

.ca-phone-input {
  display: block;
  flex: 1;
  padding: 10px 14px;
  font-family: var(--body-font);
  font-size: 16px;
  line-height: 24px;
  color: var(--dark);
  background-color: var(--white);
  border: 0;
  min-width: 0;
  appearance: none;
}

.ca-phone-input:focus {
  outline: none;
}

.ca-phone-input::placeholder {
  color: #a3a3a3;
}

/* Legal authorization paragraph */
.ca-form-legal {
  font-size: 16px;
  line-height: 24px;
  color: var(--txt-color);
  margin-bottom: 0;
}

.ca-form-legal a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.ca-form-legal a:hover {
  color: var(--primary);
}

/* Checkbox row */
.ca-form-check {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.ca-form-check__input {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  margin-top: 3px;
  accent-color: var(--primary);
  cursor: pointer;
}

.ca-form-check__label {
  font-size: 16px;
  line-height: 24px;
  color: var(--txt-color);
  cursor: pointer;
}


/* ---- Careers & job description pages ---- */

/* Job card */
.ca-job-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  height: 100%;
  padding: 24px;
  background-color: var(--white);
  border: 1px solid var(--border-light);
  border-radius: 16px;
  text-decoration: none;
  color: inherit;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.ca-job-card:hover {
  border-color: var(--forest-green);
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.07);
}

.ca-job-card:hover .ca-card-link {
  color: var(--accent);
  border-color: var(--accent);
}

.ca-job-card:hover .ca-card-link i {
  transform: translateX(2px);
}

.ca-job-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ca-job-card__tag {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px;
  border-radius: 100px;
  font-size: 13px;
  font-weight: 600;
  line-height: 22px;
  background-color: var(--mist);
  color: var(--primary);
}

.ca-job-card__title {
  font-family: var(--heading-font);
  font-size: 20px;
  font-weight: 700;
  line-height: 28px;
  color: var(--primary);
  margin-bottom: 0;
}

.ca-job-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 20px;
  margin-bottom: 0;
}

.ca-job-card__meta-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  line-height: 20px;
  color: var(--txt-color);
}

.ca-job-card__meta-item i {
  font-size: 14px;
  color: var(--forest-green);
  flex-shrink: 0;
}

.ca-job-card__excerpt {
  font-size: 16px;
  line-height: 24px;
  color: var(--txt-color);
  margin-bottom: 0;
  flex: 1;
}

/* File upload field */
.ca-form-file {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 12px 14px;
  background-color: var(--light-grey);
  border: 1px dashed var(--border);
  border-radius: 8px;
  cursor: pointer;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.ca-form-file:hover {
  border-color: var(--forest-green);
  background-color: rgba(200, 221, 215, 0.25);
}

.ca-form-file:has(input:focus-visible) {
  border-color: var(--forest-green);
  background-color: rgba(200, 221, 215, 0.25);
  box-shadow: 0 0 0 3px rgba(93, 133, 117, 0.25);
}

.ca-form-file input[type="file"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
  width: 100%;
  height: 100%;
  font-size: 0;
}

.ca-form-file__icon {
  font-size: 20px;
  color: var(--primary);
  flex-shrink: 0;
}

.ca-form-file__text {
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.ca-form-file__cta {
  font-size: 16px;
  font-weight: 600;
  line-height: 22px;
  color: var(--primary);
}

.ca-form-file__hint {
  font-size: 13px;
  line-height: 18px;
  color: var(--txt-color);
}

/* Job description page — application form wrapper */
.ca-job-apply {
  border-top: 1px solid var(--border-light);
  padding-top: 48px;
  margin-top: 48px;
}

/* Job description page — job meta strip */
.ca-job-meta-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
  padding: 20px 24px;
  background-color: var(--light-grey);
  border-radius: 12px;
  margin-bottom: 40px;
}

.ca-job-meta-strip__item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  line-height: 22px;
  color: var(--txt-color);
}

.ca-job-meta-strip__item i {
  font-size: 16px;
  color: var(--forest-green);
  flex-shrink: 0;
}

.ca-job-meta-strip__item strong {
  color: var(--primary);
  font-weight: 600;
}


/* ---- 404 page ---- */
.ca-404 {
  flex: 1;
  display: flex;
  align-items: center;
  padding: 140px 0 80px;
}

.ca-404__number {
  display: block;
  font-family: var(--heading-font);
  font-size: 120px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -6px;
  color: var(--mist);
  margin-bottom: 32px;
  user-select: none;
}

.ca-404__heading {
  font-family: var(--heading-font);
  font-size: 32px;
  font-weight: 700;
  line-height: 40px;
  letter-spacing: -0.64px;
  color: var(--primary);
  margin-bottom: 16px;
}

.ca-404__body {
  font-size: 18px;
  line-height: 28px;
  color: var(--txt-color);
  margin-bottom: 0;
  max-width: 480px;
}

.ca-404__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 40px;
}

h1, h2, h3, h4, h5, h6, .ca-box__title, .ca-cta-banner__heading {
  text-wrap-style: balance;
}
/* ------------------------------------------------------------ */
/*  WS BASE TEMPLATE — responsive.css                          */
/*  Websolutions.ca                                            */
/*                                                             */
/*  Mobile-first: ALL rules use min-width only.                */
/*  Base styles (above 0px) live in styles.css.                */
/*                                                             */
/*  Breakpoints:                                               */
/*    425px  — phablet                                         */
/*    576px  — Bootstrap sm                                    */
/*    768px  — Bootstrap md / tablet                           */
/*    992px  — Bootstrap lg / laptop                           */
/*    1200px — Bootstrap xl                                    */
/*    1400px — Bootstrap xxl                                   */
/* ------------------------------------------------------------ */


/* ------- 425px ------- */
@media screen and (min-width: 425px) {
    .rich-text-img { height: 280px; }
    .navbar-brand img { height: 54px; }
}


/* ------- 576px ------- */
@media screen and (min-width: 576px) {
    .rich-text-img { height: 340px; }
    .ca-hero__image { height: 300px; }
}


/* ------- 576px (about image) ------- */
@media screen and (min-width: 576px) {
    .ca-about-img { height: 380px; }
}


/* ------- 768px ------- */
@media screen and (min-width: 768px) {

    /* 404 page */
    .ca-404__number { font-size: 200px; letter-spacing: -10px; }

    /* section padding */
    .section-p { padding-top: 96px; padding-bottom: 96px; }
    .single-p { padding-bottom: 96px; }

    /* section titles */
    .section-title h2 {
        font-size: 36px;
        line-height: 44px;
    }

    /* images */
    .rich-text-img { height: 420px; }
    .ca-about-img { height: 440px; }

    /* about headings */
    h2.ca-about-h2 { font-size: 36px; line-height: 44px; letter-spacing: -0.72px; }
    h3.ca-about-h3 { font-size: 30px; line-height: 38px; }

    /* cta banner */
    .ca-cta-banner {
        padding: 64px;
        flex-direction: row;
        align-items: flex-start;
        justify-content: space-between;
    }
    .ca-cta-banner__heading { font-size: 36px; line-height: 44px; letter-spacing: -0.72px; }
    .ca-cta-banner__body { font-size: 20px; line-height: 30px; }

    /* project — hero */
    .ca-hero { padding-top: 120px; padding-bottom: 80px; }
    .ca-hero__heading { font-size: 42px; line-height: 52px; letter-spacing: -0.84px; }
    .ca-hero__image { height: 380px; margin-top: 48px; }

    /* project — section headings */
    .ca-section-h2 { font-size: 36px; line-height: 46px; letter-spacing: -0.72px; }
    h2.ca-features-title,
    h2.ca-stats-heading,
    h2.ca-news-heading { font-size: 30px; line-height: 38px; }
    .ca-stat-number { font-size: 40px; line-height: 50px; }
    h2.ca-guide-section-h2 { font-size: 36px; line-height: 44px; letter-spacing: -0.72px; }
    h2.ca-links-group-h2   { font-size: 24px; line-height: 32px; }
    .ca-guide-section-desc { font-size: 20px; line-height: 30px; }

    /* project — footer */
    .footer-end {
        flex-direction: row;
        align-items: center;
        justify-content: center;
        text-align: center;
    }
    .footer-end * { font-size: 16px; }

    /* project — news detail */
    .ca-news-detail__img { height: 420px; }

    /* project — contact map */
    .ca-map-wrap iframe { height: 420px; }

    .ca-box{max-width: 336px;}
}


/* ------- 992px ------- */
@media screen and (min-width: 992px) {

    .ca-about-img { height: 480px; }

    /* max-width helpers that activate at laptop */
    .mw-lg-576 { max-width: 576px; }

    /* project — hero */
    .ca-hero { padding-top: 192px; padding-bottom: 96px; }
    .ca-hero__heading { font-size: 60px; line-height: 72px; letter-spacing: -1.2px; }
    .ca-hero__image { height: 516px; margin-top: 64px; }

    /* project — section headings */
    .ca-step-card { max-width: 400px; }
    .ca-section-h2 { font-size: 48px; line-height: 60px; letter-spacing: -0.96px; }
    h2.ca-features-title,
    h2.ca-stats-heading,
    h2.ca-news-heading { font-size: 36px; line-height: 44px; letter-spacing: -0.72px; }
    .ca-stat-number { font-size: 48px; line-height: 60px; letter-spacing: -0.96px; }

    .ca-box{max-width: 296px;}
}

@media screen and (min-width: 1200px) {
    .ca-box{max-width: 546px;}
}

@media screen and (min-width: 1400px) {
    .ca-box{max-width: 636px;}
}
