@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

        body {
            font-family: 'Poppins', sans-serif;
        }

        :root {
            --webtec-blue: #1B3A52;
            --webtec-green: #2D9B6B;
        }

        .bg-webtec-blue {
            background-color: var(--webtec-blue);
        }

        .bg-webtec-green {
            background-color: var(--webtec-green);
        }

        .text-webtec-blue {
            color: var(--webtec-blue);
        }

        .text-webtec-green {
            color: var(--webtec-green);
        }

        .contact-card {
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            border-left: 4px solid var(--webtec-green);
            position: relative;
            overflow: hidden;
        }

        .contact-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(135deg, rgba(45, 155, 107, 0.05), transparent);
            opacity: 0;
            transition: opacity 0.4s ease;
        }

        .contact-card:hover::before {
            opacity: 1;
        }

        .contact-card:hover {
            transform: translateY(-8px) scale(1.02);
            box-shadow: 0 20px 40px rgba(27, 58, 82, 0.2);
            border-left-width: 6px;
        }

        .contact-icon {
            width: 64px;
            height: 64px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 16px;
            background: linear-gradient(135deg, rgba(27, 58, 82, 0.1), rgba(45, 155, 107, 0.15));
            transition: all 0.3s ease;
        }

        .contact-card:hover .contact-icon {
            transform: rotate(5deg) scale(1.1);
            background: linear-gradient(135deg, rgba(27, 58, 82, 0.15), rgba(45, 155, 107, 0.25));
        }

        .form-input {
            transition: all 0.3s ease;
            border: 2px solid #e5e7eb;
        }

        .form-input:focus {
            outline: none;
            border-color: var(--webtec-green);
            box-shadow: 0 0 0 3px rgba(45, 155, 107, 0.1);
        }

        .submit-btn {
            position: relative;
            overflow: hidden;
            transition: all 0.3s ease;
        }

        .submit-btn::before {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            width: 0;
            height: 0;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.3);
            transform: translate(-50%, -50%);
            transition: width 0.6s, height 0.6s;
        }

        .submit-btn:hover::before {
            width: 300px;
            height: 300px;
        }

        .map-container {
            position: relative;
            border-radius: 16px;
            overflow: hidden;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
        }