/* DataLien marketing site. Generated from the design canvas; edit freely. */
@font-face{font-family:'DL Minion';font-style:normal;font-weight:400;src:local('Minion Pro Display'),local('MinionPro-Disp'),local('Minion Pro Disp'),local('Minion Pro'),local('MinionPro-Regular')}
@font-face{font-family:'DL Minion';font-style:normal;font-weight:500;src:local('Minion Pro Medium Display'),local('MinionPro-MediumDisp'),local('Minion Pro Medium'),local('MinionPro-Medium')}
@font-face{font-family:'DL Minion';font-style:italic;font-weight:400;src:local('Minion Pro Italic Display'),local('MinionPro-ItDisp'),local('Minion Pro Italic'),local('MinionPro-It')}

body{margin:0;background:#ffffff}
html{scroll-behavior:smooth}
section[id]{scroll-margin-top:72px}
h1,h2,h3{text-wrap:balance}
a{color:#315b8e}a:hover{color:#1f3f66}
@media (max-width: 860px){.nav-links{display:none !important}}
@media (max-width: 480px){.dl-signin{display:none !important}}

/* Hover and press */
.dl-btn{position:relative;overflow:hidden;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s,background-color .2s,color .2s}
.dl-btn:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(20,23,26,.18)}
.dl-btn:active{transform:translateY(0);box-shadow:none}
.dl-btn svg{transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.dl-btn:hover svg{transform:translateX(3px)}
.dl-link{position:relative;transition:color .2s}
.dl-link::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:#315b8e;transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.dl-link:hover{color:#14171a !important}
.dl-link:hover::after{transform:scaleX(1)}
.dl-card{position:relative;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s,border-color .3s}
.dl-card:hover{transform:translateY(-3px)}

/* Chapters under each video: they fill as the video plays and jump to their moment on click */
.dl-ch{all:unset;box-sizing:border-box;display:block;width:100%;cursor:pointer;padding:16px 0 4px;position:relative;text-align:left}
.dl-ch:focus-visible{outline:2px solid #315b8e;outline-offset:4px}
.dl-ch-bar{position:absolute;left:0;right:0;top:0;height:2px;background:#d5dae0;overflow:hidden}
.dl-ch-fill{position:absolute;inset:0;background:#315b8e;transform:scaleX(0);transform-origin:left}
.dl-ch-time{display:block;font-family:'Geist Mono',ui-monospace,monospace;font-size:12px;color:#69727e;transition:color .3s}
.dl-ch-title{display:block;margin-top:6px;font-size:16px;font-weight:600;color:#4b535d;transition:color .3s}
.dl-ch-text{display:block;margin-top:4px;font-size:14.5px;line-height:1.55;color:#69727e;transition:color .3s}
.dl-ch[data-on="1"] .dl-ch-time{color:#315b8e}
.dl-ch[data-on="1"] .dl-ch-title,.dl-ch:hover .dl-ch-title{color:#14171a}
.dl-ch:hover .dl-ch-time{color:#315b8e}
.dl-ch[data-on="1"] .dl-ch-text{color:#4b535d}

/* Tabs above the reading player */
.dl-tab{all:unset;box-sizing:border-box;display:block;cursor:pointer;position:relative;padding:18px 20px 22px;border:1px solid #e3e6ea;background:#ffffff;transition:border-color .25s,box-shadow .25s,transform .25s cubic-bezier(.2,.8,.2,1)}
.dl-tab:hover{border-color:#8c95a1}
.dl-tab:focus-visible{outline:2px solid #315b8e;outline-offset:3px}
.dl-tab[data-on="1"]{border-color:#14171a;box-shadow:0 16px 36px rgba(20,23,26,.12)}
.dl-tab-num{display:block;font-family:'Geist Mono',ui-monospace,monospace;font-size:12px;color:#69727e}
.dl-tab[data-on="1"] .dl-tab-num{color:#315b8e}
.dl-tab-title{display:block;margin-top:6px;font-family:'Newsreader',Georgia,serif;font-size:24px;line-height:1.15;color:#14171a}
.dl-tab-text{display:block;margin-top:4px;font-size:14.5px;line-height:1.5;color:#4b535d}
.dl-tab-bar{position:absolute;left:0;right:0;bottom:0;height:3px;background:transparent;overflow:hidden}
.dl-tab-fill{position:absolute;inset:0;background:#315b8e;transform:scaleX(0);transform-origin:left}

/* Fragment chips */
.dl-chip{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:3px;min-height:44px;padding:9px 14px;border:1px solid #e3e6ea;background:#ffffff;transition:border-color .2s,background-color .2s,color .2s}
.dl-chip:hover{border-color:#315b8e}
.dl-chip:focus-visible{outline:2px solid #315b8e;outline-offset:3px}
.dl-chip-k{font-size:12px;color:#69727e}
.dl-chip-v{font-family:'Geist Mono',ui-monospace,monospace;font-size:14px}
.dl-chip[data-on="1"]{background:#14171a;border-color:#14171a;color:#ffffff}
.dl-chip[data-on="1"] .dl-chip-k{color:#aeb7c2}

/* Highlights and marks */
.dl-hl{color:inherit;padding:0 2px;background:linear-gradient(#ffe9a0,#ffe9a0) no-repeat 0 0/100% 100%}
.dl-sc-mark{background:rgba(141,180,232,.34);box-shadow:0 0 0 1.5px #315b8e;border-radius:1px}
.dl-caret{display:inline-block;width:1.5px;height:1.05em;margin-left:2px;vertical-align:-2px;background:#315b8e}
.dl-type{display:inline-block;overflow:hidden;white-space:nowrap;vertical-align:bottom}
.dl-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#8db4e8}

@keyframes dl-fade-up{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes dl-marker{from{background-size:0% 100%}to{background-size:100% 100%}}
@keyframes dl-type-a{from{width:0}}
@keyframes dl-type-b{from{width:0}}
@keyframes dl-pop-a{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes dl-pop-b{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes dl-blink{50%{opacity:0}}
@keyframes dl-shimmer{0%{transform:translateX(-100%)}100%{transform:translateX(250%)}}
@keyframes dl-reveal{from{opacity:0;translate:0 16px}to{opacity:1;translate:0 0}}
@keyframes dl-grow{from{scale:.97;opacity:.7}to{scale:1;opacity:1}}
@keyframes dl-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}

@media (prefers-reduced-motion: no-preference){
.dl-in,.dl-shot,.dl-float{animation:dl-fade-up .8s cubic-bezier(.2,.8,.2,1) var(--d,0ms) backwards}
.dl-mark{animation:dl-marker .8s cubic-bezier(.6,0,.2,1) var(--d,0ms) both}
.dl-type{width:calc(var(--n) * 1ch)}
.dl-type-a{animation:dl-type-a .7s steps(var(--n),end) both}
.dl-type-b{animation:dl-type-b .7s steps(var(--n),end) both}
.dl-pop-a{animation:dl-pop-a .5s cubic-bezier(.2,.8,.2,1) .45s both}
.dl-pop-b{animation:dl-pop-b .5s cubic-bezier(.2,.8,.2,1) .45s both}
.dl-caret{animation:dl-blink 1s steps(1) infinite}
.dl-shimmer{animation:dl-shimmer 1.2s ease-in-out infinite}
@keyframes dl-pa-pasted{0%,1.88%{opacity:0;translate:0 6px}4.88%,100%{opacity:1;translate:0 0}}
.dl-pa-pasted{animation:dl-pa-pasted 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-h1{0%,3.75%{background-size:0% 100%}7.50%,100%{background-size:100% 100%}}
.dl-pa-h1{animation:dl-pa-h1 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-c1{0%,6.25%{opacity:0;translate:0 6px}9.25%,100%{opacity:1;translate:0 0}}
.dl-pa-c1{animation:dl-pa-c1 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-h2{0%,10.00%{background-size:0% 100%}13.75%,100%{background-size:100% 100%}}
.dl-pa-h2{animation:dl-pa-h2 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-c2{0%,12.50%{opacity:0;translate:0 6px}15.50%,100%{opacity:1;translate:0 0}}
.dl-pa-c2{animation:dl-pa-c2 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-h3{0%,16.25%{background-size:0% 100%}20.00%,100%{background-size:100% 100%}}
.dl-pa-h3{animation:dl-pa-h3 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-c3{0%,18.75%{opacity:0;translate:0 6px}21.75%,100%{opacity:1;translate:0 0}}
.dl-pa-c3{animation:dl-pa-c3 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-h4{0%,22.50%{background-size:0% 100%}26.25%,100%{background-size:100% 100%}}
.dl-pa-h4{animation:dl-pa-h4 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-c4{0%,25.00%{opacity:0;translate:0 6px}28.00%,100%{opacity:1;translate:0 0}}
.dl-pa-c4{animation:dl-pa-c4 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-s1{0%,27.50%{opacity:0}29.50%,33.12%{opacity:1}35.12%,100%{opacity:0}}
.dl-pa-s1{animation:dl-pa-s1 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-s2{0%,35.00%{opacity:0;translate:0 6px}38.00%,100%{opacity:1;translate:0 0}}
.dl-pa-s2{animation:dl-pa-s2 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-card{0%,35.00%{opacity:0;translate:16px 0}38.00%,100%{opacity:1;translate:0 0}}
.dl-pa-card{animation:dl-pa-card 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-m1{0%,38.12%{opacity:0;translate:0 6px}41.12%,100%{opacity:1;translate:0 0}}
.dl-pa-m1{animation:dl-pa-m1 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-m2{0%,40.62%{opacity:0;translate:0 6px}43.62%,100%{opacity:1;translate:0 0}}
.dl-pa-m2{animation:dl-pa-m2 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-m3{0%,43.12%{opacity:0;translate:0 6px}46.13%,100%{opacity:1;translate:0 0}}
.dl-pa-m3{animation:dl-pa-m3 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-m4{0%,45.62%{opacity:0;translate:0 6px}48.62%,100%{opacity:1;translate:0 0}}
.dl-pa-m4{animation:dl-pa-m4 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-best{0%,48.75%{opacity:0;translate:0 6px}51.75%,100%{opacity:1;translate:0 0}}
.dl-pa-best{animation:dl-pa-best 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-pa-open{0%,51.25%{opacity:0;translate:0 6px}54.25%,100%{opacity:1;translate:0 0}}
.dl-pa-open{animation:dl-pa-open 8s cubic-bezier(.2,.8,.2,1) both}
/* The paste-an-email and scanned-page demos hold at their start until you scroll to them (main.js adds .is-in). */
.js .dl-stage:not(.is-in) [class*="dl-pa-"],.js .dl-stage:not(.is-in) [class*="dl-sc-"]{animation-play-state:paused}
@keyframes dl-sc-f1{0%,15.08%{background-color:rgba(141,180,232,0);box-shadow:0 0 0 1.5px rgba(49,91,142,0)}21.08%,100%{background-color:rgba(141,180,232,.34);box-shadow:0 0 0 1.5px #315b8e}}
.dl-sc-f1{animation:dl-sc-f1 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-r1{0%,16.28%{opacity:0;translate:0 6px}19.28%,100%{opacity:1;translate:0 0}}
.dl-sc-r1{animation:dl-sc-r1 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-v1{0%,17.08%{clip-path:inset(0 100% 0 0)}21.08%,100%{clip-path:inset(0 0 0 0)}}
.dl-sc-v1{animation:dl-sc-v1 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-f2{0%,17.19%{background-color:rgba(141,180,232,0);box-shadow:0 0 0 1.5px rgba(49,91,142,0)}23.19%,100%{background-color:rgba(141,180,232,.34);box-shadow:0 0 0 1.5px #315b8e}}
.dl-sc-f2{animation:dl-sc-f2 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-r2{0%,18.39%{opacity:0;translate:0 6px}21.39%,100%{opacity:1;translate:0 0}}
.dl-sc-r2{animation:dl-sc-r2 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-v2{0%,19.19%{clip-path:inset(0 100% 0 0)}23.19%,100%{clip-path:inset(0 0 0 0)}}
.dl-sc-v2{animation:dl-sc-v2 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-f3{0%,19.50%{background-color:rgba(141,180,232,0);box-shadow:0 0 0 1.5px rgba(49,91,142,0)}25.50%,100%{background-color:rgba(141,180,232,.34);box-shadow:0 0 0 1.5px #315b8e}}
.dl-sc-f3{animation:dl-sc-f3 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-r3{0%,20.70%{opacity:0;translate:0 6px}23.70%,100%{opacity:1;translate:0 0}}
.dl-sc-r3{animation:dl-sc-r3 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-v3{0%,21.50%{clip-path:inset(0 100% 0 0)}25.50%,100%{clip-path:inset(0 0 0 0)}}
.dl-sc-v3{animation:dl-sc-v3 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-f4{0%,21.71%{background-color:rgba(141,180,232,0);box-shadow:0 0 0 1.5px rgba(49,91,142,0)}27.71%,100%{background-color:rgba(141,180,232,.34);box-shadow:0 0 0 1.5px #315b8e}}
.dl-sc-f4{animation:dl-sc-f4 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-r4{0%,22.91%{opacity:0;translate:0 6px}25.91%,100%{opacity:1;translate:0 0}}
.dl-sc-r4{animation:dl-sc-r4 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-v4{0%,23.71%{clip-path:inset(0 100% 0 0)}27.71%,100%{clip-path:inset(0 0 0 0)}}
.dl-sc-v4{animation:dl-sc-v4 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-f5{0%,26.12%{background-color:rgba(141,180,232,0);box-shadow:0 0 0 1.5px rgba(49,91,142,0)}32.12%,100%{background-color:rgba(141,180,232,.34);box-shadow:0 0 0 1.5px #315b8e}}
.dl-sc-f5{animation:dl-sc-f5 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-r5{0%,27.32%{opacity:0;translate:0 6px}30.32%,100%{opacity:1;translate:0 0}}
.dl-sc-r5{animation:dl-sc-r5 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-v5{0%,28.12%{clip-path:inset(0 100% 0 0)}32.12%,100%{clip-path:inset(0 0 0 0)}}
.dl-sc-v5{animation:dl-sc-v5 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-f6{0%,29.32%{background-color:rgba(141,180,232,0);box-shadow:0 0 0 1.5px rgba(49,91,142,0)}35.32%,100%{background-color:rgba(141,180,232,.34);box-shadow:0 0 0 1.5px #315b8e}}
.dl-sc-f6{animation:dl-sc-f6 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-r6{0%,30.52%{opacity:0;translate:0 6px}33.52%,100%{opacity:1;translate:0 0}}
.dl-sc-r6{animation:dl-sc-r6 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-v6{0%,31.32%{clip-path:inset(0 100% 0 0)}35.32%,100%{clip-path:inset(0 0 0 0)}}
.dl-sc-v6{animation:dl-sc-v6 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-f7{0%,40.88%{background-color:rgba(141,180,232,0);box-shadow:0 0 0 1.5px rgba(49,91,142,0)}46.88%,100%{background-color:rgba(141,180,232,.34);box-shadow:0 0 0 1.5px #315b8e}}
.dl-sc-f7{animation:dl-sc-f7 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-r7{0%,42.08%{opacity:0;translate:0 6px}45.08%,100%{opacity:1;translate:0 0}}
.dl-sc-r7{animation:dl-sc-r7 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-v7{0%,42.88%{clip-path:inset(0 100% 0 0)}46.88%,100%{clip-path:inset(0 0 0 0)}}
.dl-sc-v7{animation:dl-sc-v7 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-st1{0%,0.00%{opacity:0}2.00%,50.00%{opacity:1}52.00%,100%{opacity:0}}
.dl-sc-st1{animation:dl-sc-st1 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-st2{0%,52.00%{opacity:0;translate:0 6px}55.00%,100%{opacity:1;translate:0 0}}
.dl-sc-st2{animation:dl-sc-st2 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-foot{0%,56.00%{opacity:0;translate:0 6px}59.00%,100%{opacity:1;translate:0 0}}
.dl-sc-foot{animation:dl-sc-foot 11s cubic-bezier(.2,.8,.2,1) both}
@keyframes dl-sc-beam{0%,3.00%{top:-78px;opacity:0}4.50%{opacity:1}48.50%{opacity:1}50.00%,100%{top:calc(100% - 78px);opacity:0}}
.dl-sc-beam{animation:dl-sc-beam 11s linear both}
@keyframes dl-sc-tint{0%,3.00%{height:0;opacity:1}50.00%{height:100%;opacity:1}58.00%,100%{height:100%;opacity:0}}
.dl-sc-tint{animation:dl-sc-tint 11s linear both}
}

@supports (animation-timeline: view()){
@media (prefers-reduced-motion: no-preference){
.dl-reveal{animation:dl-reveal linear both;animation-timeline:view();animation-range:entry 5% entry 80%}
.dl-grow{animation:dl-grow linear both;animation-timeline:view();animation-range:entry 0% cover 38%}
.dl-progress{animation:dl-progress linear both;animation-timeline:scroll(root)}
}
}
@media (prefers-reduced-motion: reduce){
.dl-pa-s1,.dl-sc-st1,.dl-sc-beam{display:none !important}
}

/* Request a demo */
[hidden]{display:none !important}
.dl-steps{margin:28px 0 0;padding:0;list-style:none;display:grid;gap:12px;font-size:16px;color:#2e343b}
.dl-steps li{display:flex;align-items:center;gap:12px}
.dl-step-num{display:inline-flex;align-items:center;justify-content:center;flex:none;width:28px;height:28px;border:1px solid #14171a;font-family:'Geist Mono',ui-monospace,monospace;font-size:12.5px}
.dl-form-card{position:relative;background:#ffffff;border:1px solid #14171a;box-shadow:0 30px 60px rgba(20,23,26,.10);padding:clamp(20px,3vw,32px)}
.dl-form{display:grid;gap:16px}
.dl-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:16px}
.dl-field{display:grid;gap:6px;font-size:14px;font-weight:500;color:#14171a}
.dl-opt{font-weight:400;color:#69727e}
.dl-input{box-sizing:border-box;width:100%;min-height:46px;padding:10px 12px;border:1px solid #c9ced4;border-radius:2px;background:#ffffff;font:inherit;font-weight:400;font-size:15px;color:#14171a;transition:border-color .2s,box-shadow .2s}
.dl-input:hover{border-color:#8c95a1}
.dl-input:focus{outline:none;border-color:#315b8e;box-shadow:0 0 0 3px rgba(49,91,142,.18)}
.dl-input[aria-invalid="true"]{border-color:#b42318;box-shadow:0 0 0 3px rgba(180,35,24,.12)}
textarea.dl-input{min-height:92px;resize:vertical;line-height:1.5}
select.dl-input{appearance:none;-webkit-appearance:none;padding-right:36px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%234b535d' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
.dl-fieldset{border:0;margin:0;padding:0;display:grid;gap:10px;min-width:0}
.dl-legend{padding:0;margin-bottom:10px;font-size:14px;font-weight:600}
.dl-hint{margin:0;font-size:13px;color:#69727e}
.dl-hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.dl-submit-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:4px}
.dl-submit{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 28px;border:0;border-radius:2px;background:#315b8e;color:#ffffff;font:inherit;font-size:16px;font-weight:500;cursor:pointer}
.dl-submit:focus-visible{outline:2px solid #315b8e;outline-offset:3px}
.dl-submit:disabled{opacity:.7;cursor:progress}
.dl-status{margin:0;font-size:14px;line-height:1.5;color:#b42318}
.dl-status:empty{display:none}
.dl-done{display:grid;justify-items:start;gap:10px;padding:24px 0;outline:none}
.dl-done-check{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:#e6f1ea;color:#1f6b46}
.dl-done-title{margin:6px 0 0;font-family:'Newsreader',Georgia,serif;font-weight:400;font-size:32px;line-height:1.1}
.dl-done-text{margin:0;font-size:16px;color:#4b535d}
@media (prefers-reduced-motion: no-preference){
.dl-done:not([hidden]){animation:dl-fade-up .6s cubic-bezier(.2,.8,.2,1) both}
.dl-done:not([hidden]) .dl-done-check{animation:dl-pop-a .5s cubic-bezier(.2,.8,.2,1) .15s both}
}

/* Cards ------------------------------------------------------------------------------- */

/* Upload: what DataLien reads */
.dl-doc{display:flex;flex-direction:column;gap:6px;background:#ffffff;border:1px solid #d5dae0;border-radius:8px;padding:16px 16px 20px;box-shadow:0 14px 34px rgba(20,23,26,.08)}
.dl-doc-art{position:relative;display:grid;place-items:center;height:128px;margin-bottom:10px;border-radius:5px;background:#eef1f5;overflow:hidden}
.dl-doc-title{font-family:'Newsreader',Georgia,serif;font-size:24px;line-height:1.1;color:#14171a}
.dl-doc-text{font-size:14.5px;line-height:1.5;color:#4b535d}
.dl-page{position:relative;display:grid;align-content:start;gap:6px;box-sizing:border-box;width:80px;height:100px;padding:12px 10px;background:#ffffff;border:1px solid #d5dae0;box-shadow:0 8px 18px rgba(20,23,26,.12)}
.dl-page i{display:block;height:3px;border-radius:2px;background:#dfe3e8}
.dl-page-scan{background:#fbfaf4;rotate:-3deg}
.dl-seal{position:absolute;right:8px;bottom:8px;width:18px;height:18px;border-radius:50%;border:2px solid #315b8e;background:rgba(49,91,142,.12)}
.dl-sign{position:absolute;left:8px;right:8px;bottom:8px;width:calc(100% - 16px);height:16px}
.dl-sign path{stroke-dasharray:1 1;stroke-dashoffset:0}
.dl-plat{width:100%;height:100%}

/* Security */
.dl-sec{background:#1b2026;border:1px solid #2c333b;border-radius:8px;padding:24px 22px 26px}
.dl-sec:hover{border-color:#5b82b0}
.dl-sec-icon{position:relative;display:inline-grid;place-items:center;width:50px;height:50px;border-radius:13px;background:rgba(141,180,232,.12);color:#8db4e8;transition:background-color .3s,color .3s}
.dl-sec:hover .dl-sec-icon{background:#315b8e;color:#ffffff}

/* Card groups come in one after another when they scroll into view (main.js adds .is-in).
   `backwards` so the hover lift owns `transform` once a card has landed. */
@keyframes dl-deal{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: no-preference){
.js .dl-deal:not(.is-in)>*:not(.dl-pa-card){opacity:0}
.js .dl-deal.is-in>*:not(.dl-pa-card){animation:dl-deal .6s cubic-bezier(.2,.8,.2,1) calc(var(--i,0) * 70ms) backwards}
}

/* Hero: the search bar, front and center over the picture */
.dl-hs{position:absolute;left:0;right:0;top:-46px;z-index:3;width:min(700px,92%);margin:0 auto;text-align:left}
.dl-hs-box{display:flex;align-items:center;gap:12px;min-height:64px;padding:0 10px 0 18px;background:#ffffff;border:1px solid #14171a;box-shadow:0 30px 70px rgba(20,23,26,.22),0 8px 20px rgba(20,23,26,.10)}
.dl-hs-field{flex:1;min-width:0;overflow:hidden;white-space:nowrap;font-family:'Geist Mono',ui-monospace,monospace;font-size:17px;color:#14171a}
.dl-hs-kind{flex:none;font-size:12px;color:#315b8e;border:1px solid #c9d6e6;padding:3px 8px;white-space:nowrap}
.dl-hs-go{flex:none;display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 16px;background:#315b8e;color:#ffffff;font-size:15px;font-weight:500}
.dl-hs-result{display:flex;align-items:center;gap:12px;margin-top:-1px;padding:12px 18px;background:#ffffff;border:1px solid #14171a;border-top-color:#e3e6ea;box-shadow:0 30px 70px rgba(20,23,26,.16)}
.dl-hs-dot{flex:none;width:8px;height:8px;border-radius:50%;background:#315b8e}
.dl-hs-main{flex:1;min-width:0;display:grid;gap:2px}
.dl-hs-title{font-size:15.5px;font-weight:600;color:#14171a}
.dl-hs-meta{font-family:'Geist Mono',ui-monospace,monospace;font-size:12.5px;color:#4b535d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dl-hs-how{flex:none;font-size:13px;color:#315b8e;white-space:nowrap}
.dl-pill{display:inline-flex;align-items:center;padding:3px 9px;border:1px solid #d5dae0;border-radius:999px;font-size:12px;color:#4b535d}
@keyframes dl-hs-in{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}
@media (prefers-reduced-motion: no-preference){
.dl-hs{animation:dl-hs-in .7s cubic-bezier(.2,.8,.2,1) .7s both}
}
@media (max-width: 1100px){
#top .dl-side-l{left:12px !important}
#top .dl-side-r{right:12px !important;top:190px !important}
}
@media (max-width: 760px){
#top .dl-float{display:none}
.dl-hs{top:-34px}
.dl-hs-box{min-height:54px;gap:8px;padding-left:12px}
.dl-hs-field{font-size:14.5px}
.dl-hs-kind,.dl-hs-how{display:none}
.dl-hs-go{min-height:40px;padding:0 12px;font-size:14px}
.dl-hs-go-text{display:none}
.dl-hs-result{padding:10px 12px}
}

/* Demo videos just play: no clicks, no menu, no picture-in-picture (main.js keeps them at normal speed). */
video.dl-demo{pointer-events:none;-webkit-user-select:none;user-select:none}
video.dl-demo::-webkit-media-controls{display:none !important}

/* Skipping ahead: a step or a Reading tab races the video to that moment. */
.dl-ff{position:absolute;top:18px;right:18px;z-index:2;display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:rgba(20,23,26,.82);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#ffffff;font-family:'Geist Mono',ui-monospace,monospace;font-size:13px;letter-spacing:.04em;opacity:0;pointer-events:none;transition:opacity .2s}
.dl-frame.is-ff .dl-ff{opacity:1}
@keyframes dl-rw{0%{opacity:1}35%{opacity:.4}100%{opacity:1}}
@media (prefers-reduced-motion: no-preference){
.dl-frame.is-rw video.dl-demo{animation:dl-rw .5s ease}
}