/* ==========================================================================
   ULA FOOTER = the Advanced Layout Builder page "Footer" (Enfold > Footer > page based footer).
   Everything is keyed off the wrapper classes on the ALB Color Sections / columns:
     .ula-newsletter  (section)  > .ula-newsletter-copy | .ula-newsletter-form (columns)
     .ula-footer-main (section)  > .ula-footer-logo | .ula-footer-contact | .ula-footer-links
                                   | .ula-footer-copyright | .ula-footer-credit (columns)
   No classes/IDs/inline styles live on text elements. Page content: docs/footer-page.php.
   Form markup: includes/newsletter.php ([ula_newsletter_form]).
   ========================================================================== */

/* ---- Enfold wrapper (#footer-page) --------------------------------------- */
#top #footer-page.footer_color { background: #fff; border: 0; padding: 0; margin: 0; }
#top #footer-page .container_wrap_first { background: transparent; border: 0; padding: 0; }
#top #footer-page .avia-section { border: 0; }
#top #footer-page .container_wrap_first > .container { padding-top: 0; padding-bottom: 0; }
#top #footer-page .template-page.content { padding-top: 0; padding-bottom: 0; }
/* Full bleed: Enfold nests the footer page's Color Sections inside .container_wrap_first > .container (1320 + 60px gutters).
   Let that wrapper span the viewport; each section's own inner .container keeps the 1320 content width. */
#top #footer-page .container_wrap_first > .container { width: 100%; max-width: none; margin: 0; padding: 0; }
#top #footer-page .container_wrap_first > .container > main.template-page { width: 100%; max-width: none; float: none; margin: 0; padding: 0; }
/* ...and each band's own inner container re-applies the 1320 content width (60px gutters, 30px on mobile) */
.responsive #top #footer-page .avia-section.ula-newsletter > .container,
.responsive #top #footer-page .avia-section.ula-footer-main > .container { width: calc(100% - (2 * var(--ula-gutter))); max-width: var(--ula-content-width); margin-left: auto; margin-right: auto; }
/* column floats/widths are replaced by CSS grid on .entry-content-wrapper */
#top #footer-page .flex_column,
.responsive #top #footer-page .flex_column { float: none; width: auto; margin: 0; min-width: 0; }
#top #footer-page .entry-content-wrapper { clear: none; }
#top #footer-page .entry-content-wrapper::before { display: none; }
#top #footer-page .ula-footer-main .entry-content-wrapper::after { display: none; }
#top #footer-page .av-special-heading { margin: 0; padding: 0; }
#top #footer-page .special-heading-border { display: none; }
#top #footer-page .avia_textblock p { margin: 0; }

/* ---- Newsletter band ------------------------------------------------------ */
#top .ula-newsletter.avia-section {
	position: relative;
	z-index: 1;           /* below .ula-tutor-cta (z-index:2) so tutor swirls paint on the dark blue */
	background: var(--ula-blue);   /* solid #0F75BC (no texture - Matthew's review) */
	clip-path: polygon(0 var(--ula-slope), 100% 0, 100% 100%, 0 100%);
	overflow-x: clip;   /* the arrow hangs off the button; never let it widen the page */
	padding: calc(var(--ula-slope) + 24px) 0 33px;
	color: #fff;
	margin: 0;
}
#top .ula-newsletter .container { padding-top: 0; padding-bottom: 0; }
#top .ula-newsletter .entry-content-wrapper {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 520fr) minmax(0, 660fr);
	column-gap: 140px;
	align-items: start;
}
/* Figma: copy block is vertically centred against the 410px form column */
#top .ula-newsletter .ula-newsletter-copy { align-self: center; }
/* decorative arrow: hangs from the Sign up button's own wrapper (p.ula-newsletter__submit, shrink-wrapped to the button, so its box IS the button box)
   as a ::before, so it follows the button wherever the grid/form/admin bar/viewport put it. newsletter-arrow-v2.svg is traced from Matthew's reference
   crop (275x156 art, head already at 45deg up-right). The head tip sits at 98.18% x / 59.6% y of the art box (x 270, y 93 in the viewBox), so with
   art width W (height 0.5673W): tip-x = box-left + 0.9818W, tip-y = box-top + 0.3381W. The box is placed so the tip is --ula-arrow-gap px left of the
   button (right: 100%) and ON its vertical centre (top: 50%). <990px it is rotated -135deg about the tip and hangs off the button's right edge instead,
   pointing left. The file is versioned (-v2) because it is served with a 10-year cache lifetime. */
