/* D-112 One footer on every page. Every rule that styles the shared footer (its closing CTA, black field and corner
   squares) lives here, and every route loads this file right after site-v3.css: /book-call too, which does not load the
   site layers, so its footer now matches the rest of the site. Moved unchanged from site-v3.css and site-squares.css. */

/* Closing CTA (on every page): editorial split instead of a small centred line on a black void.
   Heading left at display scale with a mint lead-in rule; the work-email form sits right on the baseline. */
.footer_cta_component .text-align-center { text-align: left; }
.footer_cta_component .max-width-large { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 31rem); gap: 40px clamp(40px, 6vw, 96px); align-items: end; max-width: none; margin: 0; }
.footer_cta_component .cta_title { max-width: 12ch; margin: 0; font-size: clamp(2.5rem, 1.6rem + 3vw, 4rem) !important; line-height: 1.08 !important; letter-spacing: -.02em; text-wrap: balance; }
.footer_cta_component .margin-top.margin-xlarge { margin-top: 0 !important; }
.footer_cta_component .footer-form-container { max-width: none; margin: 0; }
.footer_cta_component .cta_form { gap: 8px; }
.footer_cta_component .cta_form .form_input { height: 56px; padding: 0 18px; border-color: #ffffff59; }
.footer_cta_component .cta_form .form_input:focus { border-color: #fff; outline: none; }
.footer_cta_component .cta_form .button { height: 56px; padding: 0 26px; font-weight: 500; transition: background .15s, border-color .15s; }
.footer_cta_component .cta_form .button:hover { background: var(--z-color-mint, #afecdb); border-color: var(--z-color-mint, #afecdb); }
.padding-top.padding-xhuge:has(> .footer_cta_component) { padding-top: clamp(88px, 9vw, 136px); }
@media (max-width: 860px) {
  .footer_cta_component .max-width-large { grid-template-columns: 1fr; gap: 32px; }
}
@media (max-width: 560px) {
  .footer_cta_component .cta_form { flex-direction: column; }
  .footer_cta_component .cta_form .button { width: 100%; }
}

/* Footer: both top corners, as zamp.com. That footer opens with its CTA, so the squares sit in open space; this one
   opens with the logo, so it gets the same open band above the logo on desktop. */
html body:not(#zsq) .footer_component {
  background-color: #000 !important;
  background-image: url('/design-assets/squares/black-footer-tl.svg'), url('/design-assets/squares/black-footer-tr.svg') !important;
  background-position: 0 0, 100% 0 !important; background-size: auto, auto !important; background-repeat: no-repeat !important;
}
@media (min-width: 992px) { html body:not(#zsq) .footer_component:not(.z-footer-with-cta) > .padding-global { padding-top: 200px !important; } }
@media (max-width: 767px) { html body:not(#zsq) .footer_component { background-image: none !important; } }

/* Footer CTA (zamp.com): centred heading with the form beneath it, so the corner squares sit in open space. */
html body:not(#zsq) .z-footer-with-cta .footer_cta_component .text-align-center { text-align: center !important; }
html body:not(#zsq) .z-footer-with-cta .footer_cta_component .max-width-large { display: block !important; max-width: 40rem !important; margin: 0 auto !important; }
html body:not(#zsq) .z-footer-with-cta .footer_cta_component .cta_title { max-width: none !important; margin: 0 auto !important; }
html body:not(#zsq) .z-footer-with-cta .footer_cta_component .margin-top.margin-xlarge { margin-top: 40px !important; }
html body:not(#zsq) .z-footer-with-cta .footer_cta_component .footer-form-container { max-width: 32rem !important; margin: 0 auto !important; }