/* Arizona Interventional Associates on Framework 1: class-only rules layered on ks-fw1.css (the Framework 1 layer
   from the Keystone build). Source: fw1/aia-fw1.css in the build folder, deployed to /wp-content/uploads/aia-fw1/aia-fw1.css
   and loaded by novamira-sandbox/aia-fw1.php after ks-fw1.css. */

/* 1. Brand: Framework 1 reads --uro-*; map them to AIA's colours (prod: navy #193b69, blue #0058a3, gold #b69b56) */
html:root {
	--uro-primary: #193b69;
	--uro-secondary: #193b69;
	--uro-accent: #0058a3;
	--uro-border-fade: #009ddc;
	--az-gold: #b69b56;
	--az-gold-dark: #9c8343;
	--az-blue: #0058a3;
	--az-sky: #e8f3fb;
}

/* 2. Header: wide logo lockup; AUUA logo on the right where Framework 1 has the appointment button */
.az-auua-logo img, img.az-auua-logo { display: block; width: 210px; height: auto; }
@media (max-width: 1100px) { .az-auua-logo img, img.az-auua-logo { width: 160px; } }
@media (max-width: 767px) { .az-auua-logo { display: none; } }

/* 3. Footer: "Locations" sub-heading under the contact lines */
.az-footer-subhead { margin-top: 14px; }
/* phones (the footer turns navy below 768px): logo, Contact and Locations centred. #brx-footer outranks the
   template's own per-element "align left on phones" settings */
@media (max-width: 767px) {
	#brx-footer .brxe-block:has(.az-footer-contact) { width: 100%; align-items: center; grid-template-columns: minmax(0, 1fr); justify-items: center; }
	#brx-footer .az-footer-contact { width: 100%; }
	#brx-footer #brxe-zvisqn { padding-right: 0; }   /* logo column: the template's 30px right padding pushed the logo off centre */
	#brx-footer .az-footer-contact, #brx-footer .az-footer-contact .brxe-block { align-items: center; justify-content: center; text-align: center; }
	#brx-footer .az-footer-contact .brxe-heading, #brx-footer .az-footer-contact .brxe-text-basic { text-align: center; }
}

/* 4. Page hero: Framework 1 centred hero (fw-hero) with prod's "offered by" line */
.az-hero .fw-hero-inner { width: 100%; display: flex; flex-direction: column; align-items: center; }
.az-hero { padding-bottom: 60px; }
.az-offered { margin: 10px 0 0; font-size: var(--h5-text); font-weight: 600; color: var(--az-gold-dark); text-align: center; }
.az-offered em { font-family: Georgia, "Times New Roman", serif; font-weight: 400; }
.az-hero-intro { max-width: 900px; margin: 18px auto 0; text-align: center; font-size: 20px; line-height: 1.6; }

/* 5. Procedures list (navy band): seven procedures in three columns, READ MORE pills on PAE and HAE */
.az-procedures { background: var(--uro-primary); padding: 60px 0; }
.az-proc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 40px; width: 100%; margin: 0; padding: 0; list-style: none; }
.az-proc { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; margin: 0; padding: 18px 0 18px 34px; position: relative;
	color: var(--uro-white-color); font-size: 18px; line-height: 1.4; border-bottom: 1px solid rgba(255, 255, 255, .18); }
.az-proc::before { content: ""; position: absolute; left: 0; top: 21px; width: 16px; height: 16px; border-radius: 50%;
	background: var(--az-gold); box-shadow: 0 0 0 4px rgba(182, 155, 86, .25); }
.az-proc-name { margin: 0; color: var(--uro-white-color); font-size: 18px; font-weight: 600; line-height: 1.4; }
.az-readmore.brxe-button { padding: 6px 16px; font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
	background: var(--az-gold) !important; border-color: var(--az-gold) !important; color: var(--uro-white-color) !important; }
.az-readmore.brxe-button:hover { background: var(--uro-white-color) !important; color: var(--uro-primary) !important; }
@media (max-width: 991px) { .az-proc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .az-proc-grid { grid-template-columns: minmax(0, 1fr); } .az-procedures { padding: 40px 0; } }

