/* ============================================================
   UMNIAH v2 – PROFESSIONAL STYLESHEET
   Brand Colors: #f5a623 (gold) | #e74c8b (pink) | #3b82f6 (blue)
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

:root {
  --gold:    #f5a623;
  --pink:    #e74c8b;
  --blue:    #3b82f6;
  --dark:    #060d1f;
  --dark2:   #0b1535;
  --dark3:   #0f1e45;
  --text:    #e2e8f0;
  --muted:   #94a3b8;
  --white:   #ffffff;
  --grad:    linear-gradient(135deg, var(--pink), var(--gold), var(--blue));
  --grad-btn: linear-gradient(135deg, var(--gold) 0%, #e8830a 100%);
}

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

html { scroll-behavior: smooth; }

body {
  font-family: 'Inter', sans-serif;
  background: #f0f4f8;
  color: #1e293b;
  overflow-x: hidden;
}

/* ============ SCROLLBAR ============ */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--dark); }
::-webkit-scrollbar-thumb { background: var(--gold); border-radius: 3px; }

/* ============ GRADIENT TEXT ============ */
.gradient-text {
  background: var(--grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.gold-text { color: var(--gold); }
.pink-text { color: var(--pink); }
.blue-text { color: var(--blue); }

/* ============ SECTION LABEL ============ */
.section-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(245,166,35,0.1);
  border: 1px solid rgba(245,166,35,0.3);
  color: var(--gold);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 6px 16px;
  border-radius: 50px;
  margin-bottom: 16px;
}
.section-label::before {
  content: '';
  width: 6px; height: 6px;
  background: var(--gold);
  border-radius: 50%;
  animation: blink 1.5s ease-in-out infinite;
}
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0.3} }

/* ============ NAVBAR ============ */
.umniah-nav {
  background: rgba(6,13,31,0.95) !important;
  border-bottom: 1px solid rgba(245,166,35,0.12);
  padding: 12px 0;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  z-index: 1050;
  transition: all 0.3s ease;
}
.umniah-nav.scrolled {
  background: rgba(6,13,31,0.99) !important;
  box-shadow: 0 4px 30px rgba(0,0,0,0.5);
}
.brand-name { font-size: 1.6rem; font-weight: 900; color: #fff; letter-spacing: 1px; }
.brand-tagline { font-size: 0.6rem; color: var(--muted); letter-spacing: 0.5px; margin-top: -2px; }
.umniah-nav .nav-link {
  color: #cbd5e1 !important;
  font-size: 0.9rem;
  font-weight: 500;
  padding: 8px 16px !important;
  border-radius: 8px;
  transition: all 0.25s;
  position: relative;
}
.umniah-nav .nav-link::after {
  content: '';
  position: absolute;
  bottom: 2px; left: 50%;
  width: 0; height: 2px;
  background: var(--gold);
  border-radius: 2px;
  transition: all 0.3s;
  transform: translateX(-50%);
}
.umniah-nav .nav-link:hover,
.umniah-nav .nav-link.active { color: var(--gold) !important; }
.umniah-nav .nav-link:hover::after,
.umniah-nav .nav-link.active::after { width: 60%; }
.btn-nav-cta {
  background: var(--grad-btn);
  color: #fff !important;
  font-weight: 700;
  padding: 9px 24px !important;
  border-radius: 50px !important;
  font-size: 0.88rem;
  transition: all 0.3s !important;
  box-shadow: 0 4px 15px rgba(245,166,35,0.3);
}
.btn-nav-cta:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(245,166,35,0.45) !important;
}
.btn-nav-cta::after { display: none !important; }

