/* AK Remit — unified style overlay (applied on every page) */
:root {
  --akr-primary: #1aa3d6;
  --akr-primary-dark: #137ea7;
  --akr-dark: #0f1e2e;
  --akr-text: #1c2733;
  --akr-text-muted: #4a5868;
  --akr-bg-alt: #f5f8fb;
  --akr-border: #e3e9ef;
}

/* Buttons styled consistently across all pages */
.elementor-button {
  background: var(--akr-primary) !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 12px 28px !important;
  font-weight: 600 !important;
  border: 0 !important;
  transition: background 0.15s ease !important;
}
.elementor-button:hover { background: var(--akr-primary-dark) !important; }

/* Heading accent spans — make "theme" highlight consistent */
.theme {
  color: var(--akr-primary) !important;
  font-weight: 700 !important;
}
.theme_white {
  color: #fff !important;
  background: var(--akr-primary) !important;
  padding: 0 10px !important;
  border-radius: 4px !important;
}

/* "hp_banner" used as hero banner on many pages — apply consistent gradient */
.hp_banner {
  background: linear-gradient(135deg, #eaf6fb 0%, #ffffff 60%) !important;
  border-radius: 12px !important;
  padding: 32px !important;
}

/* "building_section" — dark CTA band */
.building_section {
  background: var(--akr-dark) !important;
  color: #c9d3df !important;
  padding: 48px 24px !important;
}
.building_section h1, .building_section h2, .building_section h3, .building_section h4, .building_section .elementor-heading-title {
  color: #fff !important;
}

/* Cards / image-box widgets — consistent rounded look */
.elementor-image-box-wrapper {
  background: #fff;
  border: 1px solid var(--akr-border);
  border-radius: 12px;
  padding: 20px;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.elementor-image-box-wrapper:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(20,40,60,0.10);
  border-color: var(--akr-primary);
}

/* Headings — slightly softened font sizes if no per-page CSS hit */
.elementor-widget-heading h1.elementor-heading-title {
  font-size: clamp(2rem, 3.5vw, 3rem);
  line-height: 1.15;
}
.elementor-widget-heading h2.elementor-heading-title {
  font-size: clamp(1.5rem, 2.6vw, 2.2rem);
  line-height: 1.2;
}
.elementor-widget-heading h3.elementor-heading-title {
  font-size: 1.3rem;
  line-height: 1.3;
}

/* Footer legal microcopy */
.foot_links {
  font-size: 0.86rem;
  line-height: 1.6;
}

/* Hide nav items: Products, Solutions, Partners, Business Tools.
 * WP gives them stable menu-item-<id> classes. We hide all instances
 * (desktop menu, dropdown menu, mobile drawer). */
.menu-item-29,   /* Products */
.menu-item-507,  /* Solutions */
.menu-item-25,   /* Partners */
.menu-item-538   /* Business Tools */
{ display: none !important; }

/* Fill the empty home hero (the bee949b container is a video background
 * we do not have locally — it ends up as a blank box). Render a CSS-only
 * "global commerce" illustration: a soft gradient backdrop with a globe
 * and orbit rings + pulse dots showing payments flowing between regions.
 * Scoped to this specific container so other hp_banner boxes with real
 * content are not affected. */
.elementor-element-bee949b {
  position: relative;
  min-height: 380px;
  overflow: hidden;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 400'><defs><radialGradient id='globe' cx='38%25' cy='35%25' r='70%25'><stop offset='0' stop-color='%23bfe6f5'/><stop offset='0.55' stop-color='%231aa3d6'/><stop offset='1' stop-color='%230f4c75'/></radialGradient><radialGradient id='orb1' cx='30%25' cy='30%25' r='70%25'><stop offset='0' stop-color='%23ffd699'/><stop offset='1' stop-color='%23ff9800'/></radialGradient><linearGradient id='ring' x1='0' x2='1' y1='0' y2='0'><stop offset='0' stop-color='%231aa3d6' stop-opacity='0'/><stop offset='0.5' stop-color='%231aa3d6' stop-opacity='0.55'/><stop offset='1' stop-color='%231aa3d6' stop-opacity='0'/></linearGradient></defs><circle cx='540' cy='320' r='42' fill='url(%23orb1)' opacity='0.85'/><g transform='translate(300 200)'><ellipse cx='0' cy='0' rx='220' ry='60' fill='none' stroke='url(%23ring)' stroke-width='1.5' opacity='0.7'/><ellipse cx='0' cy='0' rx='190' ry='42' fill='none' stroke='url(%23ring)' stroke-width='1.5' transform='rotate(15)' opacity='0.55'/><ellipse cx='0' cy='0' rx='200' ry='52' fill='none' stroke='url(%23ring)' stroke-width='1.5' transform='rotate(-22)' opacity='0.55'/><circle cx='0' cy='0' r='130' fill='url(%23globe)'/><circle cx='0' cy='0' r='130' fill='none' stroke='%23ffffff' stroke-width='1.2' opacity='0.45'/><g stroke='%23ffffff' stroke-width='1' fill='none' opacity='0.4'><ellipse cx='0' cy='0' rx='130' ry='42'/><ellipse cx='0' cy='0' rx='130' ry='80'/><ellipse cx='0' cy='0' rx='44' ry='130'/><ellipse cx='0' cy='0' rx='90' ry='130'/></g><path d='M-100 -50 q 20 -30 60 -30 q 35 0 30 30 q -8 25 -50 25' fill='%2386c5e0' opacity='0.55'/><path d='M-30 -10 q 25 -10 70 0 q 30 15 20 35 q -25 18 -65 8' fill='%2386c5e0' opacity='0.55'/><path d='M50 30 q 30 -5 55 12 q 20 18 -5 35 q -25 14 -55 2' fill='%2386c5e0' opacity='0.55'/><path d='M-80 50 q 20 -15 55 -5 q 25 10 18 32 q -18 18 -55 5' fill='%2386c5e0' opacity='0.55'/></g><g><path d='M120 100 Q300 30 480 110' fill='none' stroke='%23ffb74d' stroke-width='2.2' stroke-dasharray='5 6' opacity='0.85'/><circle cx='120' cy='100' r='6' fill='%23ffb74d'/><circle cx='480' cy='110' r='6' fill='%23ffb74d'/><path d='M150 290 Q280 360 470 280' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-dasharray='5 6' opacity='0.85'/><circle cx='150' cy='290' r='6' fill='%23ffffff' stroke='%231aa3d6' stroke-width='2'/><circle cx='470' cy='280' r='6' fill='%23ffffff' stroke='%231aa3d6' stroke-width='2'/></g></svg>"),
    linear-gradient(135deg, #eaf6fb 0%, #d4ecf7 60%, #ffffff 100%) !important;
  background-size: 100% 100%, 100% 100% !important;
  background-repeat: no-repeat, no-repeat !important;
  background-position: center center, 0 0 !important;
}
/* Hide the inner empty <video> stub so it doesn't render a black bar */
.elementor-element-bee949b .elementor-background-video-container,
.elementor-element-bee949b video {
  display: none !important;
}