/* Archived digitalxeco.com product cards, 2025-09-30. Original SVGs, fonts and scoped utilities. */
@font-face{font-family:DXArchiveSans;src:url('./74452ea3ef0f9101-s.p.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:DXArchiveMono;src:url('./66f30814ff6d7cdf.p.woff2') format('woff2');font-weight:100 900;font-display:swap}
.dx-archive-cards{--primary:0 0% 100%;--secondary:216 4% 51%;--border:221 12% 14%;--font-geist-mono:DXArchiveMono,monospace;font-family:DXArchiveSans,Arial,sans-serif;font-size:16px;line-height:24px;color:#fff;background:#0a0a0a;text-align:left}
.dx-archive-cards *,.dx-archive-cards *::before,.dx-archive-cards *::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}
.dx-archive-cards h3,.dx-archive-cards p{margin:0;font-size:inherit;font-weight:inherit}
.dx-archive-cards a{color:inherit;text-decoration:inherit}
.dx-archive-cards button{font:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0;background:transparent;background-image:none;text-transform:none}
.dx-archive-cards svg,.dx-archive-cards canvas{display:block;vertical-align:middle}
.dx-archive-cards svg{height:auto}



















































































































































































































.dx-archive-cards .pointer-events-none{pointer-events: none;}






.dx-archive-cards .absolute{position: absolute;}
.dx-archive-cards .relative{position: relative;}

.dx-archive-cards .inset-0{inset: 0px;}





.dx-archive-cards .-inset-x-8{left: -2rem; right: -2rem;}











.dx-archive-cards .-bottom-1{bottom: -0.25rem;}








.dx-archive-cards .-left-1{left: -0.25rem;}





.dx-archive-cards .-right-1{right: -0.25rem;}


.dx-archive-cards .-right-4{right: -1rem;}

.dx-archive-cards .-right-8{right: -2rem;}

.dx-archive-cards .-top-1{top: -0.25rem;}




.dx-archive-cards .-top-4{top: -1rem;}
.dx-archive-cards .-top-8{top: -2rem;}









.dx-archive-cards .left-1\/2{left: 50%;}













.dx-archive-cards .top-1\/2{top: 50%;}










.dx-archive-cards .isolate{isolation: isolate;}

.dx-archive-cards .z-10{z-index: 10;}






































.dx-archive-cards .-mt-4{margin-top: -1rem;}






















.dx-archive-cards .mt-2{margin-top: 0.5rem;}



.dx-archive-cards .mt-4{margin-top: 1rem;}









.dx-archive-cards .flex{display: flex;}
.dx-archive-cards .inline-flex{display: inline-flex;}

.dx-archive-cards .grid{display: grid;}

.dx-archive-cards .hidden{display: none;}














.dx-archive-cards .size-2{width: 0.5rem; height: 0.5rem;}








.dx-archive-cards .size-\[max\(100\%\,2\.75rem\)\]{width: max(100%, 2.75rem); height: max(100%, 2.75rem);}

































.dx-archive-cards .h-full{height: 100%;}







































.dx-archive-cards .w-full{width: 100%;}




















.dx-archive-cards .max-w-sm{max-width: 24rem;}


.dx-archive-cards .flex-1{flex: 1 1 0%;}

.dx-archive-cards .flex-shrink-0,.dx-archive-cards .shrink-0{flex-shrink: 0;}



.dx-archive-cards .grow{flex-grow: 1;}



.dx-archive-cards .origin-bottom{transform-origin: center bottom;}
.dx-archive-cards .origin-center{transform-origin: center center;}


.dx-archive-cards .origin-top-right{transform-origin: right top;}
.dx-archive-cards .-translate-x-1\/2{--tw-translate-x: -50%;}
.dx-archive-cards .-translate-x-1\/2,.dx-archive-cards .-translate-x-px{transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}
.dx-archive-cards .-translate-x-px{--tw-translate-x: -1px;}

.dx-archive-cards .-translate-y-0,.dx-archive-cards .-translate-y-1\/2{transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}
.dx-archive-cards .-translate-y-1\/2{--tw-translate-y: -50%;}



.dx-archive-cards .-translate-y-px{--tw-translate-y: -1px;}
.dx-archive-cards .-translate-y-px,.dx-archive-cards .translate-x-2{transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}

.dx-archive-cards .translate-x-px{--tw-translate-x: 1px;}
.dx-archive-cards .translate-x-px,.dx-archive-cards .translate-y-0{transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}




.dx-archive-cards .translate-y-px{--tw-translate-y: 1px;}
.dx-archive-cards .-rotate-180,.dx-archive-cards .translate-y-px{transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}








.dx-archive-cards .scale-75,.dx-archive-cards .scale-\[115\%\]{transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}
.dx-archive-cards .scale-\[115\%\]{--tw-scale-x: 115%; --tw-scale-y: 115%;}
















.dx-archive-cards .flex-col{flex-direction: column;}





.dx-archive-cards .items-center{align-items: center;}



.dx-archive-cards .justify-center{justify-content: center;}

.dx-archive-cards .gap-0{gap: 0px;}



.dx-archive-cards .gap-10{gap: 2.5rem;}










.dx-archive-cards .gap-x-2{column-gap: 0.5rem;}

















.dx-archive-cards .space-y-4 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse: 0; margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(1rem * var(--tw-space-y-reverse));}








.dx-archive-cards .overflow-hidden{overflow: hidden;}


















.dx-archive-cards .rounded-full{border-radius: 9999px;}












.dx-archive-cards .border{border-width: 1px;}












.dx-archive-cards .border-t{border-top-width: 1px;}





.dx-archive-cards .border-\[--btn-border\]{border-color: var(--btn-border);}


.dx-archive-cards .border-border{border-color: hsl(var(--border));}







.dx-archive-cards .border-primary\/10{border-color: hsl(var(--primary)/.1);}










.dx-archive-cards .bg-\[--btn-bg\]{background-color: var(--btn-bg);}






















.dx-archive-cards .bg-primary{background-color: hsl(var(--primary));}

































.dx-archive-cards .from-secondary\/10{--tw-gradient-from: hsl(var(--secondary)/0.1) var(--tw-gradient-from-position); --tw-gradient-to: hsl(var(--secondary)/0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from),var(--tw-gradient-to);}






.dx-archive-cards .via-transparent{--tw-gradient-to: rgb(0 0 0/0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from),transparent var(--tw-gradient-via-position),var(--tw-gradient-to);}








.dx-archive-cards .to-transparent{--tw-gradient-to: transparent var(--tw-gradient-to-position);}





















.dx-archive-cards .px-0{padding-left: 0px; padding-right: 0px;}




.dx-archive-cards .px-3\.5{padding-left: 0.875rem; padding-right: 0.875rem;}







.dx-archive-cards .py-1\.5{padding-top: 0.375rem; padding-bottom: 0.375rem;}
.dx-archive-cards .py-10{padding-top: 2.5rem; padding-bottom: 2.5rem;}
















































.dx-archive-cards .font-mono{font-family: var(--font-geist-mono);}












.dx-archive-cards .text-base\/6{font-size: 1rem; line-height: 1.5rem;}


.dx-archive-cards .text-xl{font-size: 1.25rem; line-height: 1.75rem;}






.dx-archive-cards .uppercase{text-transform: uppercase;}















.dx-archive-cards .tracking-widest{letter-spacing: 0.1em;}
.dx-archive-cards .text-\[--btn-text\]{color: var(--btn-text);}




















.dx-archive-cards .text-secondary{color: hsl(var(--secondary));}














.dx-archive-cards .opacity-0{opacity: 0;}



.dx-archive-cards .opacity-40{opacity: 0.4;}



.dx-archive-cards .opacity-75{opacity: 0.75;}


























.dx-archive-cards .duration-100{transition-duration: 0.1s;}











.dx-archive-cards .\[--btn-bg\:transparent\]{--btn-bg: transparent;}


.dx-archive-cards .\[--btn-border\:theme\(colors\.primary\/25\%\)\]{--btn-border: hsl(var(--primary)/25%);}




.dx-archive-cards .\[--btn-hover\:theme\(colors\.secondary\/20\%\)\]{--btn-hover: hsl(var(--secondary)/20%);}


.dx-archive-cards .\[--btn-text\:theme\(colors\.primary\)\]{--btn-text: hsl(var(--primary));}















.dx-archive-cards .hover\:bg-\[--btn-hover\]:hover{background-color: var(--btn-hover);}














.dx-archive-cards .focus\:outline-none:focus{outline: transparent solid 2px; outline-offset: 2px;}











.dx-archive-cards .group:hover .group-hover\:pointer-events-auto{pointer-events: auto;}
.dx-archive-cards .group:hover .group-hover\:-inset-3{inset: -0.75rem;}
.dx-archive-cards .group:hover .group-hover\:-inset-6{inset: -1.5rem;}
.dx-archive-cards .group:hover .group-hover\:-right-4{right: -1rem;}
.dx-archive-cards .group:hover .group-hover\:bottom-3{bottom: 0.75rem;}


.dx-archive-cards .group:hover .group-hover\:-translate-x-4,.dx-archive-cards .group\/heading:hover .group-hover\/heading\:translate-x-1{transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}
.dx-archive-cards .group:hover .group-hover\:-translate-x-4{--tw-translate-x: -1rem;}
.dx-archive-cards .group:hover .group-hover\:translate-x-4{--tw-translate-x: 1rem;}
.dx-archive-cards .group:hover .group-hover\:-rotate-3,.dx-archive-cards .group:hover .group-hover\:translate-x-4{transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}
.dx-archive-cards .group:hover .group-hover\:-rotate-3{--tw-rotate: -3deg;}
.dx-archive-cards .group:hover .group-hover\:rotate-3{--tw-rotate: 3deg;}
.dx-archive-cards .group:hover .group-hover\:rotate-3,.dx-archive-cards .group:hover .group-hover\:skew-y-\[12deg\]{transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}
.dx-archive-cards .group:hover .group-hover\:skew-y-\[12deg\]{--tw-skew-y: 12deg;}
.dx-archive-cards .group:hover .group-hover\:scale-110{--tw-scale-x: 1.1; --tw-scale-y: 1.1;}
.dx-archive-cards .group:hover .group-hover\:scale-110,.dx-archive-cards .group:hover .group-hover\:scale-75{transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}
.dx-archive-cards .group:hover .group-hover\:scale-75{--tw-scale-x: .75; --tw-scale-y: .75;}

.dx-archive-cards .group:hover .group-hover\:bg-\[--btn-hover\]{background-color: var(--btn-hover);}
.dx-archive-cards .group:hover .group-hover\:bg-secondary\/5{background-color: hsl(var(--secondary)/.05);}
.dx-archive-cards .group:hover .group-hover\:bg-white\/10{background-color: rgba(255, 255, 255, 0.1);}
.dx-archive-cards .group:hover .group-hover\:text-primary{color: hsl(var(--primary));}
.dx-archive-cards .group:hover .group-hover\:text-white{--tw-text-opacity: 1; color: rgb(255 255 255/var(--tw-text-opacity,1));}
.dx-archive-cards .group:hover .group-hover\:underline{text-decoration-line: underline;}
.dx-archive-cards .group:hover .group-hover\:underline-offset-8{text-underline-offset: 8px;}

.dx-archive-cards .group:hover .group-hover\:opacity-100,.dx-archive-cards .group\/heading:hover .group-hover\/heading\:opacity-100{opacity: 1;}
.dx-archive-cards .group:hover .group-hover\:opacity-70{opacity: 0.7;}
.dx-archive-cards .group:hover .group-hover\:opacity-75{opacity: 0.75;}
.dx-archive-cards .data-\[disabled\]\:opacity-50[data-disabled]{opacity: 0.5;}
.dx-archive-cards .data-\[focus\]\:outline[data-focus]{outline-style: solid;}
.dx-archive-cards .data-\[focus\]\:outline-2[data-focus]{outline-width: 2px;}
.dx-archive-cards .data-\[focus\]\:outline-offset-2[data-focus]{outline-offset: 2px;}
.dx-archive-cards .data-\[focus\]\:outline-blue-500[data-focus]{outline-color: rgb(59, 130, 246);}
.dx-archive-cards .group[data-state-open="true"] .group-data-\[state-open\=true\]\:bg-dawn{background-color: hsl(var(--color-dawn));}









































@media (min-width: 640px){























































.dx-archive-cards .sm\:text-sm{font-size: 0.875rem; line-height: 1.25rem;}

}
@media (min-width: 768px){















.dx-archive-cards .md\:flex-row{flex-direction: row;}

























}
@media (min-width: 1024px){






















.dx-archive-cards .lg\:block{display: block;}






















.dx-archive-cards .lg\:grid-cols-3{grid-template-columns: repeat(3, minmax(0px, 1fr));}


.dx-archive-cards .lg\:flex-col{flex-direction: column;}













.dx-archive-cards .lg\:-space-x-px > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse: 0; margin-right: calc(-1px * var(--tw-space-x-reverse)); margin-left: calc(-1px * calc(1 - var(--tw-space-x-reverse)));}








.dx-archive-cards .lg\:border-l{border-left-width: 1px;}


.dx-archive-cards .lg\:border-t-0{border-top-width: 0px;}


.dx-archive-cards .lg\:p-8{padding: 2rem;}




















.dx-archive-cards .lg\:hover\:bg-gradient-to-b:hover{background-image: linear-gradient(to bottom,var(--tw-gradient-stops));}}
@media (min-width: 1280px){

















}
@media (min-width: 1536px){



}
.dx-archive-cards .\[\&\>\[data-slot\=icon\]\]\:-mx-0\.5 > [data-slot="icon"]{margin-left: -0.125rem; margin-right: -0.125rem;}
.dx-archive-cards .\[\&\>\[data-slot\=icon\]\]\:my-0\.5 > [data-slot="icon"]{margin-top: 0.125rem; margin-bottom: 0.125rem;}
.dx-archive-cards .\[\&\>\[data-slot\=icon\]\]\:size-4 > [data-slot="icon"]{width: 1rem; height: 1rem;}