#top #footer-page .ula-newsletter .entry-content-wrapper::after { display: none; }
#top #footer-page .ula-newsletter .ula-newsletter__submit { --ula-arrow-w: 143px; --ula-arrow-gap: 28px; }
#top #footer-page .ula-newsletter .ula-newsletter__submit::before {
	content: "";
	display: block;
	position: absolute;
	right: calc(100% + var(--ula-arrow-gap) - 0.0182 * var(--ula-arrow-w));
	top: calc(50% - 0.3381 * var(--ula-arrow-w));
	left: auto; bottom: auto;
	width: var(--ula-arrow-w);
	height: calc(var(--ula-arrow-w) * 0.5673);
	background: url('../images/graphics/newsletter-arrow-v2.svg') 0 0 / 100% 100% no-repeat;
	transform-origin: 98.18% 59.6%;
	pointer-events: none;
}
#top .ula-newsletter .av-special-heading-tag,
#top .ula-newsletter .avia_textblock,
#top .ula-newsletter .avia_textblock p,
#top .ula-newsletter label,
#top .ula-newsletter label span { color: #fff; } /* required * — Enfold #top label span is #444 */
#top .ula-newsletter .av-special-heading-tag {
	font: 700 28px/42px var(--ula-body-font);
	margin: 0 0 20px;
}
#top .ula-newsletter .avia_textblock p { font: 500 22px/34px var(--ula-body-font); margin: 0; } /* Dev Mode Catamaran Medium 22/34 */
/* two paragraphs in the copy: Figma: the 2-paragraph text node is 180px tall = 5 x 34px lines + 10px; the reference crop measures 10-12px between them */
#top #footer-page .ula-newsletter .avia_textblock p + p { margin-top: 10px; }
.ula-newsletter__form { margin: 0; padding: 0 0 3px; }
.ula-newsletter__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ula-newsletter .ula-field { margin: 0 0 30px; }
#top .ula-newsletter .ula-field > label {
	display: block;
	font: 500 22px/34px var(--ula-body-font) !important; /* Dev Mode Catamaran Medium 22/34 — beat Enfold #top label */
	margin: 0 0 6px;
}
.ula-newsletter input[type="text"],
.ula-newsletter input[type="email"],
#top .ula-newsletter input[type="text"],
#top .ula-newsletter input[type="email"] {
	display: block;
	width: 100%;
	height: 40px;
	margin: 0;
	padding: 0 12px;
	background: #fff !important;
	color: var(--ula-text);
	border: 0 !important;
	border-radius: 0;
	font: 400 20px/30px var(--ula-body-font);
	box-sizing: border-box;
}
#top #footer-page .ula-newsletter input:focus-visible,
#top #footer-page .ula-newsletter button:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
/* the wrapper is exactly the button box (flex + fit-content) so the arrow can hang from it; 60px above = Figma (294 -> 354); the form pads 3px below to keep the old band height */
#top .ula-newsletter .ula-newsletter__submit { position: relative; display: flex; width: fit-content; margin: 60px 0 0; padding: 0; }
.ula-newsletter__submit .ula-btn { min-width: 130px; margin: 0; border: 0; cursor: pointer; }
/* Figma 'Sign up': white button, #0F75BC label (sampled). Hover/focus: cream + deep-blue label (5.9:1). */
#top .ula-newsletter .ula-newsletter__submit .avia-button,
#top .ula-newsletter .ula-newsletter__submit .avia-button:link { background: #fff; color: var(--ula-blue); }
#top .ula-newsletter .ula-newsletter__submit .avia-button:hover,
#top .ula-newsletter .ula-newsletter__submit .avia-button:focus { background: var(--ula-cream); color: #0B5F9B; }
.ula-newsletter__status { min-height: 0; }
.ula-newsletter__msg { background: #fff; color: var(--ula-text) !important; padding: 10px 14px; margin: 0 0 24px; font: 600 18px/28px var(--ula-body-font); }
#top .ula-newsletter .ula-newsletter__msg { color: var(--ula-text); }
#top .ula-newsletter .avia_codeblock { margin: 0; }
#top .ula-newsletter .avia_codeblock_section { margin: 0; }

/* ---- Site footer ---------------------------------------------------------- */
#top .ula-footer-main.avia-section { background: #fff; color: var(--ula-text); padding: 60px 0 0; margin: 0; }
#top .ula-footer-main .container { padding-top: 0; padding-bottom: 0; }
#top .ula-footer-main .entry-content-wrapper {
	display: grid;
	grid-template-columns: 237px 150px minmax(0, 1fr);   /* Figma: logo 237 | contact 150 | quick links, 137px gaps */
	grid-template-areas: "logo contact links" "copy copy credit";
	column-gap: clamp(40px, 9.51vw, 137px);
	align-items: start;
}
.ula-footer-logo { grid-area: logo; }
.ula-footer-contact { grid-area: contact; }
.ula-footer-links { grid-area: links; }
.responsive #top #footer-page .ula-footer-copyright { grid-area: copy; margin-top: 98px; padding-bottom: 29px; }
.responsive #top #footer-page .ula-footer-credit { grid-area: credit; margin-top: 98px; padding-bottom: 29px; text-align: right; }
#top .ula-footer-logo .avia-image-container,
#top .ula-footer-logo .avia-image-container-inner,
#top .ula-footer-logo .avia-image-overlay-wrap { display: block; margin: 0; }
#top .ula-footer-logo img.avia_image { display: block; width: 237px; height: 150px; max-width: none; }
#top .ula-footer-main .av-special-heading-tag { font: 600 22px/34px var(--ula-body-font); color: var(--ula-text); margin: 3px 0 9px; } /* Dev Mode Catamaran SemiBold 22/34 */
#top .ula-footer-main address { font: 400 18px/28px var(--ula-body-font); font-style: normal; margin: 0 0 25px; color: var(--ula-text); }
#top .ula-footer-links .av-special-heading-tag { margin-bottom: 0; }   /* Figma: first link 32px under the 'Quick Links' heading top */
#top .ula-footer-contact .avia-image-container { display: inline-block; width: auto; margin: 0 14px 0 0; vertical-align: top; }
#top .ula-footer-contact .avia-image-container-inner,
#top .ula-footer-contact .avia-image-overlay-wrap { display: block; }
#top .ula-footer-contact img.avia_image { display: block; width: 36px; height: 36px; max-width: none; }
#top .ula-footer-links .av-list-menu-list {
	list-style: none; margin: 0; padding: 0;
	display: grid; grid-template-columns: repeat(3, minmax(0, 200px)); grid-template-rows: repeat(3, auto);
	grid-auto-flow: column; column-gap: 35px; row-gap: 6px; padding-top: 2px;   /* Figma: 200px columns, 235px pitch, 32px row pitch */
}
#top .ula-footer-links .av-list-menu-list li { margin: 0; padding: 0; }
#top .ula-footer-main a,
#top .ula-footer-main .av-list-menu-list a { color: #28373F; text-decoration: none; font: 400 18px/28px var(--ula-body-font); padding: 0; font-weight: 400; } /* #16 Crystal */
#top .ula-footer-main .av-list-menu-list a:hover,
#top .ula-footer-main .av-list-menu-list a:focus-visible { color: #BA5025; }
#top .ula-footer-main a:hover { color: var(--ula-burnt-orange); text-decoration: underline; }
#top #footer-page .ula-footer-main a:focus-visible,
#top #footer-page .ula-footer-main .avia-image-container a.avia_image:focus-visible { outline: 3px solid var(--ula-blue); outline-offset: 3px; }
#top .ula-footer-main .ula-footer-copyright .avia_textblock p,
#top .ula-footer-main .ula-footer-credit .avia_textblock p { font: 400 14px/26px var(--ula-body-font); color: var(--ula-text); }   /* Figma legal line: Catamaran 14/26 */
@media (min-width: 1200px) {
	/* Figma footer content box: 54px side margins (1332px at 1440) */
	.responsive #top #footer-page .avia-section.ula-footer-main > .container { width: calc(100% - 108px); max-width: 1332px; }
}

