/* Fundwise Wealth v1.1.2 — visual-first MSME homepage polish
   Direct 30/70 media stage, institution logo marquee, shorter CIBIL nav label,
   and a more ownable editorial motion language without template-like effects. */
:root{--v112-ease:cubic-bezier(.2,.78,.18,1);--v112-teal:#0b9298;--v112-teal-2:#5fe2da;--v112-navy:#061a33;--v112-ink:#102b43;--v112-amber:#c58a35}

/* Header polish: the shorter CIBIL label gets proper breathing room. */
.v111-nav .cibil-nav-link{min-width:112px;max-width:132px;line-height:1.15!important}
.v111-nav>a,.v111-nav .nav-mega-trigger>a{position:relative}
@media(min-width:1181px){
  .v111-nav>a::after,.v111-nav .nav-mega-trigger>a::after{content:"";position:absolute;left:8px;right:8px;bottom:18px;height:1px;background:var(--v112-teal);transform:scaleX(0);transform-origin:right;transition:transform .28s var(--v112-ease)}
  .v111-nav>a:hover::after,.v111-nav>a:focus-visible::after,.v111-nav .nav-mega-trigger>a:hover::after,.v111-nav .nav-mega-trigger>a:focus-visible::after,.v111-nav>a.active::after,.v111-nav .nav-mega-trigger>a.active::after{transform:scaleX(1);transform-origin:left}
  .v111-header.is-scrolled .v111-nav>a::after,.v111-header.is-scrolled .v111-nav .nav-mega-trigger>a::after{bottom:14px}
}

/* Homepage starts visually: no editorial text block before media. */
.v112-hero{padding:18px 0 46px;overflow:hidden;isolation:isolate}
.v112-hero::before{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(112deg,transparent 0 35%,rgba(95,226,218,.035) 35.15% 35.5%,transparent 35.7% 64%,rgba(95,226,218,.03) 64.15% 64.5%,transparent 64.7%);pointer-events:none}
.v112-hero::after{content:"";position:absolute;z-index:2;left:50%;top:0;width:min(1280px,calc(100% - 44px));height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(95,226,218,.38),transparent);opacity:.85;pointer-events:none}
.v112-hero .media-stage{position:relative;z-index:3;grid-template-columns:minmax(0,3fr) minmax(0,7fr);gap:12px}
.v112-hero .media-stage::before{content:"";position:absolute;z-index:10;left:calc(30% - 1px);top:16%;width:1px;height:68%;background:linear-gradient(180deg,transparent,rgba(95,226,218,.72),transparent);pointer-events:none;opacity:.6}
.v112-hero .media-carousel{height:458px;border-color:rgba(255,255,255,.12);box-shadow:0 26px 64px rgba(0,9,22,.2)}
.v112-hero .campaign-carousel{border-radius:12px 3px 3px 12px}
.v112-hero .video-spotlight{border-radius:3px 12px 12px 3px}
.v112-hero .campaign-slide::after{inset:38% 0 0;background:linear-gradient(180deg,transparent,rgba(3,17,33,.9))}
.v112-hero .video-spotlight-slide::after{inset:36% 0 0;background:linear-gradient(180deg,transparent,rgba(2,15,29,.9))}
.v112-hero .media-slide[aria-hidden="false"] img{transform:scale(1.018)}
.v112-hero .campaign-caption{bottom:28px}
.v112-hero .video-lower-third{bottom:34px;left:37px;right:118px}
.v112-hero .video-lower-third h2{font-size:clamp(30px,2.7vw,42px);max-width:720px}
.v112-hero .video-lower-third p{font-size:12px;max-width:640px}
.v112-hero .media-arrows button{border-radius:2px}
.v112-hero .media-dot{height:2px}

/* Give the media stage an ownable Fundwise line-motion cue without decorative clutter. */
.v112-hero .video-spotlight::before{content:"";position:absolute;z-index:3;left:-30%;top:-5%;width:34%;height:115%;pointer-events:none;background:linear-gradient(110deg,transparent 0 45%,rgba(95,226,218,.16) 46% 47%,rgba(95,226,218,.025) 48% 62%,transparent 63%);transform:translateX(-80%)}
.v112-hero.is-visible .video-spotlight::before{animation:v112StageFlow 1.1s var(--v112-ease) .12s both}
@keyframes v112StageFlow{0%{opacity:0;transform:translateX(-80%)}25%{opacity:1}100%{opacity:0;transform:translateX(410%)}}

/* Credibility follows media immediately and feels like a rail, not cards. */
.v112-hero + .credibility-rail{border-top:0}
.credibility-grid>div{position:relative}
.credibility-grid>div::before{content:"";position:absolute;left:0;top:0;width:0;height:2px;background:var(--v112-teal);transition:width .5s var(--v112-ease)}
.credibility-rail.is-visible .credibility-grid>div::before{width:42px}

/* Less generic mega-menu interaction: text moves, not cards. */
.v111-header .mega-columns a,.v111-header .business-columns a,.v111-header .company-child-grid a{transition:padding-left .2s var(--v112-ease),color .2s ease,background .2s ease}
@media(min-width:1181px){
  .v111-header .mega-columns a:hover,.v111-header .mega-columns a:focus-visible,.v111-header .business-columns a:hover,.v111-header .business-columns a:focus-visible{padding-left:6px!important;color:var(--v112-teal)!important}
  .v111-header .company-child-grid a:hover,.v111-header .company-child-grid a:focus-visible{transform:none!important;color:var(--v112-teal)!important}
}

