/**
 * Honey Universal - Central Color Theme & Design System
 * Single Source of Truth for Colors across Entire Website
 * Stack: Plain CSS with CSS Custom Properties (:root)
 */

:root {
  /* ==========================================================================
     CORE THEME PALETTE
     ========================================================================== */
  --sky: #00B8FF;          /* Bright Sky Blue - buttons, highlights, badges */
  --aqua: #00D4C0;         /* Aqua Teal - secondary accents, eyebrows, tags */
  --sky-tint: #DDF3FF;     /* Soft Sky Blue tint - alternating section backgrounds */
  --pale-sky: #E6F8FF;     /* Pale Sky tint - languages marquee, legal page background */
  --aqua-tint: #D3F8F1;    /* Mint / Aqua tint - services, cities, alternating backgrounds */
  --white: #FFFFFF;        /* Pure White - cards, canvas */
  --ink: #263238;          /* Charcoal Ink - headings, body text, readable on sky & aqua */
  --muted: #546E7A;        /* Muted Charcoal for secondary/placeholder text */        /* Secondary Muted text */
  --link: #00B8FF;         /* Electric Blue for links & highlights */         /* Accessible blue links & text on light backgrounds */
  --teal-text: #00806F;    /* Accessible teal text on light backgrounds */
  --charcoal: #263238;     /* Dark Charcoal - footer, dark sections */
  --border: rgba(0, 120, 170, 0.16);
  --shadow: 0 3px 10px rgba(0, 100, 150, 0.08);

  /* Gradients */
  --grad: linear-gradient(135deg, #00B8FF 0%, #00D4C0 100%);
  --grad-reverse: linear-gradient(135deg, #00D4C0 0%, #00B8FF 100%);
  --grad-hero: linear-gradient(180deg, #E6F8FF 0%, #C4EDFF 55%, #B6F5EA 100%);

  /* WhatsApp Brand Color */
  --wa-green: #25D366;

  /* ==========================================================================
     LEGACY THEME VARIABLE ALIASES (Single Source of Truth)
     Ensures existing stylesheets seamlessly inherit the new palette
     ========================================================================== */
  --brand-primary-blue: var(--sky);
  --brand-sky-blue: var(--aqua);
  --brand-light-blue: var(--sky-tint);
  --brand-white: var(--white);
  --brand-dark-navy: var(--ink);
  --brand-deep-sky-blue: var(--sky);
  --brand-pale-sky-blue: var(--sky-tint);
  --espresso: var(--sky);
  --taupe: var(--aqua);
  --warm-beige: var(--aqua-tint);
  --cream: var(--pale-sky);
  --dark-navy: var(--ink);
  --body-text: var(--ink);
  --light-border: var(--border);
  --dark-hover: #00A3E6;

  --primary: var(--sky);
  --primary-hover: #00A3E6;
  --primary-light: var(--aqua);
  --primary-subtle: var(--sky-tint);
  --primary-rgb: 0, 184, 255;

  --secondary: var(--aqua);
  --secondary-surface: #00BFAD;
  --secondary-muted: var(--aqua-tint);
  --secondary-rgb: 0, 212, 192;

  --accent: var(--aqua);
  --accent-light: var(--aqua-tint);
  --accent-subtle: var(--pale-sky);
  --whatsapp: var(--wa-green);

  --glass-bg: rgba(255, 255, 255, 0.92);
  --glass-bg-subtle: rgba(221, 243, 255, 0.7);
  --glass-border: rgba(255, 255, 255, 0.85);
  --glass-border-subtle: var(--border);
  --glass-shadow: var(--shadow);
  --glass-shadow-hover: 0 10px 25px rgba(0, 100, 150, 0.12);

  --bg-body: var(--white);
  --bg-card: var(--white);
  --bg-subtle: var(--pale-sky);
  --bg-tint: var(--sky-tint);
  --bg-gray: var(--sky-tint);
  --text-main: var(--ink);
  --text-body: var(--ink);
  --text-muted: var(--muted);
  --border-light: var(--border);
  --border-subtle: var(--border);

  /* Page-Specific Variable Aliases unified to Official Brand Palette */
  --bcts-charcoal: #263238;
  --etts-charcoal: #263238;
  --fin-charcoal: #263238;
  --gov-charcoal: #263238;
  --iso-charcoal: #263238;
  --mc-charcoal: #263238;

  --bcts-charcoal-light: #263238;
  --etts-charcoal-light: #263238;
  --fin-charcoal-light: #263238;
  --gov-charcoal-light: #263238;
  --mc-charcoal-light: #263238;
  --iso-slate: #263238;

  --bcts-bright-blue: #00B8FF;
  --etts-bright-blue: #00B8FF;
  --iso-blue: #00B8FF;
  --mc-sky-blue: #00B8FF;

  --bcts-turquoise: #00D4C0;
  --etts-turquoise: #00D4C0;
  --iso-turquoise: #00D4C0;
  --mc-turquoise: #00D4C0;

  --bcts-white: #FFFFFF;
  --etts-white: #FFFFFF;
  --fin-white: #FFFFFF;
  --gov-white: #FFFFFF;
  --iso-white: #FFFFFF;
  --mc-white: #FFFFFF;

}

/* ==========================================================================
   GLOBAL BASE & SELECTION & FOCUS-VISIBLE
   ========================================================================== */
::selection {
  background-color: var(--aqua) !important;
  color: var(--ink) !important;
}

::-moz-selection {
  background-color: var(--aqua) !important;
  color: var(--ink) !important;
}

:focus-visible {
  outline: 3px solid var(--sky) !important;
  outline-offset: 2px !important;
}

/* Body & Headings Typography Colors */
body {
  color: var(--ink);
  background-color: var(--white);
}

h1, h2, h3, h4, h5, h6 {
  color: var(--ink);
}

p, li, dl, dt, dd {
  color: inherit;
}

/* Links */
a {
  color: var(--link);
  transition: color 0.2s ease, text-decoration 0.2s ease;
}

a:hover {
  color: var(--ink);
  text-decoration: underline;
}

/* ==========================================================================
   BUTTONS (STEP 3 COMPONENT RULES)
   ========================================================================== */
/* Primary Buttons: background --sky, text --ink (charcoal, NOT white), hover #00A3E6 */
.btn-primary,
.hero-btn-primary,
.cta-btn-primary,
.btn-submit,
.quote-btn-submit,
.form-submit-btn,
.nav-contact-btn,
a.btn-primary,
button.btn-primary {
  background-color: var(--sky) !important;
  background-image: none !important;
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important;
  border: 1px solid var(--sky) !important;
  box-shadow: 0 4px 14px rgba(0, 184, 255, 0.25) !important;
  font-weight: 700;
  transition: all 0.25s ease !important;
}

.btn-primary:hover,
.hero-btn-primary:hover,
.cta-btn-primary:hover,
.btn-submit:hover,
.quote-btn-submit:hover,
.form-submit-btn:hover,
.nav-contact-btn:hover,
a.btn-primary:hover,
button.btn-primary:hover {
  background-color: #00A3E6 !important;
  border-color: #00A3E6 !important;
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(0, 163, 230, 0.35) !important;
}

/* Secondary Buttons: background --aqua, text --ink, hover #00BFAD */
.btn-secondary,
.hero-btn-secondary,
.cta-btn-secondary,
.btn-order,
a.btn-secondary,
button.btn-secondary {
  background-color: var(--aqua) !important;
  background-image: none !important;
  background-color: #00B4A0 !important;
  border-color: #00B4A0 !important;
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
  border: 1px solid var(--aqua) !important;
  box-shadow: 0 4px 14px rgba(0, 212, 192, 0.25) !important;
  font-weight: 700;
  transition: all 0.25s ease !important;
}

.btn-secondary:hover,
.hero-btn-secondary:hover,
.cta-btn-secondary:hover,
.btn-order:hover,
a.btn-secondary:hover,
button.btn-secondary:hover {
  background-color: #00BFAD !important;
  border-color: #00BFAD !important;
  background-color: #00B4A0 !important;
  border-color: #00B4A0 !important;
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(0, 191, 173, 0.35) !important;
}

/* Dark Buttons: background --ink, text white, hover --charcoal */
.btn-dark,
.btn-black,
.btn-explore,
.btn-stories,
a.btn-dark,
button.btn-dark {
  background-color: var(--ink) !important;
  color: var(--white) !important;
  border: 1px solid var(--ink) !important;
  box-shadow: 0 4px 14px rgba(31, 42, 55, 0.2) !important;
  font-weight: 700;
  transition: all 0.25s ease !important;
}

.btn-dark:hover,
.btn-black:hover,
.btn-explore:hover,
.btn-stories:hover,
a.btn-dark:hover,
button.btn-dark:hover {
  background-color: var(--charcoal) !important;
  border-color: var(--charcoal) !important;
  color: var(--white) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(38, 50, 56, 0.3) !important;
}

/* Outline Buttons: transparent, 1.5px border --sky, text --link, hover background --sky-tint */
.btn-outline,
.btn-ghost,
a.btn-outline,
button.btn-outline {
  background-color: transparent !important;
  color: var(--link) !important;
  border: 1.5px solid var(--sky) !important;
  font-weight: 700;
  transition: all 0.25s ease !important;
}

.btn-outline:hover,
.btn-ghost:hover,
a.btn-outline:hover,
button.btn-outline:hover {
  background-color: var(--sky-tint) !important;
  color: var(--link) !important;
  border-color: var(--sky) !important;
  transform: translateY(-2px) !important;
}

/* WhatsApp Buttons: keep existing WhatsApp green */
.btn-whatsapp,
.btn-floating-whatsapp,
a.btn-whatsapp {
  background-color: var(--wa-green) !important;
  color: var(--white) !important;
  border: 1px solid var(--wa-green) !important;
}

.btn-whatsapp:hover,
.btn-floating-whatsapp:hover,
a.btn-whatsapp:hover {
  background-color: #20BD5A !important;
  border-color: #20BD5A !important;
  color: var(--white) !important;
  transform: translateY(-2px) !important;
}

/* ==========================================================================
   EYEBROW TAGS & LABELS
   Background: --aqua, text: --ink
   ========================================================================== */
.banner-subheading,
.banner-about-badge,
.services-ui-badge,
.expertise-badge,
.quote-eyebrow,
.faq-badge,
.section-subtitle,
.badge-pill,
.policy-pill,
.privacy-pill,
.terms-pill,
.blog-category-badge,
.pricing-badge,
.services-category-heading,
.eyebrow-tag {
  background-color: #D3F8F1 !important;
  background-image: none !important;
  color: var(--ink) !important;
  border: 1px solid rgba(0, 120, 170, 0.2) !important;
  font-weight: 700 !important;
}

.banner-subheading *,
.banner-about-badge *,
.services-ui-badge *,
.quote-eyebrow * {
  color: var(--ink) !important;
}

/* ==========================================================================
   CARDS (STEP 3 COMPONENT RULES)
   Cards: background --white, border --border, shadow --shadow.
   Cards stay white on EVERY colored background.
   Card hover: lift and a --sky border.
   ========================================================================== */
.services-ui-card,
.expertise-card,
.work-process-card,
.process-card,
.wok-flow-card,
.lang-badge-card,
.doc-card,
.docs-card,
.quote-card,
.quote-wrapper,
.quote-form-card,
.quote-calculator-card,
.blog-card,
.team-card,
.pricing-card,
.policy-card,
.policy-section-card,
.privacy-content-card,
.terms-content-card,
.academic-card,
.bcts-card,
.etts-card,
.fin-card,
.gov-card,
.iso-card,
.mc-card,
.service-feature-card,
.global-card {
  background-color: var(--white) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow) !important;
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease !important;
}

.services-ui-card:hover,
.expertise-card:hover,
.work-process-card:hover,
.process-card:hover,
.wok-flow-card:hover,
.doc-card:hover,
.docs-card:hover,
.blog-card:hover,
.team-card:hover,
.pricing-card:hover,
.academic-card:hover,
.bcts-card:hover,
.etts-card:hover,
.fin-card:hover,
.gov-card:hover,
.iso-card:hover,
.mc-card:hover {
  transform: translateY(-4px) !important;
  border-color: var(--sky) !important;
  box-shadow: 0 10px 24px rgba(0, 100, 150, 0.12) !important;
}

/* ==========================================================================
   ICON CIRCLES, STEP NUMBERS & LISTS
   Background: --grad, number text: --ink.
   Large colored numbers on white backgrounds use --link (never plain sky/aqua).
   ========================================================================== */
.step-number,
.step-number-tag,
.process-number,
.wok-flow-number,
.icon-circle,
.feature-icon-circle,
.badge-circle,
.services-ui-icon-wrap,
.banner-about-list-img {
  background: var(--grad) !important;
  color: var(--ink) !important;
}

.step-number *,
.wok-flow-number *,
.services-ui-icon-wrap * {
  color: var(--ink) !important;
}

.stat-number,
.counter-number,
.big-number-accent {
  color: var(--link) !important;
}

/* Checkmarks and bullets */
.check-icon,
.check-circle,
.fa-circle-check {
  color: var(--teal-text) !important;
}

.check-pill-icon {
  background-color: var(--aqua) !important;
  color: var(--ink) !important;
}

/* ==========================================================================
   FORM FIELDS & ACCORDIONS & TABLES & CALLOUTS
   ========================================================================== */
/* Form fields: background white, border #CBE3F0, focus border & ring --sky */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="date"],
input[type="file"],
select,
textarea {
  background-color: var(--white) !important;
  border: 1px solid #CBE3F0 !important;
  color: var(--ink) !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--sky) !important;
  box-shadow: 0 0 0 3px rgba(0, 184, 255, 0.25) !important;
  outline: none !important;
}