@media (max-width: 1199px) {
	#top .ula-newsletter .entry-content-wrapper { column-gap: 60px; }
	#top #footer-page .ula-newsletter .ula-newsletter__submit { --ula-arrow-w: 90px; --ula-arrow-gap: 18px; }
	#top .ula-footer-main .entry-content-wrapper {
		grid-template-columns: 237px minmax(0, 1fr);
		grid-template-areas: "logo contact" "links links" "legal legal";
		row-gap: 36px;
	}
	/* copyright left + credit right share the last row */
	.responsive #top #footer-page .ula-footer-copyright, .responsive #top #footer-page .ula-footer-credit { grid-area: legal; }
	.responsive #top #footer-page .ula-footer-copyright { justify-self: start; }
	.responsive #top #footer-page .ula-footer-credit { justify-self: end; }
	.responsive #top #footer-page .ula-footer-copyright, .responsive #top #footer-page .ula-footer-credit { margin-top: 47px; padding-bottom: 64px; } /* 28px + 36px bottom space: matches the old PHP footer at 990-1199 (1285px tall at 1024) */
}
@media (max-width: 989px) {
	#top .ula-newsletter.avia-section { padding: calc(var(--ula-slope) + 24px) 0 100px; }
	#top .ula-newsletter .entry-content-wrapper { display: block; }
	#top .ula-newsletter .av-special-heading-tag { font: 600 28px/40px var(--ula-body-font); } /* Dev Mode mobile newsletter SemiBold 28/40 */
	#top .ula-newsletter .avia_textblock p { font-size: 20px; }
	.responsive #top #footer-page .ula-newsletter-copy { margin-bottom: 40px; }
	#top .ula-newsletter .ula-field > label { font: 500 20px/34px var(--ula-body-font) !important; } /* Dev Mode mobile Medium 20/34 */
	/* stacked form (Figma mobile comp: arrow sits right of the button, partly off-canvas): mirror the arrow to the button's right, head
	   --ula-arrow-gap px from its right edge, pointing left (rotated about the tip; the band clips it, never scrolls). */
	#top #footer-page .ula-newsletter .ula-newsletter__submit { --ula-arrow-w: 110px; --ula-arrow-gap: 9px; }
	#top #footer-page .ula-newsletter .ula-newsletter__submit::before { right: auto; left: calc(100% + var(--ula-arrow-gap) - 0.9818 * var(--ula-arrow-w)); transform: rotate(-135deg); }
	#top .ula-newsletter .ula-newsletter__submit { margin-top: 43px; }
	#top .ula-footer-main.avia-section { padding-top: 50px; text-align: center; }
	#top .ula-footer-main .entry-content-wrapper { display: block; }
	.responsive #top #footer-page .ula-footer-copyright, .responsive #top #footer-page .ula-footer-credit { justify-self: auto; }
	#top .ula-footer-logo .avia-image-container { float: none; width: 237px; margin: 0 auto 36px; }
	.responsive #top #footer-page .ula-footer-contact { margin-bottom: 0; }
	#top .ula-footer-main .ula-footer-copyright .avia_textblock p,
	#top .ula-footer-main .ula-footer-credit .avia_textblock p { font-size: 20px; }
	#top .ula-footer-contact .avia-image-container { margin: 0 7px 36px; }
	#top .ula-footer-links .av-list-menu-list { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(4, auto); column-gap: 20px; text-align: center; max-width: 360px; margin: 0 auto; }
	.responsive #top #footer-page .ula-footer-copyright { margin-top: 44px; padding-bottom: 0; }
	.responsive #top #footer-page .ula-footer-credit { margin-top: 8px; padding-bottom: 35px; text-align: center; }
}

