/* ==========================================================================
   Veridex – static modernization layer
   Loaded AFTER all Elementor CSS so these rules win.
   Two parts:  (1) global polish & contrast   (2) new Software Development section
   ========================================================================== */

/* ---------- 1. Global contrast & polish ---------------------------------- */

/* Darken the global body text + headings for stronger contrast (AA+). */
.elementor-kit-19{
  --e-global-color-text:#3C4663;     /* was #5B6585 – low contrast grey      */
  --e-global-color-primary:#0F1530;  /* was #181818 – richer near-navy        */
}

html{ scroll-behavior:smooth; scroll-padding-top:110px; } /* nicer anchor jumps below sticky header */

/* Hero heading was dark text on the dark navy hero (~1.1:1, invisible).
   The theme clips the text to a (missing) gradient via background-clip:text +
   transparent text-fill, so it rendered as the dark backdrop. Force solid white
   for the static words; the flipping word keeps its own teal accent. */
.elementor-element-da648a3 .rkit-animated-heading,
.elementor-element-da648a3 .rkit-animated-heading-text{
  color:#FFFFFF !important;
  -webkit-text-fill-color:#FFFFFF !important;
  background:none !important;
  -webkit-background-clip:border-box !important;
  background-clip:border-box !important;
}

/* Keep "business" + the flipping word (Better/Bigger/Faster) on the SAME line
   so a wider word can never spill onto a 3rd row or grow the hero.
   The unit (~506px) fits the heading box (~538px), so nowrap is safe. */
.elementor-element-da648a3 .vx-keep{ white-space:nowrap; }

/* Reserve a fixed-width slot for the flipping word (widest = "Bigger" ~3.06em)
   and left-align it, so the centered line never changes width and "BUSINESS"
   stays stationary while the word types/cycles. em keeps it right per breakpoint. */
.elementor-element-da648a3 .rkit-animated-heading-text-wrapper{
  display:inline-block;
  width:3.2em;
  text-align:left;
  vertical-align:baseline;
}