/* 6. Two-column rows (text + jump links, checklist + text, panels) */
.az-band { padding: 60px 0; scroll-margin-top: 120px; }
.az-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 50px; width: 100%; align-items: center; }
.az-split--top { align-items: start; }
.az-col { display: flex; flex-direction: column; gap: 16px; min-width: 0; scroll-margin-top: 120px; }
.az-h2 { margin: 0; color: var(--uro-primary); font-size: var(--h2-text); line-height: 1.15; }
.az-h2 .az-for { font-family: Georgia, "Times New Roman", serif; font-style: italic; font-weight: 400; color: var(--az-gold-dark); }
.az-copy { color: #363636; font-size: 18px; line-height: 1.7; }
.az-copy p { margin: 0 0 1em; }
.az-copy p:last-child { margin-bottom: 0; }
.az-copy sup, .az-h2 sup, .az-lead sup { font-size: .6em; line-height: 0; }
.az-copy sup a, .az-h2 sup a, .az-lead sup a { color: var(--az-blue); text-decoration: none; font-weight: 700; }
[id] { scroll-margin-top: 130px; }
@media (max-width: 991px) { .az-split { grid-template-columns: minmax(0, 1fr); gap: 30px; } .az-band { padding: 40px 0; } }

/* 7. Jump-link box (prod's gold "on this page" box): rounded gold card, white links with arrows */
.az-toc { display: flex; flex-direction: column; width: 100%; padding: 14px 34px; border-radius: 30px; background: var(--az-gold);
	box-shadow: 0 20px 40px -24px rgba(25, 59, 105, .55); }
.az-toc-link { display: block; padding: 16px 0 16px 30px; position: relative; color: var(--uro-white-color); font-size: 17px; font-weight: 600;
	line-height: 1.35; text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, .35); }
.az-toc-link:last-child { border-bottom: 0; }
.az-toc-link::before { content: "›"; position: absolute; left: 4px; top: 12px; font-size: 26px; line-height: 1; }
.az-toc-link:hover { color: var(--uro-primary); }

/* 8. Navy checklist card ("How do I know if PAE is for me?") */
.az-navy-card { display: flex; flex-direction: column; gap: 14px; padding: 46px 44px; border-radius: 40px; background: var(--uro-primary);
	color: var(--uro-white-color); text-align: left; position: relative; overflow: hidden; }
.az-navy-card::before { content: ""; position: absolute; right: -90px; top: -110px; width: 300px; height: 300px; border-radius: 50%;
	border: 3px solid var(--uro-border-fade); opacity: .55; pointer-events: none; }
.az-navy-card .az-h2 { color: var(--uro-white-color); }
.az-gold-lead { margin: 0; color: var(--az-gold); font-size: var(--h5-text); line-height: 1.35; }
.az-checks ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.az-checks li { position: relative; padding-left: 34px; margin: 0; font-size: 18px; line-height: 1.5; }
.az-checks li::before { content: ""; position: absolute; left: 0; top: 4px; width: 20px; height: 20px; border-radius: 50%; background: var(--az-gold); }
.az-checks li::after { content: ""; position: absolute; left: 7px; top: 8px; width: 5px; height: 9px; border: solid var(--uro-white-color);
	border-width: 0 2px 2px 0; transform: rotate(45deg); }
.az-navy-card .az-checks li { color: var(--uro-white-color); }
.az-light-checks li { color: #363636; }
@media (max-width: 767px) { .az-navy-card { padding: 34px 24px; border-radius: 30px; } }

/* 9. Photo panels (Framework 1 fw-cta-panel) */
.az-cta-panel .fw-cta-panel-text { gap: 18px; }
.az-cta-panel--img-left .fw-cta-panel-img { order: -1; }
.az-cta-panel .fw-cta-panel-img, .az-cta-panel .fw-cta-panel-img img { object-fit: cover; }
.az-cta-panel--contain .fw-cta-panel-img, .az-cta-panel--contain .fw-cta-panel-img img { object-fit: contain; background: #fff; }
@media (max-width: 991px) { .az-cta-panel--img-left .fw-cta-panel-img { order: -1; } }

/* 10. Big stat (prod's "75 — 80% ..." and "Greater than 90% ..." quotes) */
.az-quote { margin: 0; color: var(--uro-primary); font-size: clamp(26px, 2.6vw, 36px); font-weight: 700; line-height: 1.25; }
.az-quote-num { display: block; font-size: clamp(56px, 6vw, 84px); line-height: 1; color: var(--az-blue); }
.az-quote-panel { background: var(--az-sky); }
.az-quote--light { color: var(--uro-white-color); }
.az-quote--light .az-quote-num { color: var(--az-gold); }

/* 11. Lead paragraphs (prod's h4 statements) */
.az-lead { margin: 0; color: var(--az-gold-dark); font-size: var(--h5-text); font-weight: 700; line-height: 1.45; }
.az-center { text-align: center; margin-left: auto; margin-right: auto; max-width: 1000px; }
.az-center .az-h2, .az-center .az-lead { text-align: center; }

/* 12. Two outlined cards with a gold header strip (Advantages / Risks) */
.az-cards2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 30px; width: 100%; align-items: stretch; }
.az-card { display: flex; flex-direction: column; border: 1px solid var(--uro-primary); border-radius: 30px; overflow: hidden; background: #fff;
	scroll-margin-top: 130px; }
.az-card-head { margin: 0; padding: 26px 32px; background: var(--az-gold); color: var(--uro-white-color); font-size: var(--h4-text); line-height: 1.2; }
.az-card-body { display: flex; flex-direction: column; gap: 16px; padding: 28px 32px 34px; }
.az-card .az-lead { color: var(--uro-primary); }
@media (max-width: 991px) { .az-cards2 { grid-template-columns: minmax(0, 1fr); } }

/* 13. Dr. Brandis (the promo panel's decorative ring stays behind the bio and fainter) */
.az-doctor.fw-promo::before { opacity: .35; right: -220px; }
/* 13b. Dr. Brandis (Framework 1 navy promo panel): heading, gold subtitle and headshot left, bio right */
.az-doctor.fw-promo { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); align-items: start; }
.az-doctor .fw-promo-text { gap: 18px; }
.az-doctor .az-gold-lead { max-width: 420px; }
.az-doctor-photo, .az-doctor-photo img { display: block; width: 260px; height: 260px; border-radius: 50%; object-fit: cover; object-position: top center;
	box-shadow: 0 0 0 8px rgba(255, 255, 255, .15), 0 0 0 10px var(--az-gold); margin-top: 10px; }
