/* Start custom CSS *//* =========================================================
   VISION BY HUSNAIN · HOME (Elementor Pro > Page Settings > Custom CSS)
   Layout, type and colour live on each element's Style tab.
   This file holds motion and effects widgets can't express.
   Hooks are [data-vh="..."] attributes (Element > Settings > Attributes).
   Colours = Global Variables: --vh-navy --vh-navy-deep --vh-yellow
   --vh-orange --vh-ink --vh-slate --vh-line --vh-paper --vh-white
   ========================================================= */

/* ---------- 1. Base ---------- */
body.elementor-page-148 { background-color: #FFFFFF; }
body.elementor-page-148 {
  --vh-ease: cubic-bezier(.22,.61,.36,1);
  --vh-grad: linear-gradient(100deg, #FFD400 0%, #FFB800 50%, #FFD400 100%);
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
  font-family: var(--vh-font, 'Plus Jakarta Sans'), sans-serif;
}
body.elementor-page-148 ::selection { background: #FFD400; color: #0B0B3F; }
body.elementor-page-148 a:focus-visible, body.elementor-page-148 button:focus-visible, body.elementor-page-148 summary:focus-visible {
  outline: 3px solid #FFD400; outline-offset: 3px; border-radius: 6px;
}
body.elementor-page-148 [id] { scroll-margin-top: 90px; }
html:has(body.elementor-page-148) { scroll-behavior: smooth; }
@media (max-width: 1024px) {
  body.elementor-page-148 a.e-paragraph-base, body.elementor-page-148 .e-paragraph-base a { display: inline-flex; align-items: center; min-height: 44px; }
}

/* ---------- 2. Sticky header: glass-free, turns solid on scroll ---------- */
body.elementor-page-148 [data-vh~="header"] {
  position: sticky; top: 0; z-index: 100;
  background-color: rgba(6,6,42,.96);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
@supports (animation-timeline: scroll()) {
  body.elementor-page-148 [data-vh~="header"] {
    animation: vh-head linear both; animation-timeline: scroll(root); animation-range: 0px 90px;
  }
}
@keyframes vh-head {
  from { background-color: rgba(11,11,63,1); border-bottom-color: rgba(255,255,255,0); box-shadow: none; }
  to   { background-color: rgba(6,6,42,.97); border-bottom-color: rgba(255,255,255,.08); box-shadow: 0 10px 30px -18px rgba(0,0,0,.6); }
}
body.elementor-page-148 [data-vh~="mnav"] { display: none; }
body.elementor-page-148 [data-vh~="mnav"] summary { list-style: none; }
body.elementor-page-148 [data-vh~="mnav"] summary::-webkit-details-marker { display: none; }
body.elementor-page-148 [data-vh~="mnav"] details[open] > *:not(summary) { animation: vh-drop .4s var(--vh-ease) both; }
@media (max-width: 1024px) {
  body.elementor-page-148 [data-vh~="dnav"] { display: none !important; }
  body.elementor-page-148 [data-vh~="mnav"] { display: block; }
}
@media (max-width: 767px) { body.elementor-page-148 [data-vh~="head-cta"] { display: none !important; } }
@keyframes vh-drop { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }

/* ---------- 3. Buttons ---------- */
body.elementor-page-148 [data-vh~="btn-y"] {
  position: relative; overflow: hidden;
  transition: transform .3s var(--vh-ease), box-shadow .4s var(--vh-ease), background-color .3s;
}
body.elementor-page-148 [data-vh~="btn-y"]::after { /* light sweep on hover */
  content: ""; position: absolute; top: 0; left: -60%; width: 40%; height: 100%;
  background: linear-gradient(100deg, rgba(255,255,255,0), rgba(255,255,255,.55), rgba(255,255,255,0));
  transform: skewX(-20deg); transition: left .7s var(--vh-ease);
}
body.elementor-page-148 [data-vh~="btn-y"]:hover::after { left: 120%; }
body.elementor-page-148 [data-vh~="btn-y"]:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -10px rgba(255,212,0,.55); }
body.elementor-page-148 [data-vh~="btn-o"] { transition: transform .3s var(--vh-ease), background-color .3s, color .3s, border-color .3s; }
body.elementor-page-148 [data-vh~="btn-o"]:hover { transform: translateY(-2px); }
body.elementor-page-148 [data-vh~="arrow"]::after { content: "\2192"; display: inline-block; margin-left: 10px; transition: transform .3s var(--vh-ease); }
body.elementor-page-148 [data-vh~="arrow"]:hover::after { transform: translateX(4px); }

/* ---------- 4. Hero ---------- */
body.elementor-page-148 [data-vh~="hero"] {
  background-image:
    radial-gradient(600px 400px at 85% 30%, rgba(255,212,0,.16), rgba(255,212,0,0) 70%),
    radial-gradient(500px 360px at 0% 100%, rgba(249,168,37,.10), rgba(249,168,37,0) 70%),
    radial-gradient(rgba(255,255,255,.07) 1px, transparent 1px);
  background-size: auto, auto, 26px 26px;
}
body.elementor-page-148 [data-vh~="rise"] { opacity: 0; animation: vh-rise .9s var(--vh-ease) forwards; }
body.elementor-page-148 [data-vh~="rise"]:nth-child(2) { animation-delay: .1s; }
body.elementor-page-148 [data-vh~="rise"]:nth-child(3) { animation-delay: .2s; }
body.elementor-page-148 [data-vh~="rise"]:nth-child(4) { animation-delay: .3s; }
body.elementor-page-148 [data-vh~="rise"]:nth-child(5) { animation-delay: .4s; }
@keyframes vh-rise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }

/* Highlighted word: yellow marker that draws in */
body.elementor-page-148 [data-vh~="hl2"] em, body.elementor-page-148 [data-vh~="hl2"] strong {
  font-style: normal; color: #0B0B3F; position: relative; z-index: 0; white-space: nowrap;
  background-image: linear-gradient(#FFD400, #FFD400);
  background-repeat: no-repeat; background-position: 0 88%; background-size: 0% 42%;
  animation: vh-mark .9s var(--vh-ease) .7s forwards;
  padding: 0 .08em;
}
body.elementor-page-148 [data-vh~="hl2"] em { color: inherit; }
@keyframes vh-mark { to { background-size: 100% 42%; } }
body.elementor-page-148 [data-vh~="hl-y"] em { font-style: normal; color: #FFD400; }

/* Founder card + floating stat chips */
body.elementor-page-148 [data-vh~="photo"] { animation: vh-pop 1s var(--vh-ease) .2s both; }
@keyframes vh-pop { from { opacity: 0; transform: translateY(30px) scale(.97); } to { opacity: 1; transform: none; } }
body.elementor-page-148 [data-vh~="float"] { animation: vh-float 6s ease-in-out infinite; }
body.elementor-page-148 [data-vh~="float2"] { animation: vh-float 7s ease-in-out -2s infinite; }
body.elementor-page-148 [data-vh~="float3"] { animation: vh-float 6.5s ease-in-out -4s infinite; }
@keyframes vh-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
body.elementor-page-148 [data-vh~="ring"] { animation: vh-spin 40s linear infinite; }
@keyframes vh-spin { to { transform: rotate(360deg); } }

/* Live dot */
body.elementor-page-148 [data-vh~="dot"] { position: relative; }
body.elementor-page-148 [data-vh~="dot"]::after {
  content: ""; position: absolute; inset: -4px; border-radius: 50%;
  border: 2px solid currentColor; color: #22C55E; animation: vh-ping 1.8s ease-out infinite;
}
@keyframes vh-ping { 0% { opacity: .9; transform: scale(.5); } 100% { opacity: 0; transform: scale(1.8); } }

/* ---------- 5. Cards ---------- */
body.elementor-page-148 [data-vh~="card"] { transition: transform .45s var(--vh-ease), box-shadow .45s var(--vh-ease), border-color .45s; }
body.elementor-page-148 [data-vh~="card"]:hover { transform: translateY(-6px); box-shadow: 0 24px 50px -24px rgba(11,11,63,.35); border-color: #FFD400 !important; }
body.elementor-page-148 [data-vh~="card"] [data-vh~="icon"] { transition: background-color .4s, color .4s, transform .4s var(--vh-ease); }
body.elementor-page-148 [data-vh~="card"]:hover [data-vh~="icon"] { background-color: #FFD400 !important; color: #0B0B3F !important; transform: rotate(-6deg) scale(1.06); }
body.elementor-page-148 [data-vh~="shot"] img { transition: transform .8s var(--vh-ease); }
body.elementor-page-148 [data-vh~="shot"]:hover img { transform: scale(1.04); }

/* Tick */
body.elementor-page-148 [data-vh~="tick"] {
  flex: 0 0 auto; position: relative; width: 22px !important; height: 22px !important; min-width: 0 !important; padding: 0 !important;
  border-radius: 50%; background: #FFD400;
}
body.elementor-page-148 [data-vh~="tick"]::after {
  content: ""; position: absolute; left: 7px; top: 5px; width: 5px; height: 9px;
  border-right: 2px solid #0B0B3F; border-bottom: 2px solid #0B0B3F; transform: rotate(45deg);
}

/* ---------- 6. Marquees ---------- */
body.elementor-page-148 [data-vh~="marquee"] {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
body.elementor-page-148 [data-vh~="track"], body.elementor-page-148 [data-vh~="track-rev"] { display: flex; width: max-content; animation: vh-marquee 45s linear infinite; }
body.elementor-page-148 [data-vh~="track-rev"] { animation-direction: reverse; animation-duration: 60s; }
body.elementor-page-148 [data-vh~="ticker"] { display: flex; width: max-content; animation: vh-marquee 30s linear infinite; }
body.elementor-page-148 [data-vh~="marquee"]:hover [data-vh^="track"], body.elementor-page-148 [data-vh~="marquee"]:focus-within [data-vh^="track"] { animation-play-state: paused; }
@keyframes vh-marquee { from { transform: translate3d(0,0,0); } to { transform: translate3d(-50%,0,0); } }

/* ---------- 7. FAQ accordion ---------- */
body.elementor-page-148 [data-vh~="faq"] summary { list-style: none; }
body.elementor-page-148 [data-vh~="faq"] summary::-webkit-details-marker { display: none; }
body.elementor-page-148 [data-vh~="faq"] summary svg { display: none; }
body.elementor-page-148 [data-vh~="faq"] summary::after {
  content: ""; flex: 0 0 34px; width: 34px; height: 34px; border-radius: 50%;
  background:
    linear-gradient(#0B0B3F, #0B0B3F) center / 12px 2px no-repeat,
    linear-gradient(#0B0B3F, #0B0B3F) center / 2px 12px no-repeat,
    #F6F7FB;
  transition: transform .4s var(--vh-ease), background-color .3s;
}
body.elementor-page-148 [data-vh~="faq"] details[open] > summary::after {
  transform: rotate(180deg);
  background:
    linear-gradient(#0B0B3F, #0B0B3F) center / 12px 2px no-repeat,
    #FFD400;
}
body.elementor-page-148 [data-vh~="faq"] details { border-bottom: 1px solid #E5E7F0; }
body.elementor-page-148 [data-vh~="faq"] details[open] > summary + * { animation: vh-drop .45s var(--vh-ease) both; }

/* ---------- 8. Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html:has(body.elementor-page-148) { scroll-behavior: auto; }
  body.elementor-page-148 *, body.elementor-page-148 *::before, body.elementor-page-148 *::after { animation: none !important; transition: none !important; }
  body.elementor-page-148 [data-interaction-id] { opacity: 1 !important; transform: none !important; }
  body.elementor-page-148 [data-vh~="rise"], body.elementor-page-148 [data-vh~="photo"] { opacity: 1 !important; }
  body.elementor-page-148 [data-vh~="hl2"] em, body.elementor-page-148 [data-vh~="hl2"] strong { background-size: 100% 42%; }
  body.elementor-page-148 [data-vh~="marquee"] { overflow-x: auto; }
}

/* ---------- 9. Husnain AI chatbot (AI Engine, Messages theme) in brand colours ---------- */
body .mwai-messages-theme {
  --mwai-fontFamily: 'Plus Jakarta Sans', sans-serif;
  --mwai-fontColor: #0E0F2C;
  --mwai-backgroundPrimaryColor: #FFFFFF;
  --mwai-backgroundHeaderColor: #0B0B3F;
  --mwai-headerColor: #FFFFFF;
  --mwai-bubbleColor: #0B0B3F;
  --mwai-backgroundUserColor: #0B0B3F;
  --mwai-backgroundAiColor: #F6F7FB;
  --mwai-backgroundAiSecondaryColor: #E5E7F0;
  --mwai-accentColor: #FFD400;
  --mwai-linkColor: #0B0B3F;
  --mwai-iconTextColor: #0B0B3F;
  --mwai-iconTextBackgroundColor: #FFD400;
  --mwai-borderRadius: 18px;
  --mwai-iconSize: 64px;
}
body .mwai-messages-theme .mwai-open-button img,
body .mwai-messages-theme .mwai-icon-container img { border-radius: 50%; box-shadow: 0 12px 30px -8px rgba(11,11,63,.55); border: 3px solid #FFD400; }
body .mwai-messages-theme .mwai-icon-text { font-weight: 700; box-shadow: 0 10px 24px -10px rgba(11,11,63,.45); }
body .mwai-messages-theme .mwai-window-box { box-shadow: 0 30px 70px -20px rgba(11,11,63,.45); }/* End custom CSS */