input.is-invalid,
select.is-invalid,
textarea.is-invalid,
.has-error input {
  border-color: #EF4444 !important;
}

/* Form success modal */
.modal-card {
  background-color: var(--white) !important;
  border: 1px solid var(--border) !important;
  box-shadow: 0 20px 45px rgba(0, 100, 150, 0.2) !important;
}

.modal-icon-success {
  background: var(--grad) !important;
  color: var(--ink) !important;
}

/* Tables: header row --sky-tint with --ink text, rows white, borders --border */
table {
  border-collapse: collapse;
  width: 100%;
}

table th,
thead th,
.table-header {
  background-color: var(--sky-tint) !important;
  color: var(--ink) !important;
  border: 1px solid var(--border) !important;
}

table td,
tbody td {
  background-color: var(--white) !important;
  color: var(--ink) !important;
  border: 1px solid var(--border) !important;
}

/* Callout boxes: background --aqua-tint, left border --aqua */
.callout-box,
.notice-box,
.chat-notice-box,
.info-callout {
  background-color: var(--aqua-tint) !important;
  border-left: 4px solid var(--aqua) !important;
  color: var(--ink) !important;
}

/* Accordions (FAQ): closed items white with --border, open item border 2px --sky */
.faq-accordion-item,
.accordion-item {
  background-color: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px;
  margin-bottom: 12px;
  overflow: hidden;
  transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
}

.faq-accordion-item.is-active,
.faq-accordion-item.open,
.accordion-item.is-open {
  border: 2px solid var(--sky) !important;
  box-shadow: var(--shadow) !important;
}