.az-doctor-bio { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 34px; position: relative; z-index: 1; }
.az-doctor-bio .az-copy, .az-doctor-bio .az-copy p { color: var(--uro-white-color); font-size: 16px; line-height: 1.75; }
@media (max-width: 1100px) { .az-doctor-bio { grid-template-columns: minmax(0, 1fr); gap: 1em; } }
@media (max-width: 991px) {
	.az-doctor.fw-promo { grid-template-columns: minmax(0, 1fr); text-align: left; }
	.az-doctor .fw-promo-text { align-items: center; text-align: center; }
	.az-doctor-photo, .az-doctor-photo img { width: 200px; height: 200px; }
}

/* 14. "AIA is here for you": gold heading card beside the copy */
.az-here { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 50px; width: 100%; align-items: center; }
.az-here-card { display: flex; align-items: center; min-height: 240px; padding: 40px; border-radius: 40px; background: var(--az-gold); }
.az-here-card .az-h2 { color: var(--uro-white-color); }
.az-here .az-copy a { color: var(--az-blue); font-weight: 600; }
@media (max-width: 991px) { .az-here { grid-template-columns: minmax(0, 1fr); gap: 24px; } .az-here-card { min-height: 0; padding: 30px; border-radius: 30px; } }

/* 15. References (home): small print */
.az-refs { padding: 10px 0 50px; }
.az-refs .az-h2 { font-size: var(--h4-text); }
.az-refs .az-copy, .az-refs .az-copy p { font-size: 14px; line-height: 1.6; color: #5c5c5c; overflow-wrap: anywhere; }

/* 16. HAE: "What are hemorrhoids?" band (copy + two photos) and the navy "What is HAE / Advantages" panel */
.az-soft { background: var(--uro-light-color); }
.az-hem { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 50px; width: 100%; align-items: start; }
.az-hem-lists { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px 30px; }
.az-hem-photos { display: flex; flex-direction: column; gap: 24px; }
.az-hem-photos img, .az-hem-photo, .az-hem-photo img { display: block; width: 100%; height: auto; border-radius: 30px; }
.az-rule { width: 100%; height: 1px; margin: 14px 0; background: #d9dee5; }
.az-panel-navy { width: 100%; padding: 56px; border-radius: 50px; background: var(--uro-primary); position: relative; overflow: hidden; }
.az-panel-navy::before { content: ""; position: absolute; left: -160px; bottom: -200px; width: 460px; height: 460px; border-radius: 50%;
	border: 3px solid var(--uro-border-fade); opacity: .4; pointer-events: none; }
.az-panel-navy .az-h2, .az-panel-navy .az-copy, .az-panel-navy .az-copy p, .az-panel-navy li { color: var(--uro-white-color); }
.az-panel-navy .az-split { position: relative; z-index: 1; }
@media (max-width: 991px) {
	.az-hem { grid-template-columns: minmax(0, 1fr); }
	.az-hem-photos { flex-direction: row; } .az-hem-photos > * { flex: 1 1 0; min-width: 0; }
	.az-panel-navy { padding: 34px 24px; border-radius: 30px; }
}
@media (max-width: 600px) { .az-hem-lists { grid-template-columns: minmax(0, 1fr); } .az-hem-photos { flex-direction: column; } }
