:root { font-family: Arial, Helvetica, sans-serif; color: #1f2937; background: #ffffff; }
* { box-sizing: border-box; }
body { margin: 0; }
.container { width: min(900px, calc(100% - 2rem)); margin: 0 auto; }
.site-header { background: #0f4c5c; padding: 1rem 0; }
.brand { color: white; text-decoration: none; font-size: 1.25rem; font-weight: 700; }
main { padding: 2rem 0; }
.card { background: white; border-radius: 12px; padding: 2rem; box-shadow: 0 8px 24px rgba(0,0,0,.08); }
h1 { margin-top: 0; color: #0f4c5c; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1rem; }
.field { display: flex; flex-direction: column; gap: .35rem; }
label, legend { font-weight: 700; }
input { width: 100%; padding: .7rem; border: 1px solid #9ca3af; border-radius: 6px; font: inherit; }
fieldset { margin: 1.5rem 0; border: 1px solid #d1d5db; border-radius: 8px; padding: 1rem; }
.radio-option { display: flex; align-items: center; gap: .6rem; margin: .7rem 0; font-weight: 400; }
.radio-option input { width: auto; }
.actions { display: flex; gap: .75rem; }
button { border: 0; border-radius: 6px; padding: .75rem 1rem; font: inherit; font-weight: 700; cursor: pointer; }
.primary { background: #0f4c5c; color: white; }
.secondary { background: #e5e7eb; color: #1f2937; }
.validation { color: #b91c1c; }
.alert { padding: 1rem; border-radius: 6px; margin: 1rem 0; }
.alert.success { background: #dcfce7; color: #166534; }
.alert.error { background: #fee2e2; color: #991b1b; }
.site-footer { padding: 1.5rem 0; color: #6b7280; }

.field .checkbox-line {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 8px;
}

    .field .checkbox-line input[type="checkbox"] {
        display: inline-block;
        width: auto;
        flex: 0 0 auto;
        margin: 3px 0 0 0;
    }

    .field .checkbox-line label {
        display: block;
        width: auto;
        flex: 1;
        margin: 0;
    }

.quantity-line {
    display: flex;
    align-items: center;
    gap: 10px;
}

    .quantity-line label {
        margin: 2% 5%;
    }

    .quantity-line select {
        width: auto;
        min-width: 60px;
    }

.question-label {
    display: block;
    margin-left: 5%;
}

.yes-no-options {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-left: 5%;
}

    .yes-no-options .radio-option {
        display: flex;
        align-items: center;
        gap: 5px;
    }

.required-field {
    color: red;
    font-weight: bold;
}
@media (max-width: 650px) { .form-grid { grid-template-columns: 1fr; } .card { padding: 1.25rem; } }