.faq-question-btn,
.accordion-trigger {
  color: var(--ink) !important;
  background-color: var(--white) !important;
  font-weight: 700;
}

.faq-answer-pane,
.accordion-content {
  color: var(--ink) !important;
  background-color: var(--white) !important;
}

/* ==========================================================================
   HEADER & TOPBAR (STEP 3 & STEP 4)
   ========================================================================== */
/* Top bar: --grad with --ink text */
.flase-back,
#flash {
  background: var(--grad) !important;
  color: var(--ink) !important;
  border-bottom: 1px solid var(--border) !important;
}

.flase-back *,
#flash *,
.flase-offer-text,
.flase-phone-link,
.flase-limited-text,
.flase-badge-flash,
.flase-timer-label {
  color: var(--ink) !important;
}

.flase-timer-box {
  background-color: rgba(255, 255, 255, 0.7) !important;
  color: var(--ink) !important;
  border: 1px solid var(--border) !important;
}

.flase-badge-flash {
  background-color: var(--white) !important;
  color: var(--ink) !important;
}

.flase-close-btn {
  color: var(--ink) !important;
}

/* Header: white floating bar (logo stays white so it is unchanged), menu text --ink, menu hover/active --link */
.site-header {
  background-color: var(--white) !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: var(--shadow) !important;
}

.site-header .nav-link {
  color: var(--ink) !important;
}

.site-header .nav-link:hover,
.site-header .nav-link.active {
  color: #00B8FF !important;
}

.dropdown-menu,
.dropdown-menu-about,
.dropdown-menu-services {
  background-color: var(--white) !important;
  border: 1px solid var(--border) !important;
  box-shadow: 0 10px 30px rgba(0, 100, 150, 0.12) !important;
}

.dropdown-link:hover,
.dropdown-card-item:hover {
  background-color: var(--sky-tint) !important;
}

.dropdown-link:hover .dropdown-title,
.dropdown-card-item:hover .dropdown-card-title {
  color: #00B8FF !important;
}

/* Header Contact Button */
.nav-contact-btn {
  background-color: var(--sky) !important;
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.2) !important;
  border: 1px solid var(--sky) !important;
}

.nav-contact-btn:hover {
  background-color: #00A3E6 !important;
  color: #FFFFFF !important;
}

/* Mobile drawer */
.mobile-nav-drawer {
  background-color: var(--white) !important;
  color: var(--ink) !important;
}

.mobile-nav-link {
  color: var(--ink) !important;
}

.mobile-nav-link:hover,
.mobile-nav-link.active {
  color: #00B8FF !important;
}

/* ==========================================================================
   FLOATING ACTION BUTTONS (BOTTOM-RIGHT STACK)
   WhatsApp: keeps its green
   Call & Chatbot: --sky with --ink icon
   Back to top: --charcoal with white icon
   ========================================================================== */
.btn-floating-whatsapp {
  background-color: var(--wa-green) !important;
  color: var(--white) !important;
}

.btn-call-247 {
  background-color: var(--sky) !important;
  color: #FFFFFF !important;
}

.btn-call-247 i,
.btn-call-247 svg {
  color: #FFFFFF !important;
}

.btn-ai-chat {
  background-color: var(--sky) !important;
  color: #FFFFFF !important;
}

.btn-ai-chat i,
.btn-ai-chat svg {
  color: #FFFFFF !important;
}

.back-to-top {
  background-color: var(--charcoal) !important;
  color: var(--white) !important;
}

.back-to-top i,
.back-to-top svg {
  color: var(--white) !important;
}

/* ==========================================================================
   HOMEPAGE SECTION BACKGROUND SEQUENCE (STEP 4)
   Top to bottom:
   1. Top bar: --grad
   2. Hero: --grad-hero
   3. About: --sky-tint
   4. Working Process: --sky with white cards
   5. Services: --aqua-tint
   6. Professional Translation: --white
   7. 5000+ Success Stories band: --grad
   8. Our Industries: --aqua with white pill tiles
   9. Popular Languages: --pale-sky
   10. Popular Documents: --white
   11. Request a Free Quote: --grad-reverse with white form card
   12. FAQ: --aqua-tint
   13. Our Testimonials: --sky-tint
   14. Footer: --charcoal
   ========================================================================== */
/* 2. Hero: --grad-hero */
.banner-section,
.banner-bg {
  background: var(--grad-hero) !important;
}

.banner-section::before {
  background: linear-gradient(
    90deg,
    rgba(230, 248, 255, 0.95) 0%,
    rgba(196, 237, 255, 0.85) 50%,
    rgba(182, 245, 234, 0.3) 80%,
    transparent 100%
  ) !important;
}

.banner-heading,
.banner-desc {
  color: var(--ink) !important;
}

/* 3. About: --sky-tint */
.banner-about-sec,
#about {
  background-color: var(--sky-tint) !important;
  background-image: none !important;
}

/* 4. Working Process: --sky (bright sky blue) with white cards */
.wok-flow-bg,
#working-process {
  background: var(--sky) !important;
  border-top: 1px solid var(--border) !important;
  border-bottom: 1px solid var(--border) !important;
}

.wok-flow-bg .wok-flow-title,
.wok-flow-bg .wok-flow-desc,
.wok-flow-bg h2,
.wok-flow-bg p {
  color: #FFFFFF !important;
}

.wok-flow-card {
  background-color: var(--white) !important;
  border: 1px solid var(--border) !important;
}

.wok-flow-card h3,
.wok-flow-card p {
  color: var(--ink) !important;
}

/* 5. Services: --aqua-tint */
.services-ui-section,
.our-expertise-section,
.localization-details-bg,
#services {
  background-color: var(--aqua-tint) !important;
  background-image: none !important;
}

/* 6. Professional Translation: --white */
.section-global-translation,
.global-bg,
#translation-overview {
  background: var(--white) !important;
  border-top: 1px solid var(--border) !important;
  border-bottom: 1px solid var(--border) !important;
}

/* 7. 5000+ Success Stories band: --grad */
.success-story-bg,
#success-stories {
  background: var(--grad) !important;
  border-top: 1px solid var(--border) !important;
  border-bottom: 1px solid var(--border) !important;
}

.success-story-bg *,
.success-story-bg h2,
.success-story-bg h3,
.success-story-bg p,
.success-story-bg .stat-title,
.success-story-bg .stat-desc {
  color: var(--ink) !important;
}

/* 8. Our Industries: --aqua with white pill tiles */
.section-industries,
#industries {
  background-color: var(--aqua) !important;
  border-top: 1px solid var(--border) !important;
  border-bottom: 1px solid var(--border) !important;
}

.section-industries .industries-title,
.section-industries .industries-desc {
  color: var(--ink) !important;
}

/* White pill tiles */
.industry-btn,
.section-industries .industry-btn {
  background-color: var(--white) !important;
  color: var(--ink) !important;
  border: 1px solid var(--border) !important;
  box-shadow: 0 2px 8px rgba(0, 100, 150, 0.08) !important;
  font-weight: 600;
  transition: all 0.25s ease !important;
}

.industry-btn:hover,
.section-industries .industry-btn:hover {
  background-color: var(--white) !important;
  color: var(--link) !important;
  border-color: var(--sky) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 16px rgba(0, 184, 255, 0.2) !important;
}

/* 9. Popular Languages: --pale-sky */
.lang-section,
#languages {
  background-color: var(--pale-sky) !important;
  border-top: 1px solid var(--border) !important;
  border-bottom: 1px solid var(--border) !important;
}

.lang-badge {
  color: #FFFFFF !important;
  font-weight: 700 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7) !important;
}

.lang-badge:hover {
  box-shadow: 0 6px 18px var(--border) !important;
}

