body {
            display: flex;
            flex-direction: column;
            min-height: 100vh;
        }
        .main-content {
            flex-grow: 1;
            margin-top: -100px; /* Assuming this negative margin is intended with your fixed header */
        }
        .verify-cert-section { /* Renamed from .certification-section */
            padding: 60px 0;
            background: #f4f7f6;
        }
        .verify-cert-container { /* Renamed from .certification-container */
            max-width: 550px;
            margin: 0 auto;
            background: #fff;
            padding: 35px 40px;
            border-radius: 12px;
            box-shadow: 0 8px 25px rgba(0,0,0,0.08);
            text-align: center;
        }
        .verify-cert-container h1 { /* Renamed from .certification-container h1 */
            color: #2c3e50;
            margin-bottom: 10px;
            font-size: 26px;
            font-weight: 600;
        }
        .verify-cert-container p { /* Renamed from .certification-container p */
            color: #555;
            margin-bottom: 25px;
            font-size: 15px;
        }
        .verify-cert-form .form-control { /* Renamed from .certification-form .form-control */
            height: 48px;
            border-radius: 8px;
            border: 1px solid #ced4da;
            box-shadow: none;
            font-size: 16px;
            margin-bottom: 0px; /* Adjusted from 0px to allow space for help-block if needed */
            transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
        }
        .verify-cert-form .form-control:focus { /* Renamed from .certification-form .form-control:focus */
            border-color: #007bff;
            box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
        }
        .verify-cert-form .btn-verify { /* Renamed from .certification-form .btn-verify */
            background-color: #1E483A;
            color: white;
            padding: 12px 30px;
            font-size: 17px;
            font-weight: 500;
            border-radius: 8px;
            transition: all 0.3s ease;
            border: none;
            letter-spacing: 0.5px;
            margin-top: 20px;
        }
        .verify-cert-form .btn-verify:hover { /* Renamed from .certification-form .btn-verify:hover */
            opacity: 0.9;
            box-shadow: 0 4px 15px rgba(0,123,255,0.3);
        }
        .logo-container {
            margin-bottom: 25px;
        }
        .logo-container img {
            max-height: 45px;
        }

        /* --- START: Logo Animation --- */
        @keyframes pulseLogo {
            0% {
                transform: scale(1);
                opacity: 0.9;
            }
            50% {
                transform: scale(1.08); /* Slightly larger */
                opacity: 1;
            }
            100% {
                transform: scale(1);
                opacity: 0.9;
            }
        }

        .animated-logo {
            animation-name: pulseLogo;
            animation-duration: 2.5s;       /* How long one cycle takes */
            animation-iteration-count: infinite; /* Loop forever */
            animation-timing-function: ease-in-out; /* Smooth acceleration/deceleration */
        }
        /* --- END: Logo Animation --- */

        .modal-content {
            border-radius: 8px;
        }
        .modal-header {
            background-color: #f8d7da;
            color: #721c24;
            border-bottom: 1px solid #f5c6cb;
            border-top-left-radius: 8px;
            border-top-right-radius: 8px;
        }
        .modal-header .close {
            color: #721c24;
            opacity: 0.7;
        }
        .has-error .form-control { /* Bootstrap's default error styling for input */
            border-color: #a94442;
            -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
            box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        }
        .has-error .form-control:focus { /* Bootstrap's default error styling for focused input */
            border-color: #843534;
            -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px #ce8483;
            box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px #ce8483;
        }
        .help-block { /* Bootstrap's default styling for help text below input */
            display: block; /* Ensure it's visible when text is added */
            margin-top: 5px;
            margin-bottom: 10px; /* Provides spacing if button is directly after */
            color: #a94442; /* Error text color */
            font-size: 13px;
        }