/* ============ HERO SECTION ============ */
.hero-section {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--dark);
}
.hero-bg {
    position: absolute;
    inset: 0;
    /*  background-image: url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?w=1920&q=80');
*/
    background-image: url('../images/bcGround2.png');
    background-size: cover;
    background-position: center;
    transform: scale(1.05);
    animation: slowZoom 20s ease-in-out infinite alternate;
}
@keyframes slowZoom { from{transform:scale(1.05)} to{transform:scale(1.12)} }
.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg,
    rgba(6,13,31,0.92) 0%,
    rgba(11,21,53,0.85) 40%,
    rgba(6,13,31,0.75) 100%);
}
.hero-overlay2 {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 65% 50%, rgba(245,166,35,0.06) 0%, transparent 55%),
              radial-gradient(ellipse at 20% 80%, rgba(231,76,139,0.06) 0%, transparent 50%);
}
/* Floating particles */
.hero-particles {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
.hero-particles span {
  position: absolute;
  display: block;
  border-radius: 50%;
  animation: floatUp linear infinite;
  opacity: 0;
}
.hero-particles span:nth-child(1)  { width:3px;height:3px;left:10%;background:var(--gold);animation-duration:8s;animation-delay:0s; }
.hero-particles span:nth-child(2)  { width:2px;height:2px;left:20%;background:var(--pink);animation-duration:10s;animation-delay:1s; }
.hero-particles span:nth-child(3)  { width:4px;height:4px;left:35%;background:var(--blue);animation-duration:7s;animation-delay:2s; }
.hero-particles span:nth-child(4)  { width:2px;height:2px;left:50%;background:var(--gold);animation-duration:9s;animation-delay:0.5s; }
.hero-particles span:nth-child(5)  { width:3px;height:3px;left:65%;background:var(--pink);animation-duration:11s;animation-delay:1.5s; }
.hero-particles span:nth-child(6)  { width:2px;height:2px;left:75%;background:var(--blue);animation-duration:8s;animation-delay:3s; }
.hero-particles span:nth-child(7)  { width:4px;height:4px;left:85%;background:var(--gold);animation-duration:6s;animation-delay:0.8s; }
.hero-particles span:nth-child(8)  { width:2px;height:2px;left:92%;background:var(--pink);animation-duration:12s;animation-delay:2.5s; }
@keyframes floatUp {
  0%   { bottom:-10%;opacity:0; transform:translateX(0) rotate(0deg); }
  10%  { opacity:0.8; }
  90%  { opacity:0.4; }
  100% { bottom:110%;opacity:0; transform:translateX(30px) rotate(360deg); }
}
.hero-content { position:relative; z-index:2; padding-top:100px; padding-bottom:60px; }
.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(245,166,35,0.12);
  border: 1px solid rgba(245,166,35,0.35);
  color: var(--gold);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 7px 18px;
  border-radius: 50px;
  margin-bottom: 24px;
}
.hero-badge i { font-size: 0.7rem; animation: spin 3s linear infinite; }
@keyframes spin { to{transform:rotate(360deg)} }
.hero-title {
  font-size: clamp(2.2rem, 5vw, 3.8rem);
  font-weight: 900;
  color: #fff;
  line-height: 1.15;
  margin-bottom: 22px;
}
.hero-title .line2 { display: block; }
.hero-sub {
  font-size: 1.05rem;
  color: #94a3b8;
  line-height: 1.8;
  max-width: 520px;
  margin-bottom: 36px;
}
.hero-btns { display:flex; flex-wrap:wrap; gap:14px; margin-bottom:50px; }
.btn-primary-umniah {
  background: var(--grad-btn);
  color: #fff;
  font-weight: 700;
  padding: 14px 36px;
  border-radius: 50px;
  font-size: 0.95rem;
  border: none;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all 0.3s;
  box-shadow: 0 6px 25px rgba(245,166,35,0.35);
}
.btn-primary-umniah:hover {
  color:#fff; transform:translateY(-3px);
  box-shadow: 0 12px 35px rgba(245,166,35,0.5);
}
.btn-outline-umniah {
  background: transparent;
  color: #fff;
  font-weight: 600;
  padding: 13px 34px;
  border-radius: 50px;
  font-size: 0.95rem;
  border: 1.5px solid rgba(255,255,255,0.3);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all 0.3s;
}
.btn-outline-umniah:hover {
  color: var(--gold);
  border-color: var(--gold);
  background: rgba(245,166,35,0.08);
}
/* Hero stats mini */
.hero-stats-row {
  display: flex;
  gap: 30px;
  padding-top: 30px;
  border-top: 1px solid rgba(255,255,255,0.08);
}
.hero-stat-item .num {
  font-size: 1.6rem;
  font-weight: 900;
  background: var(--grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.hero-stat-item .lbl { font-size: 0.75rem; color: var(--muted); font-weight: 500; }

/* 14 YEARS VISUAL */
.years-visual {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  padding-top: 80px;
}
.years-orb {
  position: relative;
  width: 360px;
  height: 360px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.years-ring {
  position: absolute;
  border-radius: 50%;
  animation: spin2 12s linear infinite;
}
.ring-1 {
  inset: 0;
  border: 2px solid transparent;
  background: linear-gradient(var(--dark),var(--dark)) padding-box,
              var(--grad) border-box;
  animation-duration: 12s;
}
.ring-2 {
  inset: 20px;
  border: 1px solid rgba(245,166,35,0.2);
  animation-duration: 8s;
  animation-direction: reverse;
}
.ring-3 {
  inset: 45px;
  border: 1.5px solid rgba(231,76,139,0.2);
  animation-duration: 15s;
}
@keyframes spin2 { to{transform:rotate(360deg)} }
.years-core {
  position: relative;
  z-index: 2;
  text-align: center;
}
.years-num {
  font-size: 7.5rem;
  font-weight: 900;
  line-height: 1;
  background: var(--grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  filter: drop-shadow(0 0 30px rgba(245,166,35,0.4));
}
.years-label {
  font-size: 1.4rem;
  font-weight: 800;
  color: rgba(255,255,255,0.9);
  letter-spacing: 10px;
  text-shadow: 0 0 20px rgba(59,130,246,0.5);
}
.years-sub {
  font-size: 0.78rem;
  color: var(--muted);
  letter-spacing: 2px;
  margin-top: 6px;
}
/* Dots on rings */
.ring-dot {
  position: absolute;
  width: 10px; height: 10px;
  border-radius: 50%;
  top: -5px; left: calc(50% - 5px);
}

/* ============ SCROLL LINE ============ */
.scroll-line {
  position: absolute;
  bottom: 28px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 0.72rem;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.scroll-line .arrow { animation: bounce 1.8s ease-in-out infinite; }
@keyframes bounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(8px)} }

/* ============ SECTION BASE ============ */
.section-dark {
  background: var(--dark2);
  position: relative;
  overflow: hidden;
}
.section-dark::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(59,130,246,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(59,130,246,0.03) 1px, transparent 1px);
  background-size: 60px 60px;
}
.section-light { background: #f8faff; }
.section-white { background: #ffffff; }
.section-bg-image {
  position: relative;
  overflow: hidden;
}
.section-bg-image .bg-img {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
}
.section-bg-image .bg-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(6,13,31,0.93) 0%, rgba(11,21,53,0.88) 100%);
}
.py-section { padding: 90px 0; }

/* ============ SECTION HEADING ============ */
.section-heading { font-size: clamp(1.7rem,3.5vw,2.5rem); font-weight: 900; line-height: 1.2; }
.section-heading-white { color: #fff; }
.section-heading-dark  { color: #0f172a; }
.section-desc { font-size: 1rem; line-height: 1.8; max-width: 620px; }
.section-desc-white { color: var(--muted); }
.section-desc-dark  { color: #475569; }

/* ============ PARTNER SECTION ============ */
.partners-section {
  background: var(--dark);
  border-top: 1px solid rgba(245,166,35,0.1);
  border-bottom: 1px solid rgba(245,166,35,0.1);
  padding: 30px 0;
  overflow: hidden;
}
.partners-title {
  text-align: center;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin-bottom: 28px;
}
.marquee-wrapper { overflow: hidden; position: relative; }
.marquee-wrapper::before,
.marquee-wrapper::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 120px;
  z-index: 2;
}
.marquee-wrapper::before { left:0; background:linear-gradient(90deg,var(--dark),transparent); }
.marquee-wrapper::after  { right:0; background:linear-gradient(-90deg,var(--dark),transparent); }
.marquee-track {
  display: flex;
  gap: 0;
  animation: marquee 35s linear infinite;
  width: max-content;
}
.marquee-track:hover { animation-play-state: paused; }
@keyframes marquee { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
.partner-logo-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 12px 32px;
  margin: 0 8px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 12px;
  min-width: 160px;
  transition: all 0.3s;
  gap: 6px;
}
.partner-logo-item:hover {
  background: rgba(245,166,35,0.06);
  border-color: rgba(245,166,35,0.25);
  transform: translateY(-2px);
}
.partner-logo-item .p-icon {
  width: 44px; height: 44px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.3rem;
}
.partner-logo-item .p-name {
  font-size: 0.78rem;
  font-weight: 700;
  color: #94a3b8;
  white-space: nowrap;
}

/* ============ SERVICE CARDS ============ */
.services-section { background: #f8faff; }
.svc-card {
  background: #fff;
  border-radius: 20px;
  border: 1px solid #e2e8f0;
  overflow: hidden;
  transition: all 0.4s cubic-bezier(0.34,1.56,0.64,1);
  height: 100%;
  position: relative;
}
.svc-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  opacity: 0;
  transition: opacity 0.3s;
}
.svc-card:hover { transform: translateY(-10px); box-shadow: 0 24px 60px rgba(0,0,0,0.1); }
.svc-card:hover::before { opacity: 1; }
.svc-card-1::before { background: linear-gradient(90deg,var(--blue),#6366f1); }
.svc-card-2::before { background: linear-gradient(90deg,var(--pink),#a855f7); }
.svc-card-3::before { background: linear-gradient(90deg,#10b981,#06b6d4); }
.svc-card-4::before { background: linear-gradient(90deg,var(--gold),#f59e0b); }
.svc-card-5::before { background: linear-gradient(90deg,#6366f1,var(--pink)); }
.svc-card-6::before { background: linear-gradient(90deg,#0891b2,var(--blue)); }
.svc-card-7::before { background: linear-gradient(90deg,#16a34a,#10b981); }
.svc-card-8::before { background: linear-gradient(90deg,var(--gold),var(--pink)); }
.svc-card-body { padding: 32px 28px; }
.svc-icon {
  width: 68px; height: 68px;
  border-radius: 18px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.8rem;
  margin-bottom: 22px;
  transition: transform 0.3s;
}
.svc-card:hover .svc-icon { transform: scale(1.1) rotate(-5deg); }
.svc-title { font-size: 1.1rem; font-weight: 800; color: #0f172a; margin-bottom: 10px; }
.svc-desc { font-size: 0.88rem; color: #64748b; line-height: 1.7; margin-bottom: 18px; }
.svc-features { list-style: none; padding: 0; margin-bottom: 22px; }
.svc-features li {
  font-size: 0.83rem;
  color: #475569;
  padding: 5px 0;
  display: flex;
  align-items: center;
  gap: 8px;
}
.svc-features li::before { content:'›'; color:var(--gold); font-weight:900; font-size:1.1rem; }
.svc-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--blue);
  text-decoration: none;
  transition: all 0.25s;
}
.svc-link:hover { color: var(--gold); gap: 12px; }

/* ============ WHY SECTION ============ */
.why-section {
  position: relative;
  overflow: hidden;
}
.why-bg {
  position: absolute;
  inset: 0;
  background-image: url('https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1920&q=80');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}
.why-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(6,13,31,0.96) 0%, rgba(11,21,53,0.93) 100%);
}
.why-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 18px;
  padding: 30px 24px;
  transition: all 0.3s;
  height: 100%;
  position: relative;
  overflow: hidden;
}
.why-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px;
  height: 0;
  transition: height 0.4s;
}
.why-card:hover { background: rgba(255,255,255,0.07); border-color: rgba(245,166,35,0.25); }
.why-card:hover::after { height: 100%; }
.why-card-1::after { background: var(--gold); }
.why-card-2::after { background: var(--pink); }
.why-card-3::after { background: var(--blue); }
.why-card-4::after { background: #10b981; }
.why-card-5::after { background: #a855f7; }
.why-card-6::after { background: #06b6d4; }
.why-icon {
  width: 56px; height: 56px;
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem;
  margin-bottom: 18px;
}
.why-title-card { font-size: 1rem; font-weight: 800; color: #fff; margin-bottom: 8px; }
.why-desc-card { font-size: 0.85rem; color: #64748b; line-height: 1.7; }

/* ============ STATS SECTION ============ */
.stats-section {
  position: relative;
  overflow: hidden;
}
.stats-bg {
  position: absolute;
  inset: 0;
  background-image: url('https://images.unsplash.com/photo-1526374965328-7f61d4dc18c5?w=1920&q=80');
  background-size: cover;
  background-position: center;
}
.stats-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(6,13,31,0.94) 0%, rgba(15,30,69,0.92) 100%);
}
.stat-card-v2 {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 20px;
  padding: 40px 30px;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: all 0.3s;
}
.stat-card-v2::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
}
.stat-c1::before { background: var(--grad-btn); }
.stat-c2::before { background: linear-gradient(90deg,var(--pink),#a855f7); }
.stat-c3::before { background: linear-gradient(90deg,var(--blue),#06b6d4); }
.stat-card-v2:hover {
  background: rgba(255,255,255,0.08);
  transform: translateY(-6px);
  box-shadow: 0 20px 50px rgba(0,0,0,0.3);
}
.stat-num {
  font-size: 3.5rem;
  font-weight: 900;
  line-height: 1;
  margin-bottom: 6px;
}
.stat-lbl {
  font-size: 1rem;
  font-weight: 700;
  color: #e2e8f0;
  margin-bottom: 8px;
}
.stat-desc2 { font-size: 0.83rem; color: #64748b; line-height: 1.6; }

/* ============ CLIENTS SECTION ============ */
.clients-section { background: #f8faff; }
.client-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 28px 22px;
  text-align: center;
  transition: all 0.35s;
  height: 100%;
  position: relative;
}
.client-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 50px rgba(0,0,0,0.08);
  border-color: rgba(245,166,35,0.3);
}
.client-logo {
  width: 70px; height: 70px;
  border-radius: 16px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.8rem;
  margin: 0 auto 14px;
}
.client-name { font-size: 0.92rem; font-weight: 800; color: #0f172a; margin-bottom: 4px; }
.client-industry { font-size: 0.78rem; color: #64748b; }
.client-stars { color: var(--gold); font-size: 0.75rem; margin-top: 10px; }

/* ============ TESTIMONIALS ============ */
.testimonials-section {
  position: relative;
  overflow: hidden;
}
.testi-bg {
  position: absolute;
  inset: 0;
  background-image: url('https://images.unsplash.com/photo-1639322537228-f710d846310a?w=1920&q=80');
  background-size: cover;
  background-position: center;
}
.testi-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg,rgba(6,13,31,0.96),rgba(11,21,53,0.94));
}
.testi-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.09);
  border-radius: 20px;
  padding: 36px 30px;
  position: relative;
  height: 100%;
  transition: all 0.3s;
}
.testi-card:hover {
  background: rgba(255,255,255,0.08);
  transform: translateY(-4px);
  border-color: rgba(245,166,35,0.25);
}
.testi-quote {
  font-size: 3rem;
  line-height: 0.8;
  background: var(--grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin-bottom: 16px;
}
.testi-text { font-size: 0.9rem; color: #94a3b8; line-height: 1.8; margin-bottom: 24px; font-style: italic; }
.testi-avatar {
  width: 48px; height: 48px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem;
  margin-right: 14px;
}
.testi-name { font-size: 0.92rem; font-weight: 800; color: #fff; }
.testi-role { font-size: 0.78rem; color: var(--gold); }
.testi-stars { color: var(--gold); font-size: 0.8rem; margin-top: 6px; }

/* ============ CTA SECTION ============ */
.cta-section {
  position: relative;
  overflow: hidden;
}
.cta-bg {
  position: absolute;
  inset: 0;
  background-image: url('https://images.unsplash.com/photo-1504639725590-34d0984388bd?w=1920&q=80');
  background-size: cover;
  background-position: center;
}
.cta-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg,rgba(6,13,31,0.96),rgba(11,21,53,0.92));
}
.cta-glow {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 50%, rgba(245,166,35,0.08) 0%, transparent 65%);
}

/* ============ PAGE HERO (inner pages) ============ */
.page-hero {
  position: relative;
  padding: 130px 0 80px;
  overflow: hidden;
}
.page-hero-bg {
  position: absolute;
  inset: 0;
  background-image: url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?w=1920&q=80');
  background-size: cover;
  background-position: center;
}
.page-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg,rgba(6,13,31,0.94),rgba(11,21,53,0.9));
}
.page-hero-content { position:relative; z-index:2; }
.page-hero-title { font-size: clamp(2.2rem,5vw,3.5rem); font-weight:900; color:#fff; }
.page-hero-sub { color:#94a3b8; font-size:1.05rem; max-width:580px; margin:12px auto 0; line-height:1.7; }
.breadcrumb-umniah { background:transparent; padding:0; margin:0 0 16px; }
.breadcrumb-umniah .breadcrumb-item a { color:#64748b; text-decoration:none; font-size:0.85rem; transition:color 0.2s; }
.breadcrumb-umniah .breadcrumb-item a:hover { color:var(--gold); }
.breadcrumb-umniah .breadcrumb-item.active { color:var(--gold); font-size:0.85rem; }
.breadcrumb-umniah .breadcrumb-item+.breadcrumb-item::before { color:#475569; }

/* ============ FOOTER ============ */
.footer-main {
  background: var(--dark);
  border-top: 1px solid rgba(245,166,35,0.1);
}
.footer-logo-name { font-size:1.5rem; font-weight:900; color:#fff; }
.footer-logo-tag  { font-size:0.6rem; color:var(--muted); letter-spacing:0.5px; }
.footer-about { color:#64748b; font-size:0.87rem; line-height:1.8; margin-top:14px; }
.footer-heading {
  color:#fff;
  font-size:0.9rem;
  font-weight:800;
  margin-bottom:20px;
  position:relative;
  padding-bottom:12px;
}
.footer-heading::after {
  content:'';
  position:absolute;
  left:0; bottom:0;
  width:32px; height:2px;
  background:var(--grad-btn);
  border-radius:2px;
}
.footer-links { list-style:none; padding:0; }
.footer-links li { margin-bottom:10px; }
.footer-links a {
  color:#64748b;
  text-decoration:none;
  font-size:0.87rem;
  display:inline-flex;
  align-items:center;
  gap:6px;
  transition:all 0.25s;
}
.footer-links a:hover { color:var(--gold); padding-left:4px; }
.footer-contact-item {
  display:flex;
  gap:12px;
  margin-bottom:14px;
  align-items:flex-start;
}
.footer-contact-icon {
  width:34px;height:34px;
  border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  font-size:0.85rem;
  flex-shrink:0;
  background:rgba(245,166,35,0.1);
  color:var(--gold);
}
.footer-contact-text { color:#64748b; font-size:0.85rem; line-height:1.5; }
.footer-social { display:flex; gap:10px; margin-top:6px; }
.footer-social a {
  width:38px;height:38px;
  border-radius:10px;
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.08);
  display:flex;align-items:center;justify-content:center;
  color:#64748b;
  font-size:0.9rem;
  text-decoration:none;
  transition:all 0.25s;
}
.footer-social a:hover {
  background:rgba(245,166,35,0.15);
  border-color:rgba(245,166,35,0.4);
  color:var(--gold);
  transform:translateY(-3px);
}
.footer-divider { border-color:rgba(255,255,255,0.06); margin:0; }
.footer-bottom { padding:20px 0; }
.footer-copy { color:#475569; font-size:0.82rem; }

/* ============ ANIMATIONS ============ */
.fade-up {
  opacity:0;
  transform:translateY(30px);
  transition:opacity 0.7s ease, transform 0.7s ease;
}
.fade-up.visible { opacity:1; transform:translateY(0); }
.fade-left {
  opacity:0;
  transform:translateX(-30px);
  transition:opacity 0.7s ease, transform 0.7s ease;
}
.fade-left.visible { opacity:1; transform:translateX(0); }
.fade-right {
  opacity:0;
  transform:translateX(30px);
  transition:opacity 0.7s ease, transform 0.7s ease;
}
.fade-right.visible { opacity:1; transform:translateX(0); }

/* ============ CONTACT PAGE ============ */
.form-control-v2 {
  background:#f8faff;
  border:1.5px solid #e2e8f0;
  border-radius:12px;
  padding:13px 18px;
  font-size:0.9rem;
  color:#0f172a;
  transition:all 0.25s;
  width:100%;
}
.form-control-v2:focus {
  outline:none;
  border-color:var(--gold);
  box-shadow:0 0 0 4px rgba(245,166,35,0.1);
  background:#fff;
}
.form-label-v2 { font-size:0.85rem; font-weight:700; color:#374151; margin-bottom:7px; display:block; }
.btn-form-submit {
  background:var(--grad-btn);
  color:#fff;
  font-weight:800;
  padding:15px;
  border-radius:14px;
  font-size:0.95rem;
  border:none;
  width:100%;
  display:flex;align-items:center;justify-content:center;gap:8px;
  transition:all 0.3s;
  cursor:pointer;
}
.btn-form-submit:hover {
  box-shadow:0 8px 30px rgba(245,166,35,0.45);
  transform:translateY(-2px);
  color:#fff;
}
.contact-info-box {
  background:linear-gradient(135deg,var(--dark2),var(--dark3));
  border:1px solid rgba(255,255,255,0.08);
  border-radius:24px;
  padding:40px 32px;
  height:100%;
  position:relative;
  overflow:hidden;
}
.contact-info-box::before {
  content:'';
  position:absolute;
  top:-50%;right:-30%;
  width:300px;height:300px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(245,166,35,0.08),transparent);
}
.contact-icon-box {
  width:52px;height:52px;
  border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  font-size:1.2rem;
  flex-shrink:0;
}

/* ============ ABOUT PAGE ============ */
.value-card {
  background:#fff;
  border-radius:18px;
  border:1px solid #e2e8f0;
  padding:32px 26px;
  text-align:center;
  transition:all 0.3s;
  height:100%;
}
.value-card:hover { transform:translateY(-6px); box-shadow:0 20px 50px rgba(0,0,0,0.08); border-color:rgba(245,166,35,0.3); }
.value-icon {
  width:72px;height:72px;
  border-radius:20px;
  display:flex;align-items:center;justify-content:center;
  font-size:2rem;
  margin:0 auto 18px;
}
.team-card-v2 {
  background:#fff;
  border-radius:18px;
  border:1px solid #e2e8f0;
  padding:32px 24px;
  text-align:center;
  transition:all 0.35s;
  position:relative;
  overflow:hidden;
}
.team-card-v2::before {
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:80px;
}
.team-card-v2:hover { transform:translateY(-8px); box-shadow:0 24px 60px rgba(0,0,0,0.1); }
.team-avatar-v2 {
  width:88px;height:88px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:2.2rem;
  margin:0 auto 16px;
  position:relative;
  z-index:1;
  border:4px solid #fff;
  box-shadow:0 6px 20px rgba(0,0,0,0.1);
}
.team-name-v2 { font-size:1rem;font-weight:800;color:#0f172a; }
.team-role-v2 { font-size:0.8rem;color:#64748b;margin-top:4px; }

/* ============ SOLUTION CARDS ============ */
.sol-card {
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.07);
  border-radius:20px;
  padding:34px 28px;
  transition:all 0.35s;
  height:100%;
  position:relative;
  overflow:hidden;
}
.sol-card::before {
  content:'';
  position:absolute;
  inset:0;
  opacity:0;
  transition:opacity 0.4s;
  border-radius:20px;
}
.sol-card:hover { border-color:rgba(245,166,35,0.3); transform:translateY(-6px); }
.sol-card:hover::before { opacity:1; }
.sol-num {
  font-size:4rem;font-weight:900;
  position:absolute;top:16px;right:20px;
  opacity:0.05;
  background:var(--grad);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  line-height:1;
}
.sol-icon { width:60px;height:60px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:1.6rem;margin-bottom:18px; }
.sol-title { font-size:1.05rem;font-weight:800;color:#fff;margin-bottom:10px; }
.sol-desc  { font-size:0.85rem;color:#64748b;line-height:1.7;margin-bottom:16px; }

/* ============ RESPONSIVE ============ */
@media(max-width:991px){
  .hero-content { padding-top:100px; }
  .years-visual { padding-top:40px; }
  .years-orb { width:280px;height:280px; }
  .years-num { font-size:5.5rem; }
  .hero-stats-row { gap:20px; flex-wrap:wrap; }
}
@media(max-width:767px){
  .hero-title { font-size:2rem; }
  .hero-btns { flex-direction:column; }
  .btn-primary-umniah,.btn-outline-umniah { text-align:center;justify-content:center; }
  .years-orb { width:220px;height:220px; }
  .years-num { font-size:4.2rem; }
  .years-label { font-size:1rem;letter-spacing:5px; }
  .hero-stats-row { display:none; }
}


element.style {
   background: rgb(245 166 35 / 68%) !important;
}