/* 10. Popular Documents: --white */
.docs-section,
#popular-documents {
  background-color: var(--white) !important;
  border-top: 1px solid var(--border) !important;
  border-bottom: 1px solid var(--border) !important;
}

/* 11. Request a Free Quote: --grad-reverse with white form card */
.quote-section,
#request-a-free-quote {
  background: var(--grad-reverse) !important;
  color: var(--ink) !important;
}

.quote-section .quote-heading,
.quote-section .quote-lead,
.quote-section .quote-benefit-title,
.quote-section .quote-benefit-desc,
.quote-section .quote-trust-text {
  color: var(--ink) !important;
}

.quote-card,
.quote-wrapper,
.quote-form-card {
  background-color: var(--white) !important;
  color: var(--ink) !important;
  border: 1px solid var(--border) !important;
  box-shadow: 0 10px 30px rgba(0, 100, 150, 0.15) !important;
}

.quote-card *,
.quote-wrapper * {
  color: var(--ink);
}

.quote-card a,
.quote-wrapper a {
  color: var(--link) !important;
}

/* 12. FAQ: --aqua-tint */
.faq-section,
#faqs {
  background-color: var(--aqua-tint) !important;
  border-top: 1px solid var(--border) !important;
  border-bottom: 1px solid var(--border) !important;
}

/* 13. Our Testimonials: Crisp White matching approved design */
.testimonials-section,
#testimonials {
  background-color: #FFFFFF !important;
  border-top: 1px solid rgba(0, 184, 255, 0.12) !important;
  border-bottom: 1px solid rgba(0, 184, 255, 0.12) !important;
}

/* Testimonials Card Design Matching Reference */
.testimonial-card {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.testimonial-bubble {
  background: #FFFFFF !important;
  border: 1.5px solid rgba(0, 184, 255, 0.18) !important;
  border-radius: 20px !important;
  padding: 32px 28px 28px 28px !important;
  box-shadow: 0 10px 30px rgba(0, 184, 255, 0.08), 0 2px 6px rgba(0, 0, 0, 0.03) !important;
  position: relative !important;
}

.testimonial-bubble:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(0, 184, 255, 0.45) !important;
  box-shadow: 0 16px 36px rgba(0, 184, 255, 0.14) !important;
}

.testimonial-bubble-tail {
  position: absolute !important;
  bottom: -10px !important;
  left: 54px !important;
  width: 18px !important;
  height: 18px !important;
  background: #E0F2FE !important;
  border: 1.5px solid rgba(0, 184, 255, 0.28) !important;
  transform: rotate(45deg) !important;
  border-radius: 2px !important;
  box-shadow: 2px 2px 4px rgba(0, 184, 255, 0.06) !important;
  z-index: 2 !important;
}

.testimonial-stars,
.testimonial-stars i {
  color: #F59E0B !important;
  font-size: 16px !important;
  letter-spacing: 2px !important;
}

.testimonial-quote-icon,
.testimonial-quote-icon i {
  color: #00B8FF !important;
  font-size: 24px !important;
}

.testimonial-text,
.testimonial-card p.testimonial-text {
  font-size: 14.5px !important;
  line-height: 1.68 !important;
  color: #334155 !important;
  font-weight: 400 !important;
  margin: 0 !important;
}

.testimonial-client-row {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  margin-top: 24px !important;
  padding-left: 6px !important;
}

.testimonial-logo-box {
  background-color: #FFFFFF !important;
  border: 1.5px solid #BAE6FD !important;
  border-radius: 12px !important;
  width: 96px !important;
  height: 52px !important;
  box-shadow: 0 3px 10px rgba(0, 184, 255, 0.08) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 5px 10px !important;
  flex-shrink: 0 !important;
  overflow: hidden !important;
}

.testimonial-logo-img {
  max-width: 100% !important;
  max-height: 100% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
}

.testimonial-client-name,
.testimonial-card h3.testimonial-client-name {
  font-family: var(--font-heading, 'Playfair Display', serif) !important;
  font-size: 15.5px !important;
  font-weight: 700 !important;
  color: #0284C7 !important;
  margin: 0 0 3px 0 !important;
  line-height: 1.3 !important;
}

.testimonial-client-tag {
  font-family: var(--font-sans, 'Inter', 'Lato', sans-serif) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: #64748B !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
}

.testimonial-nav-btn {
  background-color: #FFFFFF !important;
  border: 1.5px solid #BAE6FD !important;
  color: #0284C7 !important;
  box-shadow: 0 4px 14px rgba(0, 184, 255, 0.12) !important;
}

.testimonial-nav-btn:hover:not(:disabled) {
  background-color: #00B8FF !important;
  color: #FFFFFF !important;
  border-color: #00B8FF !important;
  box-shadow: 0 6px 18px rgba(0, 184, 255, 0.25) !important;
}

.testimonial-dot {
  background-color: #BAE6FD !important;
}

.testimonial-dot.is-active {
  background-color: #0284C7 !important;
  width: 26px !important;
  border-radius: 4px !important;
}

/* 14. Footer: --charcoal with text #E6EDF5 / #B4C4D0, headings white, links --aqua on hover, cities strip #1C262B */
.footer-main,
#site-footer,
footer {
  background-color: var(--charcoal) !important;
  color: #FFFFFF !important;
}

.footer-heading {
  color: #FFFFFF !important;
}

.footer-accent-line {
  background-color: var(--aqua) !important;
}

.footer-company-desc,
.footer-contact-item,
.footer-office-address,
.footer-branch-address,
.footer-branch-card .footer-branch-address,
.footer-branch-card p,
.footer-city-link,
.footer-copyright-text,
footer p,
footer li,
footer span {
  color: #FFFFFF !important;
}

.footer-link,
.footer-contact-link,
footer a {
  color: #FFFFFF !important;
}

.footer-link:hover,
.footer-contact-link:hover,
.footer-city-link:hover,
.footer-copyright-link:hover,
footer a:hover {
  color: #00B8FF !important;
}

.footer-link-icon,
.footer-contact-icon,
.footer-branch-icon,
.footer-view-more {
  color: var(--aqua) !important;
}

.footer-social-btn {
  background-color: #37474F !important;
  color: #FFFFFF !important;
}

.footer-social-btn:hover {
  background-color: #00B8FF !important;
  color: #FFFFFF !important;
}

