.absolute {
    position: absolute
}

.relative {
    position: relative
}

.left-\[10px\] {
    left: 10px
}

.top-2\/4 {
    top: 50%
}

.\ !order-2 {
    order: 2 !important
}

.\ !order-3 {
    order: 3 !important
}

.order-1 {
    order: 1
}

.\ !mx-auto {
    margin-left: auto !important;
    margin-right: auto !important
}

.mx-auto {
    margin-left: auto;
    margin-right: auto
}

.my-12 {
    margin-top: 3rem;
    margin-bottom: 3rem
}

.my-6 {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem
}

.my-8 {
    margin-top: 2rem;
    margin-bottom: 2rem
}

.\ !mt-4 {
    margin-top: 1rem !important;
}

.mb-3 {
    margin-bottom: .75rem !important;
}

.mb-4 {
    margin-bottom: 1rem !important;
}

.mb-5 {
    margin-bottom: 1.25rem !important;
}

.mb-6 {
    margin-bottom: 1.5rem !important;
}

.mb-8 {
    margin-bottom: 2rem !important;
}

.mb-9 {
    margin-bottom: 2.25rem !important;
}

.mb-12 {
    margin-bottom: 3rem !important;
}

.mb-\[100px\] {
    margin-bottom: 100px;
}

.mb-\[10px\] {
    margin-bottom: 10px;
}

.mb-\[18px\] {
    margin-bottom: 18px;
}

.mb-\[5px\] {
    margin-bottom: 5px;
}

.ml-0 {
    margin-left: 0;
}

.ml-auto {
    margin-left: auto;
}

.mr-\[70px\] {
    margin-right: 70px;
}

.mr-auto {
    margin-right: auto;
}

.mt-10 {
    margin-top: 2.5rem;
}

.mt-14 {
    margin-top: 3.5rem;
}

.mt-16 {
    margin-top: 4rem;
}

.mt-2 {
    margin-top: .5rem;
}

.mt-4 {
    margin-top: 1rem !important;
}

.mt-8 {
    margin-top: 2rem
}

.block {
    display: block !important;
}

.\ !flex {
    display: flex !important
}

.flex {
    display: flex !important;
}

.hidden {
    display: none
}

.\ !h-auto {
    height: auto !important
}

.\ !h-max {
    height: -moz-max-content !important;
    height: max-content !important
}

.h-\[20px\] {
    height: 20px
}

.h-\[48px\] {
    height: 48px
}

.h-auto {
    height: auto
}

.h-max {
    height: -moz-max-content;
    height: max-content
}

.min-h-\[320px\] {
    min-height: 320px
}

.w-1\/2 {
    width: 50%
}

.w-12 {
    width: 3rem
}

.w-5 {
    width: 1.25rem
}

.w-80 {
    width: 20rem
}

.w-\[178px\] {
    width: 178px
}

.w-\[220px\] {
    width: 220px
}

.w-fit {
    width: -moz-fit-content;
    width: fit-content
}

.w-full {
    width: 100%
}

.max-w-\[1200px\] {
    max-width: 1200px
}

.max-w-\[130px\] {
    max-width: 130px
}

.max-w-\[150px\] {
    max-width: 150px
}

.max-w-\[1920px\] {
    max-width: 1920px
}

.max-w-\[200px\] {
    max-width: 200px
}

.max-w-\[224px\] {
    max-width: 224px
}

.max-w-\[320px\] {
    max-width: 320px
}

.max-w-\[350px\] {
    max-width: 350px
}

.max-w-\[500px\] {
    max-width: 500px
}

.max-w-\[576px\] {
    max-width: 576px
}

.max-w-\[664px\] {
    max-width: 664px
}

.max-w-\[88px\] {
    max-width: 88px
}

.-translate-y-2\/4 {
    transform: translate(0, -50%) rotate(0) skew(0) skewY(0) scaleX(1) scaleY(1) !important;
}

.cursor-pointer {
    cursor: pointer
}

.\ !flex-row {
    flex-direction: row !important
}

.flex-row {
    flex-direction: row
}

.\ !flex-col {
    flex-direction: column !important
}

.flex-col {
    flex-direction: column !important;
}

.flex-col-reverse {
    flex-direction: column-reverse
}

.flex-wrap {
    flex-wrap: wrap
}

.items-end {
    align-items: flex-end
}

.items-center {
    align-items: center
}

.justify-center {
    justify-content: center
}

.justify-between {
    justify-content: space-between
}

.gap-1 {
    gap: .25rem
}

.gap-3 {
    gap: .75rem
}

