.services .service-item{display:flex;background-color:var(--surface-color);border-radius:12px;padding:2rem;height:100%;position:relative;overflow:hidden;box-shadow:0 5px 20px rgba(0,0,0,0.03);transition:all 0.4s ease}.services .service-item::before{content:'';position:absolute;left:0;top:0;height:100%;width:4px;background-color:var(--accent-color);transform:scaleY(0);transform-origin:bottom;transition:transform 0.4s cubic-bezier(0.65, 0, 0.35, 1)}.services .service-item:hover{box-shadow:0 10px 30px rgba(0,0,0,0.08);transform:translateY(-5px)}.services .service-item:hover::before{transform:scaleY(1)}.services .service-item:hover .service-icon{background-color:var(--accent-color);color:var(--contrast-color);transform:rotateY(180deg)}.services .service-item:hover .service-icon i{transform:rotateY(180deg)}.services .service-item:hover .service-link i{transform:translateX(5px)}.services .service-icon{flex-shrink:0;width:70px;height:70px;border-radius:12px;background-color:color-mix(in srgb, var(--accent-color), transparent 90%);color:var(--accent-color);display:flex;align-items:center;justify-content:center;margin-right:1.5rem;transition:all 0.5s ease}.services .service-icon i{font-size:2rem;transition:transform 0.5s ease}.services .service-content{flex-grow:1}.services .service-content h3{font-size:1.4rem;margin-bottom:1rem;font-weight:700;color:var(--heading-color)}.services .service-content p{margin-bottom:1.25rem;color:color-mix(in srgb, var(--default-color), transparent 20%)}.services .service-link{display:inline-flex;align-items:center;color:var(--accent-color);font-weight:600;text-decoration:none;transition:color 0.3s ease}.services .service-link span{margin-right:0.5rem}.services .service-link i{transition:transform 0.3s ease}.services .service-link:hover{color:color-mix(in srgb, var(--accent-color), transparent 25%)}@media (max-width: 767.98px){.services .service-item{padding:1.5rem;margin-bottom:1rem}.services .service-icon{width:60px;height:60px;margin-right:1rem}.services .service-icon i{font-size:1.5rem}.services .service-content h3{font-size:1.2rem;margin-bottom:0.75rem}.services .service-content p{margin-bottom:1rem;font-size:0.95rem}}@media (max-width: 575.98px){.services .service-item{flex-direction:column;text-align:center}.services .service-item::before{width:100%;height:4px;transform:scaleX(0);transform-origin:left}.services .service-item:hover::before{transform:scaleX(1)}.services .service-icon{margin-right:0;margin-bottom:1.25rem}.services .service-link{justify-content:center}}