/* Typography */
.zip-widget, .zip-widget * { font-family: 'Roboto', Arial, sans-serif; }
.zip-widget h2 { font-size: 22px; font-weight: 700; color: #060B3A; margin: 0 0 8px; }
.zip-widget p, .zip-widget .zw-help { font-size: 16px; color: #1f2937; }

/* Container */
.zip-widget { border: 1px solid #d9e2ef; border-radius: 12px; padding: 18px; background: #fff; max-width: 980px; margin: 18px auto; }

/* Form */
.zip-widget .zw-form { margin-top: 10px; }
.zip-widget .zw-input-row { display: flex; gap: 10px; }
.zip-widget .zip-input {
  flex: 1; padding: 12px 14px; border: 1px solid #cbd5e1; border-radius: 10px; font-size: 16px;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.zip-widget .zip-input:focus { border-color: #3AACE2; box-shadow: 0 0 0 3px rgba(58,172,226,0.25); outline: none; }

/* Buttons */
.zip-widget .zw-btn {
  background: #3AACE2; color: #fff; padding: 12px 18px; border: none; border-radius: 10px;
  font-weight: 700; cursor: pointer; transition: .2s ease all; box-shadow: 0 2px 5px rgba(0,0,0,0.08);
}
.zip-widget .zw-btn:hover { background: #1B3B73; }
.zip-widget .zw-btn-secondary { background: #e6f4fb; color: #060B3A; border: 1px solid #d9e2ef; }
.zip-widget .zw-btn-secondary:hover { background: #1B3B73; color: #fff; border-color: #1B3B73; }

/* Results */
.zip-widget .zw-results { margin-top: 16px; }
.zip-widget .zw-results > p { margin: 0 0 8px; color: #060B3A; font-weight: 700; }
.zip-widget .zw-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.zip-widget .zw-card { border: 1px solid #d9e2ef; border-radius: 12px; padding: 14px; text-align: center; background: #fff; }
.zip-widget .zw-logo { max-height: 44px; margin-bottom: 10px; }
.zip-widget .zw-card h3 { font-weight: 700; color: #060B3A; margin: 6px 0; }
.zip-widget .zw-meta { color: #475569; margin-bottom: 10px; }
.zip-widget .zw-ctas { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }

/* Modal */
.zip-widget .zw-modal { position: fixed; inset: 0; background: rgba(0,0,0,0.5); display: none; justify-content: center; align-items: center; padding: 16px; z-index: 9999; }
.zip-widget .zw-modal[aria-hidden="false"] { display: flex; }
.zip-widget .zw-modal-card { background: #fff; border-radius: 12px; padding: 20px; max-width: 500px; text-align: center; border: 1px solid #d9e2ef; }

/* Responsive */
@media (max-width: 640px) {
  .zip-widget .zw-input-row { flex-direction: column; }
  .zip-widget .zw-cards { grid-template-columns: 1fr; }
}