/* Cities & Branches bottom block */
.footer-bottom-block {
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.footer-copyright-bar {
  background-color: #141C20 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* ==========================================================================
   ALL OTHER PAGES SECTION RULES
   - First section (intro/hero): --grad-hero
   - Following sections alternate --white, --sky-tint and --aqua-tint
   - Available Languages marquee: --pale-sky
   - Our Testimonials: --sky-tint
   - Closing/CTA sections: --grad
   - Cities section: --aqua-tint
   - Legal pages content cards: white on --pale-sky background
   - Footer: --charcoal
   ========================================================================== */
/* First Section (Intro / Hero / Banner) */
.acad-hero-section,
.bcts-hero-section,
.blog-hero-section,
.bts-hero-section,
.cc-hero-section,
.etts-hero-section,
.fin-hero-section,
.gov-hero-section,
.ceo-hero-section,
.iso-hero-section,
.lt-hero-section,
.lts-hero-section,
.mc-hero,
.mc-hero-section,
.med-hero-section,
.mts-hero-section,
.edu-hero-section,
.privacy-banner-section,
.policy-hero-section,
.sa-hero-section,
.page-banner,
.about-banner,
.team-hero-section,
.terms-banner-section,
.translation-banner-section,
.va-hero-section,
.wts-hero-section,
.page-banner-section {
  background: var(--grad-hero) !important;
}

.acad-hero-section *,
.bcts-hero-section h1,
.bcts-hero-section p,
.blog-hero-section *,
.bts-hero-section *,
.cc-hero-section *,
.etts-hero-section h1,
.etts-hero-section p,
.fin-hero-section *,
.gov-hero-section *,
.iso-hero-section *,
.mc-hero *,
.page-banner *,
.about-banner *,
.team-hero-section *,
.translation-banner-section * {
  color: var(--ink);
}

/* Available Languages Marquee: --pale-sky */
.translation-marquee-section,
.marqu-box {
  background-color: var(--pale-sky) !important;
  border-top: 1px solid var(--border) !important;
  border-bottom: 1px solid var(--border) !important;
}

.marq-item {
  background-color: var(--white) !important;
  color: var(--ink) !important;
  border: 1px solid var(--border) !important;
}

/* Closing / CTA sections: --grad */
.translation-cta-section,
.page-cta-section,
.cta-section,
.contact-cta-section,
.bcts-cta-banner-section,
.etts-cta-banner-section,
.mc-cta-mid-banner {
  background: var(--grad) !important;
}

.translation-cta-section *:not(a):not(button):not([class*="btn"]):not([class*="btn"] *),
.page-cta-section *:not(a):not(button):not([class*="btn"]):not([class*="btn"] *),
.cta-section *:not(a):not(button):not([class*="btn"]):not([class*="btn"] *),
.contact-cta-section *:not(a):not(button):not([class*="btn"]):not([class*="btn"] *) {
  color: var(--ink) !important;
}

/* Cities section: --aqua-tint */
.translation-cities-section {
  background-color: var(--aqua-tint) !important;
  border-top: 1px solid var(--border) !important;
  border-bottom: 1px solid var(--border) !important;
}

.city-item {
  background-color: var(--white) !important;
  color: var(--ink) !important;
  border: 1px solid var(--border) !important;
}

.city-item:hover {
  border-color: var(--sky) !important;
  color: var(--link) !important;
}

/* Legal pages (Privacy, Terms, Refund Policy):
   Content card stays white on a --pale-sky page background */
.privacy-layout-section,
.terms-layout-section,
.policy-page-main {
  background-color: var(--pale-sky) !important;
}

.privacy-content-card,
.terms-content-card,
.policy-container .policy-card,
.policy-container .policy-section-card {
  background-color: var(--white) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow) !important;
}

.privacy-sidebar-aside,
.terms-sidebar-aside {
  background-color: transparent !important;
}

.privacy-toc-nav,
.terms-toc-nav {
  background-color: var(--white) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow) !important;
}

/* Alternating inner page sections */
.section-alt-white {
  background-color: var(--white) !important;
}

.section-alt-sky {
  background-color: var(--sky-tint) !important;
}

.section-alt-aqua {
  background-color: var(--aqua-tint) !important;
}

/* ==========================================================================
   STRICT CONTRAST & ACCESSIBILITY OVERRIDES
   Rule: Never put white text on --sky or --aqua backgrounds.
   All text, icons, and badges on --sky, --aqua, or --grad must use --ink.
   ========================================================================== */
.tep-box,
.tep-box *,
.tep-header h3,
.tep-step-badge,
.faq-item:hover .faq-icon-badge,
.faq-item.is-open .faq-icon-badge,
.banner-about-list-cont:hover .banner-about-list-img,
.expertise-btn,
.services-ui-btn,
.services-ui-nav-btn:hover,
.btn-global-order,
.btn-global-order *,
.ceo-cta-btn,
.services-bg-blue,
.services-bg-blue *,
.services-h2-white,
.services-intro-text-white,
.services-cta-item,
.services-cta-item *,
.policy-highlight-box,
.policy-highlight-box *,
.policy-num-badge {
  color: var(--ink) !important;
}

.policy-highlight-box {
  background-color: var(--aqua-tint) !important;
  border-left: 4px solid var(--aqua) !important;
}

.policy-num-badge {
  background: var(--grad) !important;
  color: var(--ink) !important;
}

.services-bg-blue {
  background: var(--grad) !important;
  color: var(--ink) !important;
}

.services-cta-check {
  background-color: var(--aqua) !important;
  color: var(--ink) !important;
}

.industry-btn.is-active {
  background-color: var(--white) !important;
  color: var(--ink) !important;
  border-color: var(--sky) !important;
}

