    /* --- Layout (table-less) --- */
    :root { --brand:#001871; --ink:#222; --bg:#fff; --card:#fff; --line:#d9d9e0; }
    html, body { 
      margin: 0; 
      padding: 0; 


    }
    body {
      font-family: "Rajdhani", sans-serif;
      font-size: 1rem;
      line-height: 1.5em;
      font-weight: 400;
      color: var(--ink);
      background: var(--bg);
    }

    /* Headings */
    h1, h3, h4 { color: var(--brand); margin-top: 1.25em; }
    h1 {font-size: 2rem; margin-top: 0; }
    h2 {font-size: 1.75rem; color: rgb(51, 71, 91);}
    h3 {font-size: 1.5rem; color: rgb(51, 71, 91);}
    h4 {font-size: 1.15rem;}

    p {font-size: 1rem;}

    /* Lists & links */
    ul { padding-left: 1.25rem; }
    a { color: var(--brand); }

    hr {
      border: 0;
      color: rgba(0,0,0,.15);
      margin: 1.5em 0;
      border-top: 1px solid;
    }
    img {
      max-width: 100%;
      height: auto;
      margin-left: auto;
      margin-right: auto;
      display: block; /* Optional: removes extra space below the image */
    }
    /* Utility spacing */
    .spacer { height: 1rem; }
    .spacer-lg { height: 1.5rem; }

    .grayText {
      color: rgb(51, 71, 91);
    }

    /* Form styling */
    button, input, select, textarea {
        font-family: inherit;
        font-size: 100%;
        box-sizing: border-box; /* Ensures padding/border are included in width calculations */
    }
    label {
        display: block; /* Puts the label on its own line */
        margin-bottom: 5px;
        font-weight: bold;
        color: #333;
    }
    input[type="text"],
    input[type="email"],
    input[type="password"],
    textarea,
    select {
        width: 100%;
        padding: 10px;
        border: 1px solid #ccc;
        border-radius: 4px;
        /* Ensure sufficient contrast for readability */
        color: #333; 
        background-color: #fff;
    }
    input:focus, textarea:focus, select:focus {
        border-color: #007bff; /* Highlight the border when focused */
        outline: none; /* Removes default outline to use border style */
        box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25); /* Adds a subtle glow */
    }

    button[type="submit"] {
        display: block;
        width: 100%; /* Optional: Make the button full width */
        padding: 12px;
        background-color: #007bff; /* A distinct, bold color */
        color: white;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        font-size: 16px;
        margin-top: 20px;
    }

    button[type="submit"]:hover {
        background-color: #0056b3; /* Visual feedback on hover */
    }

    .my-box { 
        width: 90%;
        padding: 20px;
        border: 1px solid black;
        margin: 5px;
        background-color: #ececec;
        border-radius: 10px; /* Creates rounded corners */
    }
    .centered-container {
      display: flex;
      justify-content: center; /* Centers horizontally */
      align-items: center;     /* Centers vertically */
      /*height: 100vh;*/           /* Makes the container fill the full viewport height */
      /* Add a border or background to see the container if needed */
      border: 0px solid black
    }
    .center-horizontal {
      text-align: center;
    }
