
*{cursor:none !important}
html,body{cursor:none !important;margin:0;background:#0a0a0a;color:#f5f0e8;font-family:Inter,sans-serif;overflow-x:hidden}
.font-display{font-family:Space Grotesk,sans-serif}
::selection{background:#B3B428;color:#000}
#loader{position:fixed;inset:0;background:#0a0a0a;z-index:10000;display:flex;flex-direction:column;align-items:center;justify-content:center}
.loader-ump{font-family:Space Grotesk;font-weight:800;font-size:18vw;line-height:0.85;letter-spacing:0.08em;background:linear-gradient(100deg,#B3B428,#FFD700,#FFF176,#B3B428);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:gradMove 2.5s linear infinite}
@keyframes gradMove{0%{background-position:0% 50%}100%{background-position:200% 50%}}
.loader-bar{width:220px;height:2px;background:rgba(255,255,255,0.1);margin-top:28px;overflow:hidden;border-radius:2px}
.loader-fill{height:100%;width:0%;background:linear-gradient(90deg,#B3B428,#FFD700);box-shadow:0 0 12px #B3B428}
.loader-pct{font-family:Space Grotesk;font-size:13px;letter-spacing:0.25em;margin-top:18px;color:#B3B428}
.cursor-dot,.cursor-trail,.cursor-ring{position:fixed;left:0;top:0;pointer-events:none;will-change:transform;opacity:0;z-index:99999;transform:translate3d(-50%,-50%,0)}
.cursor-dot{width:8px;height:8px;border-radius:50%;background:#B3B428;box-shadow:0 0 12px #B3B428,0 0 24px rgba(179,180,40,0.45)}
.cursor-trail{border-radius:50%;background:#B3B428;mix-blend-mode:screen}
.t1{width:10px;height:10px;opacity:0.5}
.t2{width:8px;height:8px;opacity:0.35;filter:hue-rotate(18deg)}
.t3{width:6px;height:6px;opacity:0.22;filter:hue-rotate(36deg)}
.t4{width:4px;height:4px;opacity:0.12;filter:hue-rotate(54deg)}
.cursor-ring{width:36px;height:36px;border-radius:50%;border:1px solid rgba(179,180,40,0.6);transition:width 0.25s,height 0.25s,border-color 0.25s}
.cursor-ready .cursor-dot,.cursor-ready .cursor-trail,.cursor-ready .cursor-ring{opacity:1}
.cursor-hover .cursor-dot{width:14px;height:14px;background:#FFD700;box-shadow:0 0 18px #FFD700}
.cursor-hover .cursor-ring{width:64px;height:64px;border-color:#FFD700;box-shadow:0 0 20px rgba(179,180,40,0.4)}
.magnetic{position:relative;display:inline-flex;align-items:center;justify-content:center;transition:transform 0.15s linear;will-change:transform}
.logo-wrap{position:relative;display:flex;align-items:center;gap:14px;background:transparent;padding:6px 10px;border-radius:12px;border:1px solid rgba(255,255,255,0.06);backdrop-filter:blur(8px);transition:all 0.4s}
.logo-wrap:hover{border-color:rgba(179,180,40,0.3);box-shadow:0 0 20px rgba(179,180,40,0.15);transform:translateY(-2px)}
.logo-img{height:42px;object-fit:contain;filter:drop-shadow(0 2px 8px rgba(0,0,0,0.5)) brightness(1.1) contrast(1.1);background:transparent}
.logo-img-footer{height:72px;object-fit:contain;filter:drop-shadow(0 4px 16px rgba(0,0,0,0.6)) brightness(1.15);background:transparent}
.pillar-card{position:relative;background:#141414;border:1px solid rgba(179,180,40,0.15);border-radius:28px;overflow:hidden;transition:all 0.5s cubic-bezier(.16,1,.3,1);transform-style:preserve-3d}
.pillar-card:hover{border-color:#FFD700;box-shadow:0 0 12px #B3B428,0 0 24px rgba(179,180,40,0.55),0 0 48px rgba(179,180,40,0.2);transform:translateY(-10px) scale(1.02) rotateX(2deg) rotateY(-2deg)}
.pillar-card:hover .card-title{color:#FFD700;text-shadow:0 0 14px #B3B428}
.pillar-card:hover .card-img{transform:scale(1.2)}
.card-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0.5;transition:transform 0.8s cubic-bezier(.16,1,.3,1)}
.alive-o-wrap{display:inline-block;position:relative}
.alive-o{display:inline-block;font-weight:800;background:conic-gradient(from 0deg,#B3B428,#FFD700,#FFF176,#B3B428);-webkit-background-clip:text;background-clip:text;color:transparent;animation:oHue 4s linear infinite}
@keyframes oHue{to{filter:hue-rotate(360deg)}}
.alive-o-glow{position:absolute;inset:-35%;background:radial-gradient(circle,rgba(179,180,40,0.55),transparent 68%);filter:blur(28px);animation:glowBreath 3s ease-in-out infinite;pointer-events:none;z-index:-1}
@keyframes glowBreath{0%,100%{transform:scale(0.85);opacity:0.55}50%{transform:scale(1.3);opacity:0.95}}
.o-shine{position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,0.45),transparent);animation:shine 2.6s ease-in-out infinite}
@keyframes shine{0%{left:-120%}60%,100%{left:220%}}
section{position:relative;z-index:10;background:#0a0a0a}
#hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:130px 5% 90px;overflow:hidden}
.hero-line{overflow:hidden;line-height:0.85}
.hero-line span{display:block;transform:translateY(115%)}
#about{padding:110px 5%;display:grid;grid-template-columns:1.15fr 0.85fr;gap:64px}
#pin-section{position:relative}
#pillars-sticky{position:relative}
#pillars-track{display:flex;gap:28px;padding:40px 5%;box-sizing:border-box;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
#pillars-track::-webkit-scrollbar{display:none}
.pillar-card{flex:0 0 auto}
.pillars-pin-active #pillars-sticky{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.pillars-pin-active #pillars-track{overflow-x:visible;will-change:transform}
#contact{position:relative;z-index:20;background:#0a0a0a;min-height:100vh;padding:150px 5% 90px;overflow:visible}
.progress-bar{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,#B3B428,#FFD700);width:0%;z-index:9999;box-shadow:0 0 10px #B3B428}
.grain{position:fixed;inset:0;pointer-events:none;opacity:0.035;z-index:2;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="220" height="220"><filter id="n"><feTurbulence baseFrequency="0.85"/></filter><rect width="100%" height="100%" filter="url(%23n)"/></svg>')}
.nav-btn{padding:12px 24px;border-radius:999px;font-weight:700;font-size:12px;letter-spacing:0.05em;transition:all 0.3s;display:inline-flex;align-items:center;gap:8px}
.nav-btn-primary{background:linear-gradient(100deg,#B3B428,#FFD700);color:#000;box-shadow:0 4px 16px rgba(179,180,40,0.3);border:none}
.nav-btn-primary:hover{box-shadow:0 0 18px #B3B428,0 0 32px rgba(179,180,40,0.5)}
.nav-link{font-size:12px;opacity:0.8;letter-spacing:0.08em;transition:all 0.3s;color:#f5f0e8;text-decoration:none}
.nav-link:hover{opacity:1;color:#FFD700;text-shadow:0 0 10px #B3B428}
.social-btn{width:50px;height:50px;border-radius:50%;background:linear-gradient(145deg,#1a1a1a,#141414);display:grid;place-items:center;border:1px solid rgba(255,255,255,0.1);transition:all 0.4s;color:#f5f0e8;text-decoration:none;font-weight:700;font-size:12px;box-shadow:0 4px 12px rgba(0,0,0,0.3)}
.social-btn:hover{border-color:#FFD700;box-shadow:0 0 16px #B3B428,0 0 32px rgba(179,180,40,0.3);transform:translateY(-4px) scale(1.05);background:linear-gradient(145deg,#1e1e1a,#1a1a14)}
.reveal{opacity:0;transform:translateY(40px)}

/* FIX card text clipping */
.pillar-card{overflow:hidden}
.pillar-card > div{box-sizing:border-box;padding-bottom:36px !important}
.card-bottom-text{position:relative;margin-top:auto !important;padding-top:20px;background:linear-gradient(to top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.4) 60%, transparent 100%);margin-left:-30px;margin-right:-30px;margin-bottom:-36px;padding-left:30px;padding-right:30px;padding-bottom:24px;border-radius:0 0 28px 28px}


/* Stats row + Marquee bar */
.stats-row{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:20px;margin-top:60px}
.stat-card{background:linear-gradient(145deg,#1a1a1a,#141414);border:1px solid rgba(255,255,255,0.08);border-radius:20px;padding:22px 26px;display:flex;justify-content:space-between;align-items:center;transition:all 0.4s;position:relative;overflow:hidden}
.stat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#B3B428,transparent);opacity:0;transition:opacity 0.4s}
.stat-card:hover{border-color:rgba(179,180,40,0.3);transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,0.4),0 0 20px rgba(179,180,40,0.1)}
.stat-card:hover::before{opacity:1}
.stat-label{font-size:10px;letter-spacing:0.22em;opacity:0.5;font-family:Space Grotesk}
.stat-value{font-family:Space Grotesk;font-weight:800;font-size:28px;letter-spacing:-0.02em}
.marquee-section{position:relative;margin-top:48px;border-top:1px solid rgba(255,255,255,0.07);border-bottom:1px solid rgba(255,255,255,0.07);background:linear-gradient(90deg,#0a0a0a,#111,#0a0a0a);overflow:hidden;padding:14px 0}
.marquee-track{display:flex;gap:0;white-space:nowrap;will-change:transform}
.marquee-item{display:flex;align-items:center;gap:28px;padding-right:28px;font-family:Space Grotesk;font-size:13px;letter-spacing:0.18em;color:rgba(245,240,232,0.6)}
.marquee-item b{color:#f5f0e8;font-weight:700}
.marquee-dot{width:28px;height:28px;border-radius:50%;background:#1a1a1a;border:1px solid rgba(255,255,255,0.1);display:grid;place-items:center;font-size:12px;flex-shrink:0}
.marquee-item.highlight{color:#B3B428}



/* === UMP FINAL - Responsive Fixes & Enhancements === */
:root{
  --olive:#B3B428;
  --gold:#FFD700;
  --bg:#0a0a0a;
  --card:#141414;
}

/* Base improvements */
html{scroll-behavior:smooth}
body{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility }
a{color:inherit}
a.pillar-card{ text-decoration:none; color:inherit; display:block }

/* Nav mobile */
.hamburger{ display:none; width:42px; height:42px; border-radius:50%; background:#141414; border:1px solid rgba(255,255,255,0.1); place-items:center; cursor:pointer }
.hamburger span{ display:block; width:18px; height:2px; background:#f5f0e8; margin:3px 0; transition:0.3s }
.mobile-menu{ position:fixed; inset:0; background:rgba(10,10,10,0.96); backdrop-filter:blur(20px); z-index:39; display:flex; flex-direction:column; padding:90px 6% 40px; transform:translateY(-100%); opacity:0; transition:all 0.5s cubic-bezier(.16,1,.3,1); pointer-events:none }
.mobile-menu.open{ transform:translateY(0); opacity:1; pointer-events:auto }
.mobile-menu a{ font-family:Space Grotesk; font-size:32px; font-weight:700; padding:14px 0; border-bottom:1px solid rgba(255,255,255,0.06); text-decoration:none; color:#f5f0e8 }
.mobile-menu a small{ display:block; font-size:11px; letter-spacing:0.2em; opacity:0.5; margin-bottom:4px; font-family:Inter }

/* Page headers for inner pages */
.page-hero{ min-height:62vh; display:flex; flex-direction:column; justify-content:flex-end; padding:140px 5% 70px; position:relative; overflow:hidden }
.page-hero h1{ font-family:Space Grotesk; font-size: clamp(42px, 8vw, 92px); line-height:0.9; letter-spacing:-0.03em; margin:0 }
.page-hero p{ max-width:620px; margin-top:22px; line-height:1.7; opacity:0.75 }
.content-grid{ display:grid; grid-template-columns:1fr 1fr; gap:56px; padding:80px 5% }
.content-block{ background:#141414; border:1px solid rgba(255,255,255,0.06); border-radius:22px; padding:32px }
.content-block h3{ font-family:Space Grotesk; font-size:22px; margin:0 0 12px }
.content-block p, .content-block li{ line-height:1.7; opacity:0.8; font-size:15px }
.service-list{ list-style:none; padding:0; margin:18px 0 0 }
.service-list li{ padding:10px 0; border-bottom:1px solid rgba(255,255,255,0.06); display:flex; gap:12px }
.service-list li::before{ content:'↗'; color:var(--olive); font-weight:800 }

/* Responsive */
@media (max-width: 1024px){
  #about{ grid-template-columns:1fr; gap:40px }
  .stats-row{ grid-template-columns:1fr; }
  .content-grid{ grid-template-columns:1fr }
  .contact-form-grid{ grid-template-columns:1fr !important; gap:32px !important }
  .services-grid{ grid-template-columns:1fr !important }
}
.services-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:28px }

@media (max-width: 768px){
  /* Restore cursor on mobile - critical fix */
  *{ cursor:auto !important }
  html,body{ cursor:auto !important }
  .cursor-dot,.cursor-trail,.cursor-ring{ display:none !important }
  .magnetic{ transform:none !important }
  
  /* Nav */
  nav > div:last-child .nav-link{ display:none }
  .hamburger{ display:grid }
  .logo-wrap span{ display:none }
  .logo-img{ height:36px }
  
  /* Hero */
  #hero{ padding:110px 5% 60px; min-height:auto }
  #hero div.font-display{ font-size:14vw !important }
  .hero-fade{ flex-wrap:wrap }
  
  /* Pillars - disable horizontal pin */
  #pin-section{ padding-bottom:0 }
  #pillars-track{ gap:16px; padding:24px 5% }
  #pillars-track::-webkit-scrollbar{ display:none }
  .pillar-card{ width:82vw !important; min-width:82vw !important; height:60vh !important }
  .pillar-card > div{ height:auto !important }
  
  /* About image */
  #about .about-right img{ height:380px !important }
  #about .about-right div[style*="position:absolute"]{ left:10px !important; bottom:-12px !important }
  
  /* Contact */
  #contact{ padding:80px 5% 60px; min-height:auto }
  #contact > div:first-child{ grid-template-columns:1fr !important; gap:36px !important }
  .contact-card{ padding:24px !important }
  
  /* Page hero */
  .page-hero{ min-height:auto; padding:120px 5% 50px }
  .content-grid{ padding:40px 5%; gap:28px }
  
  /* Footer */
  #contact > div:last-child{ flex-direction:column; align-items:flex-start !important; gap:18px }
  
  /* Marquee */
  .marquee-section{ margin-top:30px }
}
@media (max-width: 480px){
  .pillar-card{ min-height:380px }
  .stat-card{ padding:18px 20px }
  .stat-value{ font-size:22px }
}

/* failsafe - if loader stuck, force hide after 4s via CSS */
@keyframes forceHideLoader { to { transform: translateY(-100%); } }
#loader{ animation: forceHideLoader 0.8s forwards; animation-delay: 4s; }
@media (max-width: 768px){
  *{ cursor:auto !important }
  html,body{ cursor:auto !important }
  .cursor-dot,.cursor-trail,.cursor-ring{ display:none !important }
}

/* Hamburger nicer with animation */
.hamburger{
  width:46px; height:46px;
  border-radius:50%;
  background:linear-gradient(145deg,#1a1a1a,#141414);
  border:1px solid rgba(255,255,255,0.12);
  place-items:center;
  cursor:pointer;
  transition:all 0.4s cubic-bezier(.16,1,.3,1);
  position:relative;
  box-shadow:0 4px 12px rgba(0,0,0,0.3);
}
.hamburger:hover{
  border-color:rgba(179,180,40,0.4);
  box-shadow:0 0 16px rgba(179,180,40,0.2);
  transform:translateY(-1px);
}
.hamburger div{
  width:20px; display:flex; flex-direction:column; gap:4px;
}
.hamburger span{
  display:block; width:20px; height:2px;
  background:#f5f0e8;
  border-radius:2px;
  transition:all 0.4s cubic-bezier(.16,1,.3,1);
  transform-origin:center;
}
.hamburger.active span:nth-child(1){
  transform:translateY(6px) rotate(45deg);
}
.hamburger.active span:nth-child(2){
  opacity:0; transform:scaleX(0);
}
.hamburger.active span:nth-child(3){
  transform:translateY(-6px) rotate(-45deg);
}
.hamburger.active{
  background:linear-gradient(145deg,#1e1e1a,#1a1a14);
  border-color:rgba(179,180,40,0.5);
}

/* Mobile menu nicer with blur and stagger */
.mobile-menu{
  backdrop-filter:blur(24px) !important;
  background:rgba(10,10,10,0.92) !important;
}
.mobile-menu a{
  opacity:0; transform:translateY(20px);
  transition:all 0.5s cubic-bezier(.16,1,.3,1);
}
.mobile-menu.open a{
  opacity:1; transform:translateY(0);
}
.mobile-menu.open a:nth-child(1){ transition-delay:0.05s }
.mobile-menu.open a:nth-child(2){ transition-delay:0.1s }
.mobile-menu.open a:nth-child(3){ transition-delay:0.15s }
.mobile-menu.open a:nth-child(4){ transition-delay:0.2s }
.mobile-menu.open a:nth-child(5){ transition-delay:0.25s }
.mobile-menu.open a:nth-child(6){ transition-delay:0.3s }
.mobile-menu.open a:nth-child(7){ transition-delay:0.35s }


/* === UMP LIVE WAVE BACKGROUND - Added per user request === */
.ump-live-bg-wrap{
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
  background:#0a0a0a;
}
.ump-live-bg{
  position:absolute;
  inset:-20%;
  background-image:url('wave-bg.jpg');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  opacity:0.52;
  will-change:transform;
  animation: umpWaveDrift 24s ease-in-out infinite alternate;
}
.ump-live-bg-2{
  position:absolute;
  inset:-15%;
  background-image:url('wave-bg.jpg');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  opacity:0.16;
  mix-blend-mode:screen;
  filter: blur(0.8px) brightness(1.35);
  will-change:transform;
  animation: umpWaveDrift2 32s ease-in-out infinite alternate-reverse;
}
.ump-live-overlay{
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse at 30% 20%, rgba(179,180,40,0.07), transparent 55%),
    radial-gradient(ellipse at 80% 80%, rgba(179,180,40,0.05), transparent 50%),
    linear-gradient(180deg, rgba(10,10,10,0.15) 0%, rgba(10,10,10,0.65) 100%);
}
@keyframes umpWaveDrift{
  0%{ transform: scale(1) translate3d(0,0,0) rotate(0deg); }
  35%{ transform: scale(1.07) translate3d(-1.2%,0.8%,0) rotate(0.4deg); }
  70%{ transform: scale(1.12) translate3d(1.1%,-0.9%,0) rotate(-0.4deg); }
  100%{ transform: scale(1.08) translate3d(0.6%,0.6%,0) rotate(0.2deg); }
}
@keyframes umpWaveDrift2{
  0%{ transform: scale(1.05) translate3d(0,0,0) rotate(0deg); }
  50%{ transform: scale(1.15) translate3d(1.5%,1%,0) rotate(0.8deg); }
  100%{ transform: scale(1.1) translate3d(-1%,-1.2%,0) rotate(-0.6deg); }
}

/* Make sections transparent to show live bg, keep cards opaque */
body{ background:#0a0a0a; }
section, .page-hero, #hero, #about, #pin-section{ background: transparent !important; position:relative; z-index:2; }
#contact{ background: transparent !important; position:relative; z-index:2; }
.grain{ z-index:1 !important; }

/* Ensure cards and content-blocks stay opaque as before */
.pillar-card, .content-block, .contact-card, .stat-card{ background:#141414; }

/* Fix bottom gap - no space at bottom */
html, body{ margin:0 !important; padding:0 !important; min-height:100%; }
body{ padding-bottom:0 !important; }
section:last-of-type{ margin-bottom:0 !important; }
#contact{ margin-bottom:0 !important; padding-bottom:40px !important; }
#contact > div:last-child{ margin-bottom:0 !important; }

/* Responsive tweaks */
@media (max-width:768px){
  .ump-live-bg{ animation-duration: 28s; opacity:0.42; }
  .ump-live-bg-2{ display:none; }
}
@media (prefers-reduced-motion: reduce){
  .ump-live-bg, .ump-live-bg-2{ animation:none !important; }
}




/* CLEAN FIXES */
.logo-wrap{background:transparent!important;border:none!important;padding:0!important;}
.logo-img,.logo-img-footer{background:transparent!important;}
#contactForm{width:100%!important;max-width:100%!important;box-sizing:border-box!important}
.input-error{ border-color:#ff5c5c !important; background:rgba(255,92,92,0.06) !important }
.field-error{ color:#ff8a8a; font-size:12px; line-height:1.4; margin-top:-8px; padding-left:2px }
section#contact{padding:40px 5% 30px!important;min-height:auto!important}

/* === V2 initial scroll repaint fix === */
#loader{
  pointer-events:none !important;
  animation:none !important;
  transform:none !important;
  transition:opacity .24s ease, visibility .24s ease !important;
  will-change:opacity;
}
#loader.loader-hidden{
  opacity:0 !important;
  visibility:hidden !important;
}