/* Hero Image Badge Overlays High Contrast */
[class*="-badge-overlay"] {
  background: rgba(38, 50, 56, 0.92) !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

[class*="-badge-overlay"] strong,
[class*="-badge-overlay"] h4,
[class*="-badge-overlay"] .overlay-title {
  color: #FFFFFF !important;
}

[class*="-badge-overlay"] span,
[class*="-badge-overlay"] p {
  color: #E6EDF5 !important;
}


/* ==========================================================================
   HONEY UNIVERSAL - OFFICIAL BRAND FONT COLOR SYSTEM
   Strict adherence to approved palette:
   - Electric Blue:  #00B8FF
   - Turquoise:      #00D4C0
   - Light Sky Blue: #DDF3FF
   - Mint Green:     #D3F8F1
   - Pale Blue:      #E6F8FF
   - Dark Charcoal:  #263238
   - Pure White:     #FFFFFF
   ========================================================================== */

/* 1. Global Typography Defaults (Dark Charcoal #263238 on light backgrounds) */
body {
  color: #263238 !important;
}

h1, h2, h3, h4, h5, h6 {
  color: #263238 !important;
}

p, li, dl, dt, dd {
  color: #263238 !important;
}

/* 2. Main Headings (H1) */
h1,
.banner-heading,
.hero-title,
.page-title,
.acad-hero-title,
.bcts-hero-title,
.bts-hero-title,
.cc-hero-title,
.etts-hero-title,
.fin-hero-title,
.gov-hero-title,
.iso-hero-title,
.lts-hero-title,
.mc-hero-title,
.med-hero-title,
.mts-hero-title,
.page-banner-title {
  color: #263238 !important;
}

/* Highlighted words inside H1 */
h1 span,
h1 strong,
h1 .highlight,
h1 .text-sky,
.banner-heading span,
.hero-title span,
.page-title span,
.acad-hero-title span,
.bcts-hero-title span,
.bts-hero-title span,
.cc-hero-title span,
.etts-hero-title span,
.fin-hero-title span,
.gov-hero-title span,
.iso-hero-title span,
.lts-hero-title span,
.mc-hero-title span,
.med-hero-title span,
.mts-hero-title span {
  color: #00B8FF !important;
}

/* 3. Section Headings (H2 / H3) */
h2, h3,
.section-title,
.section-heading,
.services-ui-heading,
.expertise-heading,
.quote-heading,
.faq-title,
.testimonials-title,
.policy-heading,
.team-section-title,
.acad-section-title,
.bcts-section-title,
.bts-section-title,
.cc-section-title,
.etts-section-title,
.fin-section-title,
.gov-section-title,
.iso-section-title,
.lts-section-title,
.mc-section-title,
.med-section-title,
.mts-section-title {
  color: #263238 !important;
}

h2 span,
h2 strong,
h2 .highlight,
h2 .text-sky,
h3 span,
h3 strong,
h3 .highlight,
h3 .text-sky,
.section-title span,
.section-heading span,
.services-ui-heading span,
.quote-heading span {
  color: #00B8FF !important;
}

/* 4. Body Paragraphs */
p,
.lead,
.section-lead,
.section-desc,
.banner-desc,
.quote-lead,
.acad-section-desc,
.bcts-section-desc,
.bts-section-desc,
.cc-section-desc,
.etts-section-desc,
.fin-section-desc,
.gov-section-desc,
.iso-section-desc,
.lts-section-desc,
.mc-section-desc,
.med-section-desc,
.mts-section-desc {
  color: #263238 !important;
}

/* 5. Highlighted Words & Statistics Numbers */
.highlight,
.text-highlight,
.text-sky,
.brand-accent,
.word-highlight,
.stat-number,
.counter-number,
.big-number-accent {
  color: #00B8FF !important;
}

/* 6. Important Keywords (Turquoise #00D4C0 with high contrast) */
.keyword-turquoise,
.text-aqua,
.badge-turquoise {
  color: #00D4C0 !important;
}

/* 7. Card Headings & Descriptions across all 52 pages */
.services-ui-card h3,
.services-ui-card h4,
.expertise-card h3,
.wok-flow-card h3,
.process-card h3,
.testimonial-card h3,
.testimonial-card h4,
.doc-card h3,
.blog-card h3,
.team-card h3,
.pricing-card h3,
.pricing-card-title,
.policy-card h3,
.acad-card h3,
.bcts-card h3,
.bts-card h3,
.cc-card h3,
.etts-card h3,
.fin-card h3,
.gov-card h3,
.iso-card h3,
.mc-card h3,
.med-card h3,
.lts-card h3,
.mts-card h3,
.card-title,
.service-feature-card h3,
[class*="-card"]:not(.footer-branch-card) h3,
[class*="-card"]:not(.footer-branch-card) h4 {
  color: #263238 !important;
}

.services-ui-card p,
.expertise-card p,
.wok-flow-card p,
.process-card p,
.testimonial-card p,
.testimonial-quote,
.doc-card p,
.blog-card p,
.team-card p,
.pricing-card p,
.pricing-card-desc,
.policy-card p,
.acad-card p,
.bcts-card p,
.bts-card p,
.cc-card p,
.etts-card p,
.fin-card p,
.gov-card p,
.iso-card p,
.mc-card p,
.med-card p,
.lts-card p,
.mts-card p,
.card-desc,
.card-text,
.service-feature-card p,
[class*="-card"]:not(.footer-branch-card) p {
  color: #263238 !important;
}

.services-ui-card a,
.expertise-card a,
.doc-card a,
.blog-card a,
.card-link,
[class*="-card"] a:not([class*="btn"]) {
  color: #00B8FF !important;
}

.services-ui-card a:hover,
.expertise-card a:hover,
.doc-card a:hover,
.blog-card a:hover,
.card-link:hover,
[class*="-card"] a:not([class*="btn"]):hover {
  color: #0088CC !important;
}

/* 8. Navigation Links & Header */
.site-header .nav-link,
.site-header .nav-menu a,
.nav-item a,
.dropdown-link,
.dropdown-item,
.dropdown-title,
.dropdown-card-title,
.mobile-nav-link {
  color: #263238 !important;
}

.site-header .nav-link:hover,
.site-header .nav-link.active,
.dropdown-link:hover,
.dropdown-link:hover .dropdown-title,
.dropdown-card-item:hover .dropdown-card-title,
.mobile-nav-link:hover,
.mobile-nav-link.active {
  color: #00B8FF !important;
}

.dropdown-desc,
.dropdown-card-desc {
  color: #546E7A !important;
}

/* 9. Buttons (White text on Electric Blue or Dark Turquoise) */
.btn-primary,
.hero-btn-primary,
.cta-btn-primary,
.btn-submit,
.quote-btn-submit,
.form-submit-btn,
.nav-contact-btn,
.btn-global-order,
.ceo-cta-btn,
.expertise-btn,
.services-ui-btn,
.btn-order,
button[type="submit"],
a.btn-primary,
button.btn-primary,
.acad-btn-primary,
.bcts-btn-primary,
.bts-btn-primary,
.cc-btn-primary,
.etts-btn-primary,
.fin-btn-primary,
.gov-btn-primary,
.iso-btn-primary,
.lts-btn-primary,
.mc-btn-primary,
.med-btn-primary,
.mts-btn-primary {
  background-color: #00B8FF !important;
  background-image: none !important;
  color: #FFFFFF !important;
  border: 1px solid #00B8FF !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important;
  font-weight: 700 !important;
}

.btn-primary *,
.hero-btn-primary *,
.cta-btn-primary *,
.btn-submit *,
.quote-btn-submit *,
.form-submit-btn *,
.nav-contact-btn *,
button[type="submit"] *,
[class*="-btn-primary"] * {
  color: #FFFFFF !important;
}

.btn-primary:hover,
.hero-btn-primary:hover,
.cta-btn-primary:hover,
.btn-submit:hover,
.quote-btn-submit:hover,
.form-submit-btn:hover,
.nav-contact-btn:hover,
button[type="submit"]:hover,
[class*="-btn-primary"]:hover {
  background-color: #00A3E6 !important;
  border-color: #00A3E6 !important;
  color: #FFFFFF !important;
}

.btn-secondary,
.hero-btn-secondary,
.cta-btn-secondary,
a.btn-secondary,
button.btn-secondary {
  background-color: #00B4A0 !important;
  background-image: none !important;
  color: #FFFFFF !important;
  border: 1px solid #00B4A0 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
  font-weight: 700 !important;
}

.btn-secondary *,
.hero-btn-secondary * {
  color: #FFFFFF !important;
}

.btn-secondary:hover,
.hero-btn-secondary:hover {
  background-color: #009E8C !important;
  border-color: #009E8C !important;
  color: #FFFFFF !important;
}

.btn-outline,
.btn-ghost,
a.btn-outline,
button.btn-outline {
  background-color: transparent !important;
  color: #00B8FF !important;
  border: 1.5px solid #00B8FF !important;
  font-weight: 700 !important;
}

.btn-outline:hover,
.btn-ghost:hover,
a.btn-outline:hover,
button.btn-outline:hover {
  background-color: #DDF3FF !important;
  color: #00B8FF !important;
  border-color: #00B8FF !important;
}

/* 10. Background-Based Contrast Inversion */
/* Electric Blue backgrounds -> White text */
.wok-flow-bg,
#working-process,
.bg-electric-blue {
  background-color: #00B8FF !important;
}

.wok-flow-bg > .container > .section-header h2,
.wok-flow-bg > .container > .section-header p,
.wok-flow-bg h2:not(.work-flow-step-title),
.wok-flow-bg .wok-flow-title,
.wok-flow-bg .wok-flow-desc,
.bg-electric-blue h1,
.bg-electric-blue h2,
.bg-electric-blue h3,
.bg-electric-blue p {
  color: #FFFFFF !important;
}

/* White cards on Electric Blue background */
.work-flow-card,
.wok-flow-card,
.work-process-card,
.process-card {
  background-color: #FFFFFF !important;
}

.work-flow-card .work-flow-step-num,
.wok-flow-card .work-flow-step-num,
.work-flow-step-num {
  color: #00B8FF !important;
  font-weight: 700;
}

.work-flow-card .work-flow-step-title,
.work-flow-card h3,
.work-flow-card h4,
.wok-flow-card h3,
.wok-flow-card h4 {
  color: #263238 !important;
}

.work-flow-card .work-flow-step-desc,
.work-flow-card p,
.wok-flow-card p {
  color: #263238 !important;
}

.work-flow-icon .arrow,
.work-flow-icon i {
  color: #00B8FF !important;
}

/* 11. Footer (Dark Charcoal background -> White text) */
.footer-main,
#site-footer,
footer {
  background-color: #263238 !important;
  color: #FFFFFF !important;
}

.footer-heading,
footer h3,
footer h4,
footer h5,
.footer-col h4,
.footer-title {
  color: #FFFFFF !important;
}

.footer-company-desc,
.footer-contact-item,
.footer-office-address,
.footer-branch-address,
.footer-branch-card .footer-branch-address,
.footer-branch-card p,
.footer-branch-header,
.footer-branch-header span,
.footer-copyright-text,
footer p,
footer span:not(.footer-link-icon):not(.footer-contact-icon),
footer li {
  color: #FFFFFF !important;
}

.footer-link,
.footer-contact-link,
.footer-city-link,
.footer-copyright-link,
footer a {
  color: #FFFFFF !important;
}

.footer-link:hover,
.footer-contact-link:hover,
.footer-city-link:hover,
.footer-copyright-link:hover,
footer a:hover {
  color: #00B8FF !important;
}

.footer-link-icon,
.footer-contact-icon,
.footer-branch-icon,
.footer-view-more,
.footer-accent-line {
  color: #00D4C0 !important;
}

.footer-social-btn {
  background-color: #37474F !important;
  color: #FFFFFF !important;
}

.footer-social-btn:hover {
  background-color: #00B8FF !important;
  color: #FFFFFF !important;
}

/* 12. Form Labels, Inputs & Placeholders */
label,
.form-label,
.quote-form-label,
legend,
[class*="-label"] {
  color: #263238 !important;
  font-weight: 600;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="date"],
input[type="file"],
select,
textarea {
  color: #263238 !important;
  background-color: #FFFFFF !important;
}

::placeholder,
::-webkit-input-placeholder,
::-moz-placeholder,
:-ms-input-placeholder {
  color: #546E7A !important;
  opacity: 1 !important;
}

.form-text,
.form-hint,
.field-note,
.form-helper {
  color: #546E7A !important;
}

/* 13. FAQ Questions & Answers */
.faq-question-btn,
.accordion-trigger,
.faq-question,
.faq-item h3,
.faq-item h4 {
  color: #263238 !important;
  background-color: #FFFFFF !important;
}

.faq-accordion-item.is-active .faq-question-btn,
.faq-accordion-item.open .faq-question-btn,
.accordion-item.is-open .accordion-trigger {
  color: #00B8FF !important;
}

.faq-answer-pane,
.accordion-content,
.faq-answer,
.faq-answer p {
  color: #263238 !important;
  background-color: #FFFFFF !important;
}

/* 14. Floating Action Toolbar & Chatbot Interface */
.btn-floating-whatsapp {
  background-color: #25D366 !important;
  color: #FFFFFF !important;
}
.btn-floating-whatsapp i {
  color: #FFFFFF !important;
}

.btn-call-247 {
  background-color: #00B8FF !important;
  color: #FFFFFF !important;
}
.btn-call-247 i,
.btn-call-247 svg {
  color: #FFFFFF !important;
}

.btn-ai-chat {
  background-color: #00B8FF !important;
  color: #FFFFFF !important;
}
.btn-ai-chat i,
.btn-ai-chat svg {
  color: #FFFFFF !important;
}

.back-to-top {
  background-color: #263238 !important;
  color: #FFFFFF !important;
}
.back-to-top i,
.back-to-top svg {
  color: #FFFFFF !important;
}

/* Chatbot Modal Interface */
.chat-modal-header,
.chat-header {
  background: linear-gradient(135deg, #00B8FF 0%, #00D4C0 100%) !important;
  color: #FFFFFF !important;
}
.chat-modal-header h3,
.chat-modal-header p,
.chat-header-title {
  color: #FFFFFF !important;
}
.chat-msg-bot .chat-bubble {
  background-color: #DDF3FF !important;
  color: #263238 !important;
}
.chat-msg-user .chat-bubble {
  background-color: #00B8FF !important;
  color: #FFFFFF !important;
}
.chat-quick-btn {
  background-color: #FFFFFF !important;
  color: #263238 !important;
  border: 1px solid #00B8FF !important;
}
.chat-quick-btn:hover {
  background-color: #00B8FF !important;
  color: #FFFFFF !important;
}
.chat-input {
  color: #263238 !important;
  background-color: #FFFFFF !important;
}
.chat-send-btn {
  background-color: #00B8FF !important;
  color: #FFFFFF !important;
}

/* 15. Popups & Enquiry Modal */
.modal-card,
.enquiry-modal-content {
  background-color: #FFFFFF !important;
  color: #263238 !important;
}
.modal-card h3,
.modal-card h4,
.enquiry-modal-title {
  color: #263238 !important;
}
.modal-card p,
.enquiry-modal-desc {
  color: #263238 !important;
}
.enquiry-modal-close {
  color: #263238 !important;
}
.enquiry-modal-close:hover {
  color: #00B8FF !important;
}

/* 16. Eyebrow Badges & Pill Tags (Mint Green #D3F8F1 with Dark Charcoal #263238 text) */
.banner-subheading,
.banner-about-badge,
.services-ui-badge,
.expertise-badge,
.quote-eyebrow,
.faq-badge,
.section-subtitle,
.badge-pill,
.policy-pill,
.privacy-pill,
.terms-pill,
.blog-category-badge,
.pricing-badge,
.services-category-heading,
.eyebrow-tag {
  background-color: #D3F8F1 !important;
  color: #263238 !important;
  border: 1px solid rgba(0, 212, 192, 0.4) !important;
  font-weight: 700 !important;
}

.banner-subheading *,
.banner-about-badge *,
.services-ui-badge *,
.quote-eyebrow * {
  color: #263238 !important;
}

/* ==========================================================================
   HONEY UNIVERSAL - CONTRAST & VISIBILITY COMPREHENSIVE CORRECTIONS
   Ensures 100% WCAG AA compliance across all backgrounds, devices, and states
   ========================================================================== */

/* 17. Electric Blue Backgrounds & Overlays -> Pure White #FFFFFF Typography */
.about-team-section,
.about-team-section h2,
.about-team-section h3,
.about-team-section p,
.about-team-heading,
.about-team-name,
.about-team-role,
.acad-mid-cta-box,
.acad-mid-cta-box h2,
.acad-mid-cta-box p,
.bts-mid-cta-box,
.bts-mid-cta-box h2,
.bts-mid-cta-box p,
.iso-mid-cta-section,
.iso-mid-cta-section h2,
.iso-mid-cta-section p,
.lts-mid-cta-box,
.lts-mid-cta-box h2,
.lts-mid-cta-box p,
.mts-mid-cta-box,
.mts-mid-cta-box h2,
.mts-mid-cta-box p,
.mv-cta-section,
.mv-cta-section h2,
.mv-cta-section p,
.services-bg-blue,
.services-bg-blue h2,
.services-bg-blue p {
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35) !important;
}

/* 18. Dark Sections, Dark Overlays & Final CTAs -> Pure White #FFFFFF Typography */
.acad-final-cta-section,
.acad-final-cta-box,
.acad-final-cta-h2,
.acad-final-cta-h2 span,
.acad-final-cta-p,
.bcts-final-cta-section,
.bcts-final-cta-inner,
.bcts-final-cta-inner h2,
.bcts-final-cta-inner p,
.etts-final-cta-section,
.etts-final-cta-inner,
.etts-final-cta-inner h2,
.etts-final-cta-inner p,
.fin-final-cta-section,
.fin-final-cta-box,
.fin-final-cta-h2,
.fin-final-cta-h2 span,
.fin-final-cta-p,
.gov-final-cta-section,
.gov-final-cta-box,
.gov-final-cta-h2,
.gov-final-cta-h2 span,
.gov-final-cta-p,
.iso-final-cta-section,
.iso-final-cta-box,
.iso-final-cta-h2,
.iso-final-cta-h2 span,
.iso-final-cta-p,
.lts-final-cta-section,
.lts-final-cta-box,
.lts-final-cta-h2,
.lts-final-cta-h2 span,
.lts-final-cta-p,
.med-final-cta-section,
.med-final-cta-box,
.med-final-cta-h2,
.med-final-cta-h2 span,
.med-final-cta-p,
.mts-final-cta-section,
.mts-final-cta-box,
.mts-final-cta-h2,
.mts-final-cta-h2 span,
.mts-final-cta-p,
.sidebar-cta-widget,
.sidebar-cta-widget h3,
.sidebar-cta-widget p,
.blog-cta-box,
.blog-cta-box h2,
.blog-cta-box h3,
.blog-cta-box p,
.cc-cta-section,
.cc-cta-section h2,
.cc-cta-section p,
.edu-cta-section,
.edu-cta-section h2,
.edu-cta-section p,
.sa-cta-section,
.sa-cta-section h2,
.sa-cta-section p,
.lt-cta-section,
.lt-cta-section h2,
.lt-cta-section p,
.va-cta-inner,
.va-cta-inner h2,
.va-cta-inner p,
.wts-mid-cta-box,
.wts-mid-cta-box h2,
.wts-mid-cta-box p,
.marriage-page .mc-form-visual-overlay * {
  color: #FFFFFF !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45) !important;
}

/* 19. Hero Image Badge Overlays (Dark translucent glassmorphism) */
[class*="-badge-overlay"],
[class*="-badge-overlay"] *,
.acad-hero-badge-overlay *,
.bts-hero-badge-overlay *,
.med-hero-badge-overlay *,
.mts-hero-badge-overlay *,
.va-hero-badge-overlay *,
.wts-hero-badge-overlay *,
.blog-card-badge-overlay * {
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
}

/* 20. Popular Languages Flag Badges (Text over dark flag graphics) */
.lang-badge,
.lang-badge span {
  color: #FFFFFF !important;
  font-weight: 700 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.75) !important;
}