/* Editorial button motion instead of bounce/lift. */
.button{position:relative;overflow:hidden;isolation:isolate}
.button::after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(105deg,transparent 0 42%,rgba(255,255,255,.16) 48%,transparent 54%);transform:translateX(-135%);transition:transform .48s var(--v112-ease);pointer-events:none}
.button:hover::after,.button:focus-visible::after{transform:translateX(135%)}

/* Institution logo marquee — actual Admin logos are used whenever present.
   Names are a graceful fallback only when a logo has not yet been uploaded. */
.institution-marquee-section{overflow:hidden;background:#f7faf9;border-top:1px solid #e1e9e9;border-bottom:1px solid #e1e9e9;padding-top:58px;padding-bottom:42px}
.institution-marquee-section .compact-head{margin-bottom:25px}
.institution-marquee-section .compact-head h2{max-width:620px}
.institution-marquee-shell{position:relative;margin-inline:calc(50% - 50vw);overflow:hidden;border-top:1px solid #dfe8e8;border-bottom:1px solid #dfe8e8;background:#fff;mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%)}
.institution-marquee-track{display:flex;width:max-content;will-change:transform;animation:v112BankRail 34s linear infinite}
.institution-marquee-shell:hover .institution-marquee-track,.institution-marquee-shell:focus-within .institution-marquee-track{animation-play-state:paused}
.institution-logo-set{display:flex;align-items:center;gap:0;flex:0 0 auto}
.institution-logo-item{display:flex;align-items:center;justify-content:center;min-width:220px;height:104px;padding:18px 31px;border-right:1px solid #e4ebeb;text-decoration:none;color:var(--v112-ink);background:#fff;transition:background .2s ease,color .2s ease}
.institution-logo-item img{display:block;max-width:156px;max-height:51px;width:auto;height:auto;object-fit:contain;filter:grayscale(.7) saturate(.7);opacity:.8;transition:filter .24s ease,opacity .24s ease,transform .24s var(--v112-ease)}
.institution-logo-item:hover img,.institution-logo-item:focus-visible img{filter:none;opacity:1;transform:scale(1.035)}
.institution-logo-fallback{display:flex;align-items:center;gap:11px;white-space:nowrap}
.institution-logo-fallback i{display:grid;place-items:center;min-width:39px;height:39px;padding:0 7px;border:1px solid #cbdadb;color:var(--v112-teal);font-style:normal;font-size:11px;font-weight:900;letter-spacing:.05em}
.institution-logo-fallback b{font-size:13px;line-height:1.2;font-weight:750}
.institution-marquee-section .legal-note{margin-top:16px;margin-bottom:0;text-align:center}
@keyframes v112BankRail{to{transform:translateX(-50%)}}

/* More polished active state in the signature business-need interaction. */
.need-tabs button[aria-selected=true]{background:linear-gradient(90deg,rgba(11,146,152,.095),rgba(11,146,152,.025));color:#063d45}
.need-panels article h3{text-wrap:balance}

@media(max-width:1180px){
  .v111-nav .cibil-nav-link{min-width:0;max-width:none}
  .v112-hero{padding-top:14px;padding-bottom:38px}
  .v112-hero .media-stage{grid-template-columns:minmax(0,34fr) minmax(0,66fr)}
  .v112-hero .media-stage::before{left:34%}
  .v112-hero .media-carousel{height:420px}
}
@media(max-width:820px){
  .v112-hero{padding:12px 0 30px}
  .v112-hero .media-stage{grid-template-columns:1fr;gap:10px}
  .v112-hero .media-stage::before{display:none}
  .v112-hero .media-carousel{height:370px;border-radius:9px}
  .v112-hero .campaign-carousel{height:350px}
  .v112-hero .video-lower-third{left:24px;right:76px;bottom:28px}
  .institution-logo-item{min-width:190px;height:92px;padding:16px 24px}
  .institution-logo-item img{max-width:138px;max-height:46px}
  .institution-marquee-track{animation-duration:30s}
}
@media(max-width:640px){
  .v112-hero{padding-top:8px;padding-bottom:24px}
  .v112-hero .media-carousel,.v112-hero .campaign-carousel{height:330px}
  .v112-hero .video-lower-third{left:19px;right:19px;bottom:23px}
  .v112-hero .video-lower-third h2{font-size:27px}
  .institution-marquee-section{padding-top:44px;padding-bottom:34px}
  .institution-logo-item{min-width:164px;height:82px;padding:13px 19px}
  .institution-logo-item img{max-width:122px;max-height:40px}
  .institution-logo-fallback b{font-size:11px}.institution-logo-fallback i{min-width:34px;height:34px;font-size:10px}
  .institution-marquee-track{animation-duration:27s}
}
@media(prefers-reduced-motion:reduce){
  .v112-hero.is-visible .video-spotlight::before,.institution-marquee-track{animation:none!important}
  .institution-marquee-shell{overflow-x:auto;mask-image:none;-webkit-mask-image:none;scrollbar-width:thin}
  .institution-logo-set:nth-child(2){display:none}
  .button::after{display:none}
}