.gap-5 {
    gap: 1.25rem
}

.gap-\[20px\] {
    gap: 20px
}

.self-start {
    align-self: flex-start
}

.self-center {
    align-self: center
}

.rounded-3xl {
    border-radius: 1.5rem
}

.rounded-full {
    border-radius: 9999px
}

.rounded-md {
    border-radius: .375rem
}

.rounded-xl {
    border-radius: .75rem
}

.border {
    border-width: 1px
}

.border-\[\#F27415\] {
    --tw-border-opacity: 1;
    border-color: rgb(242 116 21 / var(--tw-border-opacity))
}

.\ !bg-transparent {
    background-color: transparent !important
}

.bg-\[\#CFCFCF\] {
    --tw-bg-opacity: 1;
    background-color: rgb(207 207 207 / var(--tw-bg-opacity))
}

.bg-\[\#F27415\] {
    --tw-bg-opacity: 1;
    background-color: rgb(242 116 21 / var(--tw-bg-opacity))
}

.bg-transparent {
    background-color: transparent
}

.bg-\[url\(\'assets\/images\/qr-card-bg\.png\'\)\]{
    background-image:url(../../assets/images/qr-card-bg.png)
}
.bg-\[url\(\'assets\/images\/result-card\.png\'\)\]{
    background-image:url(../../assets/images/result-card.png)
}
.bg-\[url\(\'assets\/images\/scanning-bg-mobile\.png\'\)\]{
    background-image:url(../../assets/images/scanning-bg-mobile.png)
}
.bg-gradient-to-b{
    background-image:linear-gradient(to bottom,var(--tw-gradient-stops))
}
.from-\[\#B2E2F454\]{
    --tw-gradient-from: #B2E2F454 var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(178 226 244 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}
.bg-contain{
    background-size:contain
}
.bg-cover{
    background-size:cover
}
.bg-center{
    background-position:center
}
.bg-no-repeat{
    background-repeat:no-repeat
}
.object-contain{
    -o-object-fit:contain;
    object-fit:contain
}
.object-cover{
    -o-object-fit:cover;
    object-fit:cover
}
.p-0{
    padding:0
}
.p-6{
    padding:1.5rem
}
.p-\[50px\]{
    padding:50px
}
.p-\[70px\]{
    padding:70px
}
.\!px-5{
    padding-left:1.25rem!important;
    padding-right:1.25rem!important
}
.px-3{
    padding-left:.75rem;
    padding-right:.75rem
}
.px-\[70px\]{
    padding-left:70px;
    padding-right:70px
}
.py-16{
    padding-top:4rem;
    padding-bottom:4rem
}
.py-8{
    padding-top:2rem;
    padding-bottom:2rem
}
.py-\[10px\]{
    padding-top:10px;
    padding-bottom:10px
}
.\!pt-8{
    padding-top:2rem!important
}
.pb-2{
    padding-bottom:.5rem
}
.pb-8{
    padding-bottom:2rem
}
.pl-0{
    padding-left:0
}
.pt-8{
    padding-top:2rem !important;
}
.\!text-center{
    text-align:center!important
}
.text-center{
    text-align:center
}
.text-2xl{
    font-size:1.5rem !important;
    line-height:2rem !important;
}
.text-\[17px\]{
    font-size:17px
}
.text-base{
    font-size:1rem;
    line-height:1.5rem
}
.text-sm{
    font-size:.875rem;
    line-height:1.25rem
}
.text-xl{
    font-size:1.25rem;
    line-height:1.75rem;
}
.text-xs{
    font-size:.75rem;
    line-height:1rem
}
.font-bold{
    font-weight:700
}
.font-extrabold{
    font-weight:800
}
.font-medium{
    font-weight:500
}
.italic{
    font-style:italic !important;
}
.\!text-white{
    --tw-text-opacity: 1 !important;
    color:rgb(255 255 255 / var(--tw-text-opacity))!important
}
.text-\[\#F27415\]{
    --tw-text-opacity: 1;
    color:rgb(242 116 21 / var(--tw-text-opacity))
}
.text-\[--clr-accent\]{
    color:var(--clr-accent)
}
.text-\[--clr-text\]{
    color:var(--clr-text)
}
.text-white{
    --tw-text-opacity: 1;
    color:rgb(255 255 255 / var(--tw-text-opacity))
}
.shadow-\[0_10px_20px_5px_rgba\(0\,0\,0\,0\.1\)\]{
    --tw-shadow: 0 10px 20px 5px rgba(0,0,0,.1);
    --tw-shadow-colored: 0 10px 20px 5px var(--tw-shadow-color);
    box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)
}
:root{
    font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;
    line-height:1.5;
    font-weight:400;
    color-scheme:light dark;
    color:#ffffffde;
    background-color:#242424;
    font-synthesis:none;
    text-rendering:optimizeLegibility;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    -webkit-text-size-adjust:100%
}
body{
    margin:0;
}
h1{
    font-size:3.2em;
    line-height:1.1
}
button{
    border-radius:8px;
    border:1px solid transparent;
    padding:.6em 1.2em;
    font-size:1em;
    font-weight:500;
    font-family:inherit;
    background-color:#1a1a1a;
    cursor:pointer;
    transition:border-color .25s
}
button:hover{
    border-color:#646cff
}
button:focus,button:focus-visible{
    outline:4px auto -webkit-focus-ring-color
}
.mt-6 {
    margin-top: 1.5rem;
}
.mb-20 {
    margin-bottom: 5rem;
}
@media (prefers-color-scheme: light){
    :root{
        color:#213547;
        background-color:#fff
    }
    a:hover{
        color:#747bff
    }
    button{
        background-color:#f9f9f9
    }
}
@media (min-width: 640px){
    .sm\:left-0{
        left:0
    }
    .sm\:right-0{
        right:0
    }
    .sm\:top-2\/4{
        top:50%
    }
    .sm\:mx-auto{
        margin-left:auto;
        margin-right:auto
    }
    .sm\:mt-0{
        margin-top:0
    }
    .sm\:h-\[180px\]{
        height:180px
    }
    .sm\:-translate-y-2\/4{
        transform:translate(0,-50%) rotate(0) skew(0) skewY(0) scaleX(1) scaleY(1);
    }
}
@media (min-width: 768px){
    .md\:pt-\[54px\] {
        padding-top: 54px;
    }
    .md\:left-\[14px\]{
        left:14px
    }
    .md\:\!order-2{
        order:2!important
    }
    .md\:\!order-3{
        order:3!important
    }
    .md\:mx-auto{
        margin-left:auto;
        margin-right:auto
    }
    .md\:my-20{
        margin-top:5rem;
        margin-bottom:5rem
    }
    .md\:my-8{
        margin-top:2rem;
        margin-bottom:2rem
    }
    .md\:\!ml-0{
        margin-left:0!important
    }
    .md\:\!mr-0{
        margin-right:0!important
    }
    .md\:\!mt-0{
        margin-top:0!important
    }
    .md\:mb-0{
        margin-bottom:0
    }
    .md\:mb-14{
        margin-bottom:3.5rem
    }
    .md\:ml-0{
        margin-left:0
    }
    .md\:mr-auto{
        margin-right:auto
    }
    .md\:mt-0{
        margin-top:0 !important;
    }
    .md\:mt-\[54px\]{
        margin-top:54px
    }
    .md\:block{
        display:block
    }
    .md\:hidden{
        display:none !important;
    }
    .md\:h-\[82px\]{
        height:82px
    }
    .md\:\!w-1\/2{
        width:50%!important
    }
    .md\:w-fit{
        width:-moz-fit-content;
        width:fit-content
    }
    .md\:w-full{
        width:100%
    }
    .md\:w-max{
        width:-moz-max-content;
        width:max-content
    }
    .md\:max-w-\[224px\]{
        max-width:224px
    }
    .md\:max-w-\[360px\]{
        max-width:360px
    }
    .md\:max-w-\[385px\]{
        max-width:385px
    }
    .md\:max-w-\[847px\]{
        max-width:847px
    }
    .md\:basis-6\/12{
        flex-basis:50%
    }
    .md\:\!flex-row{
        flex-direction:row!important
    }
    .md\:flex-row{
        flex-direction:row !important;
    }
    .md\:\!flex-col{
        flex-direction:column!important
    }
    .md\:\!items-center{
        align-items:center!important
    }
    .md\:items-center{
        align-items:center !important;
    }
    .md\:\!justify-between{
        justify-content:space-between!important
    }
    .md\:justify-between{
        justify-content:space-between !important;
    }
    .md\:\!gap-16{
        gap:4rem!important
    }
    .md\:gap-16{
        gap:4rem!important
    }
    .md\:gap-12{
        gap:3rem !important;
    }
    .md\:gap-4{
        gap:1rem
    }
    .md\:gap-6{
        gap:1.5rem
    }
    .md\:gap-\[80px\]{
        gap:80px
    }
    .md\:bg-\[url\(\'assets\/images\/disclaimer-bg\.png\'\)\]{
        background-image:url(../../assets/images/disclaimer-bg.png)
    }
    .md\:bg-\[url\(\'assets\/images\/scanning-bg\.png\'\)\]{
        background-image:url(../../assets/images/scanning-bg.png)
    }
    .md\:bg-cover{
        background-size:cover
    }
    .md\:bg-bottom{
        background-position:bottom
    }
    .md\:bg-top{
        background-position:top
    }
    .md\:bg-no-repeat{
        background-repeat:no-repeat
    }
    .md\:px-11{
        padding-left:2.75rem;
        padding-right:2.75rem
    }
    .md\:\!pt-\[54px\]{
        padding-top:54px!important
    }
    .md\:pb-4{
        padding-bottom:1rem
    }
    .md\:pt-10{
        padding-top:2.5rem
    }
    .md\:pt-\[54px\]{
        padding-top:54px
    }
    .md\:\!text-left{
        text-align:left!important
    }
    .md\:text-start{
        text-align:start
    }
    .md\:\!text-base{
        font-size:1rem!important;
        line-height:1.5rem!important
    }
    .md\:text-2xl{
        font-size:1.5rem !important;
        line-height:2rem !important;
    }
    .md\:text-4xl{
        font-size:2.25rem;
        line-height:2.5rem
    }
    .md\:text-base{
        font-size:1rem;
        line-height:1.5rem
    }
    .md\:text-xl{
        font-size:1.25rem;
        line-height:1.75rem;
    }
    .md\:-mt-14{
        margin-top:-3.5rem !important;
    }
}
@media (min-width: 1024px){
    .lg\:mx-0{
        margin-left:0;
        margin-right:0
    }
    .lg\:-mt-20{
        margin-top:-5rem !important;
    }
    .lg\:\!-mt-4{
        margin-top:-1rem!important;
    }
    .lg\:mb-0{
        margin-bottom:0
    }
    .lg\:ml-0{
        margin-left:0
    }
    .lg\:ml-12{
        margin-left:3rem
    }
    .lg\:mr-auto{
        margin-right:auto
    }
    .lg\:h-auto{
        height:auto
    }
    .lg\:w-\[380px\]{
        width:380px !important;
    }
    .lg\:\!max-w-\[440px\]{
        max-width:440px!important
    }
    .lg\:max-w-\[542px\]{
        max-width:542px
    }
    .lg\:gap-20{
        gap:5rem !important;
    }
    .lg\:gap-\[220px\]{
        gap:220px
    }
    .lg\:rounded-3xl{
        border-radius:1.5rem
    }
    .lg\:\!bg-white{
        --tw-bg-opacity: 1 !important;
        background-color:rgb(255 255 255 / var(--tw-bg-opacity))!important
    }
    .lg\:bg-cover{
        background-size:cover
    }
    .lg\:\!px-\[84px\]{
        padding-left:84px!important;
        padding-right:84px!important
    }
    .lg\:\!py-\[42px\]{
        padding-top:42px!important;
        padding-bottom:42px!important
    }
    .lg\:pl-12{
        padding-left:3rem
    }
    .lg\:pt-4{
        padding-top:1rem
    }
    .lg\:text-4xl{
        font-size:2.25rem;
        line-height:2.5rem
    }
    .lg\:shadow-\[0_10px_20px_5px_rgba\(0\,0\,0\,0\.1\)\]{
        --tw-shadow: 0 10px 20px 5px rgba(0,0,0,.1);
        --tw-shadow-colored: 0 10px 20px 5px var(--tw-shadow-color);
        box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)
    }
}

/* .first-screen {
    margin-top: -12px;
} */

.z-10 {
    z-index: 10;
}

.scanning-line {
    min-width: 5000px !important;
    max-width: 6000px !important;
    overflow: hidden;
    height: 380px;
    position: absolute;
    top: 55%;
    transform: translateY(-50%);
    z-index: -1;
}

.scanning-line-blue {
    animation: scanning-animation 11s infinite ease-in-out;
}

.scanning-line-orange {
    animation: scanning-animation 12s infinite ease-in-out;
}

@media (min-width: 768px) {
    .scanning-line {
        top: 120%;
        transform: translateY(-100%);
    }
}

@keyframes scanning-animation {
    0% {
        left: -1000px;
    }
    100% {
        left: -100px;
    }
}

.user-result-bg {
    background: linear-gradient(to bottom, #B2E2F454, transparent);
}

.magnevie-pack-halo {
    background: radial-gradient(57.05% 56.94% at 50.00% 50.00%, #E0F5FD 0%, rgba(238, 245, 255, 0.00) 100%);
}