/* 21. Numbered Carousel Pagination Dots */
.services-ui-dot:not(.active),
.team-carousel-dot:not(.active) {
  background-color: #DDF3FF !important;
  color: #263238 !important;
  font-weight: 700 !important;
  border: 1px solid rgba(0, 184, 255, 0.35) !important;
}

.services-ui-dot.active,
.team-carousel-dot.active {
  background-color: #00B8FF !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}

/* 22. Floating Social Proof Badge (Bottom-Left) */
.floating-proof,
.floating-proof .proof-row,
.floating-proof .proof-row strong,
.floating-proof .proof-row i.fa-chart-line,
.floating-proof .auto-type,
.floating-proof .typed-cursor {
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}

.floating-proof .start-rating i {
  color: #FFC107 !important;
}

/* 23. White CTA Buttons Inside Colored/Dark Sections (12:1 Contrast) */
.acad-mid-cta-box .acad-btn-primary,
.bts-mid-cta-box .bts-btn-primary,
.bcts-btn-banner-white,
.etts-btn-banner-white,
.fin-mid-cta-actions .fin-btn-primary,
.fin-final-cta-actions .fin-btn-primary,
.gov-final-cta-actions .gov-btn-primary,
.cc-cta-btn,
.cc-btn-secondary,
.edu-btn-cta-white,
.edu-btn-secondary,
.sa-btn-cta-white,
.sa-btn-secondary,
.sidebar-cta-btn,
.blog-cta-btn,
.acad-final-cta-box .acad-hero-phone-link:hover,
.fin-final-cta-actions .fin-hero-phone-link:hover,
.gov-final-cta-actions .gov-hero-phone-link:hover,
.lts-final-cta-box .lts-hero-phone-link:hover,
.med-final-cta-box .med-hero-phone-link:hover,
.mts-final-cta-box .mts-hero-phone-link:hover {
  background-color: #FFFFFF !important;
  color: #263238 !important;
  font-weight: 700 !important;
  border-color: #FFFFFF !important;
  text-shadow: none !important;
}

.acad-mid-cta-box .acad-btn-primary *,
.bts-mid-cta-box .bts-btn-primary *,
.bcts-btn-banner-white *,
.etts-btn-banner-white *,
.fin-mid-cta-actions .fin-btn-primary *,
.fin-final-cta-actions .fin-btn-primary *,
.gov-final-cta-actions .gov-btn-primary *,
.cc-cta-btn *,
.cc-btn-secondary *,
.edu-btn-cta-white *,
.edu-btn-secondary *,
.sa-btn-cta-white *,
.sa-btn-secondary *,
.sidebar-cta-btn *,
.blog-cta-btn * {
  color: #263238 !important;
}

/* 24. Breadcrumbs on Light Backgrounds */
.page-breadcrumb,
.article-breadcrumb,
.policy-breadcrumb,
.translation-breadcrumb,
.breadcrumb-separator,
.policy-breadcrumb-sep,
.policy-breadcrumb-current,
.translation-breadcrumb .separator {
  color: #263238 !important;
}

.page-breadcrumb a,
.article-breadcrumb a,
.policy-breadcrumb a,
.translation-breadcrumb a {
  color: #0079B8 !important;
  font-weight: 600 !important;
}

.page-breadcrumb a:hover,
.article-breadcrumb a:hover,
.policy-breadcrumb a:hover,
.translation-breadcrumb a:hover {
  color: #00B8FF !important;
  text-decoration: underline !important;
}

/* 25. Light Tint Badges, Pills & Callouts (Avoid light blue on light backgrounds) */
.acad-pill-badge,
.bts-pill-badge,
.cc-pill-badge,
.sa-pill-badge,
.edu-dest-btn,
.pricing-badge,
.privacy-pill,
.policy-pill,
.terms-pill,
.translation-pill,
.va-pill-badge,
.wts-pill-badge,
.va-cat-disclaimer-note,
.blog-callout,
.blog-badge-cat,
.article-category-badge,
.quote-modal-nextstep-text,
.quote-modal-nextstep-box *,
.terms-toc-group-title,
.privacy-toc-link.active,
.terms-toc-link.active,
.acad-service-tag,
.cc-service-tag,
.services-category-heading {
  color: #263238 !important;
  font-weight: 700 !important;
}

/* 26. Chatbot Enhancements */
.chat-status-text {
  color: #FFFFFF !important;
  font-weight: 600 !important;
}

.chat-notice-box,
.chat-notice-box * {
  background-color: #E6F8FF !important;
  color: #263238 !important;
  font-weight: 600 !important;
}

.chat-quick-btn {
  background-color: #FFFFFF !important;
  color: #263238 !important;
  border: 1px solid #00B8FF !important;
  font-weight: 600 !important;
}

.chat-quick-btn:hover {
  background-color: #00B8FF !important;
  color: #FFFFFF !important;
}

.chat-input::placeholder {
  color: #546E7A !important;
}

/* 27. Mobile Navigation Drawer Visibility */
.menu-toggle span {
  background-color: #263238 !important;
}

.drawer-close {
  color: #263238 !important;
}

.drawer-close:hover {
  color: #00B8FF !important;
}

.mobile-nav-link {
  color: #263238 !important;
  font-weight: 700 !important;
}

.mobile-nav-link.active,
.mobile-nav-link:hover {
  color: #00B8FF !important;
}

.mobile-sub-link {
  color: #263238 !important;
}

.mobile-sub-link:hover {
  color: #00B8FF !important;
}

.drawer-footer,
.drawer-contact-item {
  color: #263238 !important;
}

.dropdown-card-item .item-title,
.item-title {
  color: #263238 !important;
}

.dropdown-card-item:hover .item-title,
.dropdown-card-item:focus .item-title {
  color: #00B8FF !important;
}

/* 28. Interactive Hover & Focus State Contrast */
.btn-outline:hover,
.btn-ghost:hover,
a.btn-outline:hover,
button.btn-outline:hover {
  background-color: #DDF3FF !important;
  color: #263238 !important;
  border-color: #00B8FF !important;
}

.marq-item:hover {
  background-color: #00B8FF !important;
  color: #FFFFFF !important;
  border-color: #00B8FF !important;
}

.industry-btn:hover {
  background-color: #00B8FF !important;
  color: #FFFFFF !important;
}

