/* ---------------------------------------------------------------------------
 * Medical Records Requests page + homepage notice
 * --------------------------------------------------------------------------- */

.mr-page, .mr-notice { --mr-navy: #0f3c6e; --mr-blue: #326e9b; --mr-tint: #eef4fa; --mr-line: #c9d9e8; --mr-text: #3c4650; }

/* Page --------------------------------------------------------------------- */

.mr-page { max-width: 980px; margin: 10px auto 40px; padding: 0 10px; color: var(--mr-text); font-size: 15px; line-height: 1.65; }
.mr-page .mr-head { text-align: center; margin-bottom: 26px; }
.mr-page h2.mr-title { color: var(--mr-navy); font-size: 38px; line-height: 1.2; font-weight: 700; margin: 0 0 14px; }
.mr-page .mr-rule { width: 110px; height: 3px; background: var(--mr-blue); margin: 0 auto 22px; border: 0; }
.mr-page .mr-head p { font-size: 17px; margin: 0 auto 10px; max-width: 820px; }
.mr-page .mr-head strong { color: var(--mr-navy); }

.mr-panel { display: flex; flex-wrap: wrap; background: var(--mr-tint); border: 1px solid var(--mr-line); border-radius: 10px; padding: 30px 10px; margin: 0 0 26px; }
.mr-panel .mr-col { flex: 1 1 380px; padding: 0 28px; box-sizing: border-box; }
.mr-panel .mr-col + .mr-col { border-left: 1px solid var(--mr-line); }
.mr-panel h3 { color: var(--mr-navy); font-size: 22px; line-height: 1.3; font-weight: 700; text-align: center; margin: 0 0 14px; }
.mr-panel .mr-col-request p { text-align: center; font-size: 16px; }

.mr-icon { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; margin: 0 auto 14px; border-radius: 50%; background: var(--mr-navy); color: #fff; }
.mr-icon svg { width: 30px; height: 30px; }

.mr-email-btn, .mr-email-btn:visited { display: inline-flex; align-items: center; gap: 12px; background: var(--mr-navy); color: #fff !important; font-size: 20px; font-weight: 700; text-decoration: none; padding: 16px 30px; border-radius: 8px; margin: 8px 0 6px; word-break: break-all; transition: background .2s; }
.mr-email-btn:hover, .mr-email-btn:focus { background: var(--mr-blue); color: #fff; }
.mr-email-btn svg { width: 24px; height: 24px; flex: none; }
.mr-btn-wrap { text-align: center; }

.mr-checklist { list-style: none; margin: 0; padding: 0; }
.mr-checklist li { position: relative; padding: 6px 0 6px 34px; font-size: 16px; border-bottom: 1px solid var(--mr-line); }
.mr-checklist li:last-child { border-bottom: 0; }
.mr-checklist li:before { content: ""; position: absolute; left: 4px; top: 10px; width: 18px; height: 18px; border-radius: 50%; background: var(--mr-blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 12px no-repeat; }

.mr-foot { text-align: center; }
.mr-foot p { margin: 0 auto 10px; max-width: 820px; }
.mr-foot .mr-security { font-weight: 700; color: var(--mr-navy); }
.mr-foot .mr-thanks { font-style: italic; margin-top: 18px; }

@media only screen and (max-width: 767px) {
	.mr-page h2.mr-title { font-size: 28px; }
	.mr-panel { padding: 20px 0; }
	.mr-panel .mr-col { padding: 0 18px; }
	.mr-panel .mr-col + .mr-col { border-left: 0; border-top: 1px solid var(--mr-line); margin-top: 22px; padding-top: 22px; }
	.mr-email-btn, .mr-email-btn:visited { font-size: 16px; padding: 14px 18px; }
}

/* Homepage notice ---------------------------------------------------------- */

.mr-notice { background: var(--mr-navy); color: #fff; padding: 18px 0; margin-bottom: 20px; }
.mr-notice .columns { margin-bottom: 0; }
.mr-notice .mr-notice-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.mr-notice p { margin: 0; color: #fff; font-size: 16px; line-height: 1.5; flex: 1 1 420px; }
.mr-notice strong { color: #fff; }
.mr-notice a.mr-notice-btn, .mr-notice a.mr-notice-btn:visited { display: inline-block; background: #fff; color: var(--mr-navy); font-weight: 700; text-decoration: none; padding: 10px 22px; border-radius: 6px; white-space: nowrap; }
.mr-notice a.mr-notice-btn:hover, .mr-notice a.mr-notice-btn:focus { background: var(--mr-tint); color: var(--mr-navy); }