.dx-archive-cards .\[\&\>\[data-slot\=icon\]\]\:shrink-0 > [data-slot="icon"]{flex-shrink: 0;}
@media (min-width: 640px){.dx-archive-cards .\[\&\>\[data-slot\=icon\]\]\:sm\:my-1 > [data-slot="icon"]{margin-top: 0.25rem; margin-bottom: 0.25rem;}
.dx-archive-cards .\[\&\>\[data-slot\=icon\]\]\:sm\:size-3 > [data-slot="icon"]{width: 0.75rem; height: 0.75rem;}

}















@media (min-width: 1280px){
}





























@media (pointer: fine){.dx-archive-cards .\[\@media\(pointer\:fine\)\]\:hidden{display: none;}}
.dx-archive-cards .group:focus-within .group-hover\:pointer-events-auto{pointer-events: auto;}
.dx-archive-cards .group:focus-within .group-hover\:-inset-3{inset: -0.75rem;}
.dx-archive-cards .group:focus-within .group-hover\:-inset-6{inset: -1.5rem;}
.dx-archive-cards .group:focus-within .group-hover\:-right-4{right: -1rem;}
.dx-archive-cards .group:focus-within .group-hover\:bottom-3{bottom: 0.75rem;}
.dx-archive-cards .group:focus-within .group-hover\:-translate-x-4,.dx-archive-cards .group\/heading:hover .group-hover\/heading\:translate-x-1{transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}
.dx-archive-cards .group:focus-within .group-hover\:-translate-x-4{--tw-translate-x: -1rem;}
.dx-archive-cards .group:focus-within .group-hover\:translate-x-4{--tw-translate-x: 1rem;}
.dx-archive-cards .group:focus-within .group-hover\:-rotate-3,.dx-archive-cards .group:focus-within .group-hover\:translate-x-4{transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}
.dx-archive-cards .group:focus-within .group-hover\:-rotate-3{--tw-rotate: -3deg;}
.dx-archive-cards .group:focus-within .group-hover\:rotate-3{--tw-rotate: 3deg;}
.dx-archive-cards .group:focus-within .group-hover\:rotate-3,.dx-archive-cards .group:focus-within .group-hover\:skew-y-\[12deg\]{transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}
.dx-archive-cards .group:focus-within .group-hover\:skew-y-\[12deg\]{--tw-skew-y: 12deg;}
.dx-archive-cards .group:focus-within .group-hover\:scale-110{--tw-scale-x: 1.1; --tw-scale-y: 1.1;}
.dx-archive-cards .group:focus-within .group-hover\:scale-110,.dx-archive-cards .group:focus-within .group-hover\:scale-75{transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}
.dx-archive-cards .group:focus-within .group-hover\:scale-75{--tw-scale-x: .75; --tw-scale-y: .75;}
.dx-archive-cards .group:focus-within .group-hover\:bg-\[--btn-hover\]{background-color: var(--btn-hover);}
.dx-archive-cards .group:focus-within .group-hover\:bg-secondary\/5{background-color: hsl(var(--secondary)/.05);}
.dx-archive-cards .group:focus-within .group-hover\:bg-white\/10{background-color: rgba(255, 255, 255, 0.1);}
.dx-archive-cards .group:focus-within .group-hover\:text-primary{color: hsl(var(--primary));}
.dx-archive-cards .group:focus-within .group-hover\:text-white{--tw-text-opacity: 1; color: rgb(255 255 255/var(--tw-text-opacity,1));}
.dx-archive-cards .group:focus-within .group-hover\:underline{text-decoration-line: underline;}
.dx-archive-cards .group:focus-within .group-hover\:underline-offset-8{text-underline-offset: 8px;}
.dx-archive-cards .group:focus-within .group-hover\:opacity-100,.dx-archive-cards .group\/heading:hover .group-hover\/heading\:opacity-100{opacity: 1;}
.dx-archive-cards .group:focus-within .group-hover\:opacity-70{opacity: 0.7;}
.dx-archive-cards .group:focus-within .group-hover\:opacity-75{opacity: 0.75;}
.dx-archive-cards .lg\:hover\:bg-gradient-to-b:focus-within{background-image: linear-gradient(to bottom,var(--tw-gradient-stops));}}
.dx-archive-cards a:focus-visible{outline:2px solid #fff;outline-offset:4px}
@media(prefers-reduced-motion:reduce){.dx-archive-cards *{transition-duration:0s!important}}
@media(prefers-reduced-motion:reduce){.dx-archive-cards canvas{visibility:hidden}}