/* Phase 7: touch targets (<=767). Quick-link rows are 32px apart in the comp, so each link's hit area is stretched to its full row (no gaps); social icons get 44x44 hit areas. */
@media (max-width: 767px) {
	#top #footer-page .ula-footer-links .av-list-menu-list a { position: relative; }
	#top #footer-page .ula-footer-links .av-list-menu-list a::before { content: ""; position: absolute; left: 0; right: 0; top: -3px; bottom: -3px; }
	#top #footer-page .ula-footer-contact a.avia_image::before { content: ""; position: absolute; left: -4px; right: -4px; top: -4px; bottom: -4px; }
}

/* Phase 7: the two social icons were left-aligned under centred text at <=989; centre them (36px icons, 10px apart = 2.5px side margins + the ~5px inline gap; Figma mobile x156 / x202). */
@media (max-width: 989px) {
	#top .ula-footer-contact .avia-image-container { float: none; display: inline-block; vertical-align: top; width: 36px; margin: 0 2.5px 36px; }
}

/* Phase 7: mobile newsletter band + footer rhythm vs the Figma mobile frames (393). Newsletter 'Frame 17' text starts 126px below the band top, the form
   (Frame 13) starts 47px below the copy, the button sits 60px below the last field and the band ends 86px below the button; footer: 60px top padding,
   60px gaps (logo > contact > social > quick links), heading-to-link gap 49px, legal text 14px/26px, 82px above it, 30px below. */
@media (max-width: 767px) {
	#top .ula-newsletter.avia-section { padding: 126px 0 63px; }
	.responsive #top #footer-page .ula-newsletter-copy { margin-bottom: 47px; }
	#top .ula-newsletter .ula-newsletter__submit { margin-top: 60px; }
	#top .ula-footer-main.avia-section { padding-top: 60px; }
	#top .ula-footer-logo .avia-image-container { margin-bottom: 57px; }
	#top .ula-footer-contact .avia-image-container { margin: 3px 2.5px 57px; }
	#top .ula-footer-links .av-list-menu-list { grid-template-columns: repeat(2, minmax(0, 150px)); column-gap: 15px; max-width: 315px; }   /* Figma: two 150px centred columns, 15px apart */
	#top .ula-footer-links .av-list-menu-wrap { padding-top: 17px; }
	#top .ula-footer-main .ula-footer-copyright .avia_textblock p,
	#top .ula-footer-main .ula-footer-credit .avia_textblock p { font-size: 14px; line-height: 26px; }
	.responsive #top #footer-page .ula-footer-copyright { margin-top: 68px; }
	.responsive #top #footer-page .ula-footer-credit { margin-top: 10px; padding-bottom: 30px; }
}
