#dpip-animation{position:relative;padding:4vh;width:100%;height:100%;max-height:100%;max-width:100%;display:grid;grid-template-columns:1fr 2fr 1fr;grid-template-rows:auto;grid-gap:24px;gap:24px;grid-template-areas:"txn-source-wrapper dpip-txn-analyser txn-destination-wrapper";@media screen and (max-width:600px){padding-left:0;padding-bottom:0;padding-right:0;padding-top:0;gap:var(--nano)}#txn-source-wrapper{grid-area:txn-source-wrapper;position:relative}.txn-source-card{width:160px;overflow:hidden;@media screen and (max-width:600px){width:100px}header{padding:16px 16px 4px;@media screen and (max-width:600px){padding-left:4px;padding-bottom:4px;padding-right:4px;padding-top:4px}}footer{background-color:hsl(var(--sand));padding:8px}&.verified{background-color:var(--green-light60);border:1px solid var(--green-dark40);footer{background-color:var(--green-light40)}}&.flagged{background-color:hsl(var(--vermilion));border:1px solid var(--red-dark40);*{color:var(--white)}footer{background-color:var(--red-light40)}}}#dpip-txn-analyser{grid-area:dpip-txn-analyser;background:linear-gradient(to bottom right,var(--indigo-light40),var(--sky-light10));display:flex;flex-direction:column;position:relative;overflow:hidden;min-height:400px;border-radius:12px;border:4px solid var(--blue);--spinner-border:var(--white);&:before{content:"";position:absolute;top:0;left:0;right:0;height:80px;background:linear-gradient(180deg,transparent 0,var(--blue-light20-opacity80) 48%,var(--blue-light20) 50%,var(--blue-light20-opacity80) 52%,transparent 100%);animation:scanning 2s ease-in-out infinite alternate;z-index:1;pointer-events:none;will-change:transform}#dpip-platform-wrapper{margin-top:auto;position:relative;z-index:15}#dpip-platform-card{display:flex;flex-direction:column;gap:12px;position:relative;z-index:15;background-color:var(--blue-light60);@media screen and (max-width:600px){padding-left:4px;padding-bottom:4px;padding-right:4px;padding-top:4px}[data-meter-meta]{margin:0;p{font-weight:400;font-size:14px}}}#dpip-data-sources{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;@media screen and (max-width:600px){padding-left:0;padding-bottom:0;padding-right:0;padding-top:0}}.data-source-badge{display:flex;align-items:center;justify-content:space-between;width:-moz-fit-content;width:fit-content;gap:8px;padding:4px 8px;border-width:1px;border-style:solid;@media screen and (max-width:600px){gap:4px}}}#txn-destination-wrapper{grid-area:txn-destination-wrapper}.flying-transaction{position:absolute;z-index:10;top:0;left:0;pointer-events:none}}@keyframes scanning{0%{transform:translateY(-80px)}to{transform:translateY(400px)}}#how-dpip-works{background:linear-gradient(to bottom,var(--amber-light70),var(--amber-light80));#animation-wrapper{height:100%}#animation-inner-content{display:flex;justify-content:center;align-items:center;border:transparent;background:linear-gradient(to bottom,var(--slate-light90-opacity90),var(--slate-light90-opacity40))}.hiw-step-card{display:flex;flex-direction:column;gap:var(--nano);border:1px solid var(--amber-light20);background-color:transparent;cursor:pointer;transition:border .2s ease;overflow:hidden;.hiw-step-heading{transition:font-weight .2s ease}.hiw-step-text{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s cubic-bezier(.4,0,.2,1),opacity .3s ease;opacity:0;>*{overflow:hidden}}&.active{border:2px solid hsl(var(--turmeric));.hiw-step-heading{font-weight:700}.hiw-step-text{grid-template-rows:1fr;opacity:1}}}}#dpip-step1-animation{display:flex;flex-direction:column;gap:100px;position:relative;.entity-card{aspect-ratio:1/1;width:80px;display:flex;align-items:center;justify-content:center;z-index:20;svg{width:40px}}#bank-card{aspect-ratio:auto;z-index:20}.metadata-card{width:32px;height:32px;display:flex;justify-content:center;align-items:center;position:relative;z-index:20}.animated-metadata-card{pointer-events:none}#dpip-nodes-wrapper{display:flex;gap:16px;.entity-card{background:linear-gradient(to bottom,var(--blue-light70),var(--blue-light80))}.entity-card:before{content:"";position:absolute;width:2px;height:100px;top:-100px;background:linear-gradient(to bottom,var(--blue-light70),var(--blue-light90));z-index:1}.entity-card.with-glow-animation:after{content:"";position:absolute;width:2px;height:16px;top:-100px;left:50%;transform:translateX(-50%);background:linear-gradient(to bottom,transparent,var(--sky-light40),var(--sky),transparent);box-shadow:0 0 6px var(--sky),0 0 20px var(--sky-opacity50);z-index:10;animation:glowTravel 2s ease-in-out infinite;animation-delay:calc(var(--glow-delay, 0) * .3s)}.entity-card:first-child.with-glow-animation:after{--glow-delay:0}.entity-card:nth-child(2).with-glow-animation:after{--glow-delay:1}.entity-card:nth-child(3).with-glow-animation:after{--glow-delay:2}}}@keyframes glowTravel{0%{top:-100px;opacity:0}10%{opacity:1}90%{opacity:1}to{top:-10px;opacity:0}}#step2-animation{display:flex;justify-content:center;align-items:center;position:relative;#animation-wrapper{display:grid;grid-template-columns:repeat(2,140px);grid-template-rows:repeat(2,140px);grid-gap:64px;gap:64px;position:relative}.bank-card{display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:16px}.model-weights-card{width:64px;height:64px;aspect-ratio:1;display:flex;justify-content:center;align-items:center;padding:4px;margin-top:21px;&:after{opacity:0;content:"";width:24px;height:24px;border-radius:4px;position:absolute;top:-8px;right:-8px;z-index:1;background-color:var(--red-light90);border:1px solid var(--red);transition:opacity .3s ease}&.selected:after{opacity:1}}.lock-icon{opacity:0;position:absolute;top:-4px;right:-4px;width:16px;height:16px;z-index:5;transition:opacity .3s ease}.model-weights-icon{width:54px;height:54px;margin-top:2px}}#step3-animation{display:flex;justify-content:center;align-items:center;min-height:400px;#platform-card{width:320px!important;padding:16px;display:flex;flex-direction:column;gap:16px;align-items:center;overflow:hidden;position:relative;min-height:180px;footer{margin-top:auto}#fraud-badge{opacity:.2;filter:saturate(0);&.is-fraud{opacity:1;filter:saturate(100%)}}#confidence-value{opacity:.2;filter:saturate(0);&.is-fraud{opacity:1;filter:saturate(100%)}}}.txn-card{width:160px;overflow:hidden;position:relative;header{padding:16px}.txn-amount{padding:4px;width:64%;margin-left:auto;&:before{content:"₹";position:absolute;left:-16px;top:-8px;font-weight:700}}footer{background-color:var(--slate-light80);padding:8px}&.pending{transition:all .3s ease}&.verified{background-color:var(--green-light60);border:1px solid var(--green);transition:all .3s ease;footer{background-color:var(--green-light40)}}&.flagged{background-color:hsl(var(--vermilion));border:1px solid var(--red-dark40);transition:all .3s ease;*{color:var(--white)}footer{background-color:var(--red-light40)}.flagged-indicator{background-color:var(--white);color:var(--red-dark60)}}}}#step4-animation{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:400px;#platform-card{width:320px!important;padding:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;position:relative;min-height:180px;z-index:20}.txn-card{width:160px;overflow:hidden;position:relative;header{padding:16px}.txn-amount{padding:4px;width:64%;margin-left:auto;&:before{content:"₹";position:absolute;left:-16px;top:-8px;font-weight:700}}footer{background-color:var(--slate-light80);padding:8px}&.pending{transition:all .3s ease}&.flagged{background-color:hsla(var(--vermilion),.6);border:1px solid var(--red-dark40);transition:all .3s ease;*{color:var(--white)}footer{background-color:var(--red-light40)}.flagged-indicator{background-color:var(--white);color:var(--red-dark60)}}}#pipeline{width:4px;height:80px;background-color:hsla(var(--vermilion),.6);position:relative;&:after{content:"";position:absolute;width:3px;height:16px;top:0;left:50%;transform:translateX(-50%);background:linear-gradient(to bottom,transparent,var(--red-light80),var(--red-light40),transparent);box-shadow:0 0 6px var(--red),0 0 20px var(--red-opacity20);z-index:10;animation:redGlowTravel 2s ease-in-out infinite;animation-delay:calc(var(--glow-delay, 0) * .3s)}}.model-weights-card{width:64px;height:64px;aspect-ratio:1;display:flex;justify-content:center;align-items:center;padding:4px;z-index:20;.model-weights-icon{width:54px;height:54px;margin-top:2px}}}@keyframes redGlowTravel{0%{top:-10px;opacity:0}10%{opacity:1}90%{opacity:1}to{top:80px;opacity:0}}#dpip-page{.hero-window{height:80vh}.hero-bg{background:linear-gradient(to bottom,hsl(var(--turmeric)),var(--amber-light60));height:100%;#dpip-animation{width:50%;height:100%;margin-left:auto}}#hero-content{display:flex;flex-direction:column;justify-content:center;height:100%}#dpip-bento-grid{display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(6,1fr);grid-gap:var(--micro);gap:var(--micro);width:100%;aspect-ratio:1/1;@media screen and (max-width:1200px){aspect-ratio:auto;grid-auto-rows:minmax(200px,auto)}@media screen and (max-width:800px){grid-template-columns:repeat(2,1fr);grid-template-rows:auto;grid-auto-rows:minmax(180px,auto)}.point-card{background-color:var(--amber-light90);border:1px solid var(--amber);border-radius:16px;padding:32px;overflow:hidden;@media screen and (max-width:1200px){padding-left:24px;padding-bottom:120px;padding-right:24px;padding-top:24px;aspect-ratio:auto;border-radius:12px}@media screen and (max-width:800px){padding-left:24px;padding-bottom:120px;padding-right:24px;padding-top:24px}.card-content{position:relative;z-index:50}.card-image{z-index:-1}.card-image svg{position:absolute;width:240px;right:48px;bottom:-24px;max-width:48%;@media screen and (max-width:800px){right:8%;bottom:-24%}}}.metric-card{background-color:var(--amber-light90);border:1px solid var(--amber);border-radius:16px;padding:32px;display:flex;flex-direction:column;justify-content:center;@media screen and (max-width:960px){padding-left:24px;padding-bottom:24px;padding-right:24px;padding-top:24px;aspect-ratio:auto;border-radius:12px}@media screen and (max-width:800px){padding-left:16px;padding-bottom:16px;padding-right:16px;padding-top:16px}h6{font-size:4rem;font-weight:400;@media screen and (max-width:960px){font-size:3rem}@media screen and (max-width:800px){font-size:2.5rem}}}#point-1{grid-column:1/4;grid-row:1/3}#point-2{grid-column:4/7;grid-row:1/3}#point-3{grid-column:4/7;grid-row:4/7}#point-4{grid-column:1/4;grid-row:3/6}#metric-1{grid-column:1/4;grid-row:6/7}#metric-2{grid-column:4/7;grid-row:3/4}@media screen and (max-width:800px){#point-1,#point-2,#point-3,#point-4{grid-column:1/3;grid-row:auto}#metric-1,#metric-2{grid-column:auto;grid-row:auto}}}#how-it-works-dpip{background:linear-gradient(to bottom,var(--amber-light60),var(--amber-light80))}#security-points-cards{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);grid-gap:var(--micro);gap:var(--micro);width:100%;[data-card]{aspect-ratio:1/1}}}