body { background: #f4f7f6; font-family: 'Segoe UI', sans-serif; }
.nts-form-container { max-width: 900px; margin: 30px auto; background: #fff; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); overflow: hidden; }
.form-banner { background: #800000; color: #fff; padding: 20px; text-align: center; font-size: 22px; font-weight: bold; }
.card { padding: 20px; border-bottom: 1px solid #eee; }
.title { color: #800000; font-size: 14px; font-weight: bold; margin-bottom: 15px; border-left: 4px solid #800000; padding-left: 10px; }
.row, .grid-4 { display: grid; gap: 15px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
.field label { font-size: 11px; color: #555; font-weight: bold; display: block; margin-bottom: 5px; }
.field input { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; box-sizing: border-box; }
.locked { background: #f9f9f9; color: #777; }
.grp { display: flex; border: 1px solid #ddd; border-radius: 4px; overflow: hidden; }
.pre, .suf { background: #eee; padding: 10px; font-weight: bold; font-size: 14px; }
.grp input { border: none !important; }
.summary { background: #fff8f8; padding: 20px; border-top: 2px solid #800000; }
.sum-row { display: flex; justify-content: space-between; margin-bottom: 8px; font-size: 15px; }
.final { font-size: 20px; color: #800000; font-weight: bold; border-top: 1px solid #ddd; padding-top: 10px; }
.save-btn { width: 100%; padding: 20px; background: #800000; color: #fff; border: none; font-size: 18px; font-weight: bold; cursor: pointer; }
.save-btn:hover { background: #a00000; }
.header-logo {
            width: auto;           /* Changed from 110px to auto */
            height: auto;          /* Ensures it stays proportional */
            max-width: 100%;       /* Prevents the logo from overflowing the page width */
            object-fit: contain;
            margin-bottom: 4px;
        }