body{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

/* Slightly stronger body copy everywhere Elementor text widgets render */
.elementor-widget-text-editor,
.elementor-widget-text-editor p{ color:#3C4663; }

/* Buttons: smooth interaction + clear focus, subtle lift */
.elementor-button,
.elementor-field-type-submit button,
button.elementor-button{
  transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease, filter .18s ease;
  will-change:transform;
}
.elementor-button:hover,
.elementor-field-type-submit button:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(11,113,217,.22);
  filter:saturate(1.05);
}
.elementor-button:active{ transform:translateY(0); }

/* Visible keyboard focus for accessibility (was none) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.elementor-button:focus-visible{
  outline:3px solid #7F54F9;
  outline-offset:2px;
  border-radius:6px;
}

/* Form fields: clearer borders, readable placeholders, modern focus ring */
.elementor-field-group input:not([type=submit]),
.elementor-field-group select,
.elementor-field-group textarea{
  border:1.5px solid #D3D9E6 !important;
  background:#fff !important;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.elementor-field-group input::placeholder,
.elementor-field-group textarea::placeholder{ color:#8A93AB !important; opacity:1; }
.elementor-field-group input:focus,
.elementor-field-group select:focus,
.elementor-field-group textarea:focus{
  border-color:#0B71D9 !important;
  box-shadow:0 0 0 4px rgba(11,113,217,.15) !important;
  outline:none !important;
}

::selection{ background:#7F54F9; color:#fff; }

/* ---------- 2. Software Development Solutions section -------------------- */

.vx-softdev{
  position:relative;
  padding:96px 24px;
  background:
     radial-gradient(1100px 480px at 12% -10%, rgba(127,84,249,.10), transparent 60%),
     radial-gradient(900px 460px at 100% 0%, rgba(11,113,217,.10), transparent 55%),
     linear-gradient(180deg,#ffffff 0%,#F4F6FB 100%);
  overflow:hidden;
}
.vx-softdev *{ box-sizing:border-box; }
.vx-softdev .vx-wrap{ max-width:1160px; margin:0 auto; }

.vx-softdev .vx-eyebrow{
  display:inline-block;
  font-family:"Manrope",sans-serif;
  font-weight:800;
  font-size:13px;
  letter-spacing:1.6px;
  text-transform:uppercase;
  color:#0B71D9;
  background:rgba(11,113,217,.10);
  padding:8px 16px;
  border-radius:999px;
  margin-bottom:22px;
}
.vx-softdev h2{
  font-family:"Manrope",sans-serif;
  font-weight:800;
  letter-spacing:-.5px;
  line-height:1.1;
  font-size:clamp(30px,4.4vw,52px);
  color:#0F1530;
  margin:0 0 8px;
  max-width:18ch;
}
.vx-softdev h2 .vx-accent{
  background:linear-gradient(90deg,#7F54F9,#0B71D9);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

.vx-softdev .vx-lead{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:28px;
  margin:30px 0 8px;
}
.vx-softdev .vx-lead p{
  margin:0;
  font-family:"Manrope",sans-serif;
  font-size:17px;
  line-height:1.8;
  color:#3C4663;
}

.vx-softdev .vx-grid{
  margin-top:54px;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:20px;
}
.vx-softdev .vx-card{
  background:#fff;
  border:1px solid #E6EAF2;
  border-radius:18px;
  padding:26px 22px;
  box-shadow:0 1px 2px rgba(15,21,48,.04);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.vx-softdev .vx-card:hover{
  transform:translateY(-6px);
  box-shadow:0 18px 40px rgba(15,21,48,.12);
  border-color:#D5DCEC;
}
.vx-softdev .vx-ic{
  width:48px;height:48px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:16px;
  background:linear-gradient(135deg,#7F54F9,#0B71D9);
  color:#fff;
}
.vx-softdev .vx-ic svg{ width:24px;height:24px;display:block; }
.vx-softdev .vx-card h3{
  font-family:"Manrope",sans-serif;
  font-size:18px;font-weight:700;letter-spacing:-.2px;
  color:#0F1530;margin:0 0 6px;
}
.vx-softdev .vx-card p{
  font-family:"Manrope",sans-serif;
  font-size:14.5px;line-height:1.65;color:#4A5573;margin:0;
}

@media (max-width:760px){
  .vx-softdev{ padding:72px 20px; }
  .vx-softdev .vx-lead{ grid-template-columns:1fr; gap:18px; }
}

/* ==========================================================================
   3. Modern refresh — gradient accent, card treatments, type, sticky header,
      footer accent, and on-scroll reveals. (Purple -> Blue accent.)
   ========================================================================== */
.elementor-kit-19{
  --vx-grad:linear-gradient(135deg,#7F54F9 0%,#0B71D9 100%);
}

/* ---- Buttons: gradient pill with lift ---- */
.elementor-button,
button.elementor-button,
.elementor-field-type-submit button{
  background-image:var(--vx-grad) !important;
  background-color:transparent !important;
  border:none !important;
  border-radius:999px !important;
  color:#fff !important;
  font-weight:700 !important;
  letter-spacing:.2px;
  box-shadow:0 8px 20px rgba(11,113,217,.25);
}
.elementor-button:hover,
button.elementor-button:hover,
.elementor-field-type-submit button:hover{
  filter:brightness(1.07);
  box-shadow:0 14px 30px rgba(11,113,217,.34);
}

/* ---- Service cards (Elementor image-box) ---- */
.elementor-widget-image-box .elementor-image-box-wrapper{
  background:#fff;
  border:1px solid #E6EAF2;
  border-radius:18px;
  padding:28px 24px;
  height:100%;
  box-shadow:0 1px 2px rgba(15,21,48,.05);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.elementor-widget-image-box .elementor-image-box-wrapper:hover{
  transform:translateY(-6px);
  box-shadow:0 22px 46px rgba(15,21,48,.13);
  border-color:#D5DCEC;
}
.elementor-widget-image-box .elementor-image-box-img img{ border-radius:12px; }
.elementor-widget-image-box .elementor-image-box-title{ font-weight:800; letter-spacing:-.2px; }

/* ---- ElementsKit feature boxes -> cards ---- */
.elementor-widget-elementskit-icon-box .ekit-wid-con{
  background:#fff;
  border:1px solid #E6EAF2;
  border-radius:18px;
  padding:30px 26px;
  height:100%;
  box-shadow:0 1px 2px rgba(15,21,48,.05);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.elementor-widget-elementskit-icon-box .ekit-wid-con:hover{
  transform:translateY(-6px);
  box-shadow:0 22px 46px rgba(15,21,48,.13);
  border-color:#D5DCEC;
}

/* ---- Headings: a touch tighter/larger ---- */
.elementor-widget-heading .elementor-heading-title{ letter-spacing:-.4px; }

/* ---- Sticky glassy header (fixed; JS pads the body to match its height —
        position:sticky is broken here by overflow-x:hidden on <body>) ---- */
header{
  position:fixed !important; top:0 !important; left:0; right:0; z-index:999;
  background:rgba(255,255,255,.85);
  -webkit-backdrop-filter:saturate(1.3) blur(10px);
  backdrop-filter:saturate(1.3) blur(10px);
  box-shadow:0 1px 0 rgba(15,21,48,.06), 0 10px 28px rgba(15,21,48,.07);
}

/* ---- Footer: gradient top accent + link hover ---- */
footer{ position:relative; }
footer::before{
  content:""; position:absolute; top:0; left:0; right:0; height:4px;
  background:var(--vx-grad);
}
footer a:hover{ filter:brightness(1.25); }

/* ---- On-scroll reveal (progressive enhancement; no-JS = visible) ---- */
html.vx-js .vx-reveal{
  opacity:0; transform:translateY(26px);
  transition:opacity .65s ease, transform .65s ease;
  will-change:opacity, transform;
}
html.vx-js .vx-reveal.vx-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  html.vx-js .vx-reveal{ opacity:1 !important; transform:none !important; }
}

/* ==========================================================================
   4. Email contact card (replaces the Contact Us form)
   ========================================================================== */
.vx-contact-card{
  font-family:"Manrope",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  text-align:center;
  max-width:640px;
  margin:0 auto;
  padding:14px 8px 6px;
}
.vx-contact-card .vx-cc-icon{
  width:64px; height:64px; margin:0 auto 22px;
  border-radius:18px;
  display:flex; align-items:center; justify-content:center;
  background:var(--vx-grad);
  color:#fff;
  box-shadow:0 12px 28px rgba(11,113,217,.30);
}
.vx-contact-card .vx-cc-icon svg{ width:30px; height:30px; }
.vx-contact-card .vx-cc-title{
  margin:0 0 10px; color:#0F1530; font-weight:800;
  font-size:clamp(22px,2.6vw,28px); letter-spacing:-.4px;
}
.vx-contact-card .vx-cc-text{
  margin:0 auto 26px; max-width:46ch; color:#3C4663;
  font-size:16px; line-height:1.7;
}
.vx-contact-card .vx-cc-btn{
  display:inline-block;
  background:var(--vx-grad); color:#fff !important; text-decoration:none;
  font-weight:800; font-size:clamp(17px,2vw,20px); letter-spacing:.2px;
  padding:16px 34px; border-radius:999px;
  box-shadow:0 12px 28px rgba(11,113,217,.30);
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.vx-contact-card .vx-cc-btn:hover{
  transform:translateY(-2px); filter:brightness(1.07);
  box-shadow:0 18px 38px rgba(11,113,217,.38);
}
.vx-contact-card .vx-cc-meta{
  display:flex; flex-wrap:wrap; gap:12px; justify-content:center;
  margin-top:28px;
}
.vx-contact-card .vx-cc-chip{
  display:inline-flex; align-items:center; gap:10px;
  background:#fff; border:1px solid #E2E7F1; border-radius:999px;
  padding:11px 18px; color:#34405E !important; text-decoration:none;
  font-size:14.5px; font-weight:600;
}
.vx-contact-card .vx-cc-chip .vx-cc-ic{ display:inline-flex; color:#0B71D9; }
.vx-contact-card .vx-cc-chip .vx-cc-ic svg{ width:18px; height:18px; }
.vx-contact-card a.vx-cc-chip:hover{ border-color:#B9C6E4; }

/* ==========================================================================
   5. Rebuilt footer
   ========================================================================== */
footer .footer-width-fixer{ width:100% !important; max-width:none !important; }
.vx-footer{
  font-family:"Manrope",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:#050226;
  color:#AEB6D4;
  padding:64px 28px 0;
}
.vx-footer-inner{
  max-width:1160px; margin:0 auto;
  display:grid; grid-template-columns:1.6fr 1fr 1.4fr; gap:48px;
  padding-bottom:44px;
}
.vx-f-brand .vx-f-logo{
  display:inline-block; background:#fff; border-radius:12px;
  padding:12px 16px; margin-bottom:18px;
}
.vx-f-brand .vx-f-logo img{ height:38px; width:auto; display:block; }
.vx-f-brand p{ margin:0; font-size:14.5px; line-height:1.8; color:#9AA3C4; max-width:42ch; }

.vx-footer .vx-f-col h4{
  margin:6px 0 18px; color:#fff; font-size:15px; font-weight:800;
  letter-spacing:.6px; text-transform:uppercase;
}
.vx-footer .vx-f-col ul{ list-style:none; margin:0; padding:0; }
.vx-footer .vx-f-col li{ margin:0 0 13px; }
.vx-footer .vx-f-col a,
.vx-footer .vx-f-col .vx-f-addr{
  color:#AEB6D4; text-decoration:none; font-size:14.5px; line-height:1.6;
  display:inline-flex; align-items:flex-start; gap:10px;
  transition:color .18s ease;
}
.vx-footer .vx-f-col a:hover{ color:#fff; }
.vx-footer .vx-f-contact .vx-f-ic{ flex:0 0 auto; color:#7FA8F0; margin-top:2px; }
.vx-footer .vx-f-contact .vx-f-ic svg{ width:18px; height:18px; }
.vx-footer .vx-f-addr{ color:#9AA3C4; align-items:flex-start; }

.vx-footer-bottom{
  max-width:1160px; margin:0 auto;
  border-top:1px solid rgba(255,255,255,.10);
  padding:22px 0 26px;
  display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; align-items:center;
  font-size:13.5px; color:#8089AC;
}
.vx-footer-bottom a{ color:#fff; text-decoration:none; }
.vx-footer-bottom a:hover{ filter:brightness(1.25); }

@media (max-width:820px){
  .vx-footer-inner{ grid-template-columns:1fr 1fr; gap:32px; }
  .vx-f-brand{ grid-column:1 / -1; }
}
@media (max-width:520px){
  .vx-footer-inner{ grid-template-columns:1fr; gap:30px; }
  .vx-footer-bottom{ justify-content:center; text-align:center; }
}