.services .service-item{background-color:var(--surface-color);text-align:center;border:1px solid color-mix(in srgb, var(--default-color), transparent 85%);height:100%;padding:40px 20px;transition:all .3s ease-in-out}.services .service-item .icon{background:var(--accent-color);width:64px;height:64px;transform-style:preserve-3d;border-radius:4px;justify-content:center;align-items:center;margin:0 auto 20px;transition:all .3s;display:flex}.services .service-item .icon i{color:var(--contrast-color);font-size:28px;transition:all .3s ease-in-out}.services .service-item .icon:before{content:"";background:color-mix(in srgb, var(--accent-color), transparent 80%);border-radius:5px;width:100%;height:100%;transition:all .3s ease-out;position:absolute;top:-8px;left:-8px;transform:translateZ(-1px)}.services .service-item h3{margin:10px 0 15px;font-size:22px;font-weight:700}.services .service-item p{margin-bottom:0;font-size:14px;font-weight:400;line-height:24px}.services .service-item:hover{background:var(--accent-color);border-color:var(--accent-color)}.services .service-item:hover .icon{background:var(--surface-color)}.services .service-item:hover .icon i{color:var(--accent-color)}.services .service-item:hover .icon:before{background:color-mix(in srgb, var(--background-color), transparent 70%)}.services .service-item:hover h3,.services .service-item:hover p{color:var(--contrast-color)}
