@charset "UTF-8";
/* ==========================================================================
   Unqork Footer Styles

   The top region is a single block widget (a Columns block) rendered from the
   `unqork-footer` sidebar and provisioned by scripts/build-footer-widgets.php.
   DOM shape the selectors below rely on:

     .unqork-site-footer__cols
       .unqork-site-footer__widget.widget_block        (block-7 wrapper)
         .wp-block-columns.unqork-has-space-between.is-not-stacked-on-mobile
           .wp-block-column.unqork-footer-brand         (1 · brand)
             .unqork-footer-logo (img) · p · .wp-block-button.is-style-cta-gradient
           .wp-block-column                             (2 · By Industry)
             .wp-block-group.unqork-footer-section
               h*.wp-block-heading "By Industry"
               .wp-block-columns.is-not-stacked-on-mobile   (nested)
                 .wp-block-column  → .widget (Financial Services)
                 .wp-block-column  → .widget (Insurance)
                                     .wp-block-group.is-industry-direct → .widget (Gov/Health)
           .wp-block-column                             (3 · Learn)
             .wp-block-group.unqork-footer-section
               h*.wp-block-heading "Learn" · .widget (Learn)
           .wp-block-column                             (4 · Company + Connect)
             .wp-block-group.unqork-footer-section
               h*.wp-block-heading "Company" · .widget (Company)
             .wp-block-group.unqork-footer-section.unqork-footer-section--connect
               h*.wp-block-heading "Connect" · .widget (Social — X / LinkedIn)

   Each collapsible section is wrapped in a .unqork-footer-section group (the
   mobile accordion boundary); Connect adds --connect (static, no toggle).
   Section labels (By Industry, Learn, Company, Connect) are core/heading blocks
   (.wp-block-heading). Sub-labels (Financial Services, Insurance) are Legacy Nav
   Menu widget titles (.widgettitle). All other widgets are title-less.
   ========================================================================== */
:root {
  --footer-divider: #545454;
  --footer-accordion-border: #3f5d84;
  --footer-x: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 23.63 23.63'%3E%3Cpath d='M3.375 0H20.25C22.0957 0 23.625 1.5293 23.625 3.375V20.25C23.625 22.1484 22.0957 23.625 20.25 23.625H3.375C1.47656 23.625 0 22.1484 0 20.25V3.375C0 1.5293 1.47656 0 3.375 0ZM19.0371 4.42969H16.5059L12.3926 9.17578L8.80664 4.42969H3.63867L9.80859 12.5508L3.95508 19.1953H6.48633L11.0215 14.0801L14.9238 19.1953H19.9863L13.5527 10.7051L19.0371 4.42969ZM17.0332 17.7188H15.6094L6.5918 5.85352H8.06836L17.0332 17.7188Z' fill='white'/%3E%3C/svg%3E");
  --footer-linkedin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 21 21' fill='none'%3E%3Cpath d='M17.4362 0.639648H4.10286C2.26259 0.639648 0.769531 2.13271 0.769531 3.97298V17.3063C0.769531 19.1465 2.26259 20.6396 4.10286 20.6396H17.4362C19.2765 20.6396 20.7695 19.1465 20.7695 17.3063V3.97298C20.7695 2.13271 19.2765 0.639648 17.4362 0.639648ZM7.4362 16.8896H5.35286V8.55632H7.4362V16.8896ZM7.44922 6.89399C7.17795 7.16743 6.82639 7.30632 6.39453 7.30632C5.96701 7.30632 5.61762 7.16526 5.34418 6.88097C5.07292 6.59668 4.9362 6.24729 4.9362 5.83496C4.9362 5.40962 5.07292 5.06239 5.34418 4.7933C5.61762 4.5242 5.96701 4.38965 6.39453 4.38965C6.82639 4.38965 7.17795 4.5242 7.44922 4.7933C7.71832 5.06239 7.85286 5.40962 7.85286 5.83496C7.85286 6.26465 7.71832 6.61838 7.44922 6.89399ZM17.0195 16.8896H14.9362V12.2585C14.9362 10.9673 14.1918 10.223 13.2695 10.223C12.8247 10.223 12.3212 10.4921 12.0347 10.8349C11.7461 11.1778 11.6029 11.6118 11.6029 12.137V16.8896H9.51953V8.55632H11.6029V9.87359H11.6354C12.2496 8.86014 13.1415 8.35666 14.3134 8.35232C15.9779 8.34798 17.0195 9.59798 17.0195 11.7876V16.8896Z' fill='white'%3E%3C/path%3E%3C/svg%3E");
}

.unqork-site-footer {
  position: relative;
  z-index: 1;
  background: var(--wp--preset--color--background);
  border: none;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  margin: 0;
}

/* Content container honoring the design grid (max 1320). */
.unqork-site-footer__inner {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--wp--custom--layout--max-content);
  margin-inline: auto;
}

/* --------------------------------------------------------------------------
   Top region — brand + link columns
   -------------------------------------------------------------------------- */
.unqork-site-footer__cols {
  padding: var(--wp--preset--spacing--80) 0 var(--wp--preset--spacing--48);
}

/* The block widget wrapper only forwards layout to the Columns block. */
.unqork-site-footer__widget {
  font-family: var(--wp--preset--font-family--inter);
  padding: 0;
  margin: 0;
}

.unqork-site-footer__cols .wp-block-columns {
  display: flex;
  align-items: flex-start;
  gap: var(--wp--preset--spacing--16);
  margin: 0;
}

/* Approximate the Figma column proportions: brand < By Industry > Learn/Company. */
.unqork-site-footer__cols > .unqork-site-footer__widget > .wp-block-columns > .wp-block-column {
  flex: 1 1 0;
}
.unqork-site-footer__cols > .unqork-site-footer__widget > .wp-block-columns > .wp-block-column:nth-child(1) {
  flex: 0 1 16.25rem;
}
.unqork-site-footer__cols > .unqork-site-footer__widget > .wp-block-columns > .wp-block-column:nth-child(2) {
  flex: 1.6 1 0;
}

/* Brand column — logo image + tagline + gradient CTA. */
.unqork-site-footer__cols .unqork-footer-logo {
  margin: 0;
}

.unqork-site-footer__cols .unqork-footer-logo img {
  width: 7.5rem;
  height: auto;
  display: block;
}

.unqork-site-footer__tagline {
  color: var(--wp--preset--color--white);
  font-family: var(--wp--preset--font-family--inter);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 400;
  line-height: var(--wp--preset--spacing--20);
  margin: var(--wp--preset--spacing--16) 0 0;
}

.unqork-site-footer__cols .wp-block-buttons {
  margin-top: var(--wp--preset--spacing--24);
}

/* Section labels — By Industry, Learn, Company, Connect. */
.unqork-site-footer__cols .wp-block-heading {
  color: var(--wp--preset--color--white);
  font-family: var(--wp--preset--font-family--dm-sans);
  font-size: var(--wp--preset--font-size--base);
  font-weight: 700;
  line-height: var(--wp--preset--spacing--20);
  margin: 0 0 var(--wp--preset--spacing--16);
}

/* Sub-labels — Financial Services, Insurance (Legacy Nav Menu widget titles). */
.unqork-site-footer__cols .widgettitle {
  color: var(--wp--preset--color--white);
  font-family: var(--wp--preset--font-family--dm-sans);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 500;
  line-height: var(--wp--preset--spacing--20);
  margin: 0 0 var(--wp--preset--spacing--10);
}

/* Nav menu lists — vertical link stacks. */
.unqork-site-footer__cols .menu {
  display: flex;
  flex-direction: column;
  gap: var(--wp--preset--spacing--10);
  list-style: none;
  padding: 0;
  margin: 0;
}
.unqork-site-footer__cols .menu li {
  margin: 0;
  padding: 0;
}
.unqork-site-footer__cols .menu a {
  color: var(--wp--preset--color--white);
  text-decoration: none;
  font-family: var(--wp--preset--font-family--inter);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 400;
  line-height: var(--wp--preset--spacing--20);
}
.unqork-site-footer__cols .menu a:hover {
  color: var(--wp--preset--color--cyan-glow);
}

/* --------------------------------------------------------------------------
   By Industry — nested two-column block
   -------------------------------------------------------------------------- */
.unqork-site-footer__cols .wp-block-columns .wp-block-columns {
  gap: var(--wp--preset--spacing--24);
  margin: 0;
}

/* By Industry children (Financial Services / Insurance lists): 12px, indented. */
.unqork-site-footer__cols .wp-block-columns .wp-block-columns .menu li {
  padding-left: 0.6375rem;
}
.unqork-site-footer__cols .wp-block-columns .wp-block-columns .menu a {
  font-size: var(--wp--preset--font-size--caption);
}

/* Government / Healthcare — direct links styled like the sub-labels. */
.unqork-site-footer__cols .is-industry-direct {
  margin-top: var(--wp--preset--spacing--16);
}

.unqork-site-footer__cols .wp-block-columns .wp-block-columns .is-industry-direct .menu li {
  padding-left: 0;
}
.unqork-site-footer__cols .wp-block-columns .wp-block-columns .is-industry-direct .menu a {
  font-family: var(--wp--preset--font-family--dm-sans);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 500;
}

/* --------------------------------------------------------------------------
   Connect — heading offset + social icons (X / LinkedIn)
   -------------------------------------------------------------------------- */
/* Connect is the second (static) section inside the Company/Connect column. */
.unqork-site-footer__cols .unqork-footer-section--connect {
  margin-top: var(--wp--preset--spacing--20);
  padding-top: var(--wp--preset--spacing--10);
}

/* Social list: laid out as a horizontal icon row (targeted via its links). */
.unqork-site-footer__cols .widget:has(a[href*=linkedin]) .menu {
  flex-direction: row;
  gap: var(--wp--preset--spacing--16);
}

.unqork-site-footer__cols .menu a[href*="x.com"],
.unqork-site-footer__cols .menu a[href*=twitter],
.unqork-site-footer__cols .menu a[href*=linkedin] {
  color: var(--wp--preset--color--white);
  display: block;
  height: var(--wp--preset--spacing--24);
  overflow: hidden;
  position: relative;
  text-indent: -9999em;
  width: var(--wp--preset--spacing--24);
}
.unqork-site-footer__cols .menu a[href*="x.com"]::before,
.unqork-site-footer__cols .menu a[href*=twitter]::before,
.unqork-site-footer__cols .menu a[href*=linkedin]::before {
  background-color: currentColor;
  content: "";
  inset: 0;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: var(--wp--preset--spacing--24) var(--wp--preset--spacing--24);
          mask-size: var(--wp--preset--spacing--24) var(--wp--preset--spacing--24);
  position: absolute;
}

.unqork-site-footer__cols .menu a[href*="x.com"]::before,
.unqork-site-footer__cols .menu a[href*=twitter]::before {
  -webkit-mask-image: var(--footer-x);
          mask-image: var(--footer-x);
}

.unqork-site-footer__cols .menu a[href*=linkedin]::before {
  -webkit-mask-image: var(--footer-linkedin);
          mask-image: var(--footer-linkedin);
}

/* --------------------------------------------------------------------------
   Divider + bottom bar
   -------------------------------------------------------------------------- */
.unqork-site-footer__divider {
  border: none;
  border-top: 1px solid var(--footer-divider);
  margin: 0;
  width: 100%;
}

.unqork-site-footer__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--wp--preset--spacing--24) 0 var(--wp--preset--spacing--64);
  flex-wrap: wrap;
  gap: var(--wp--preset--spacing--24);
}

.unqork-site-footer__copyright {
  color: rgba(255, 255, 255, 0.55);
  font-family: var(--wp--preset--font-family--inter);
  font-size: var(--wp--preset--font-size--caption);
  font-weight: 400;
  margin: 0;
}

.unqork-site-footer__legal .menu {
  display: flex;
  align-items: center;
  gap: var(--wp--preset--spacing--12);
  list-style: none;
  padding: 0;
  margin: 0;
}
.unqork-site-footer__legal .menu li {
  display: flex;
  align-items: center;
  padding: 0;
  margin: 0;
  position: relative;
  white-space: nowrap;
}
.unqork-site-footer__legal .menu a {
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  font-family: var(--wp--preset--font-family--inter);
  font-size: var(--wp--preset--font-size--caption);
  font-weight: 400;
}
.unqork-site-footer__legal .menu a:hover {
  color: var(--wp--preset--color--cyan-glow);
}

/* Accordion toggle button — injected by footer.js, mobile-only (see below). */
.unqork-site-footer .unqork-site-footer__toggle {
  display: none;
}

/* ==========================================================================
   Responsive — tablet + mobile
   ========================================================================== */
/* Above 768px: keep a 16px side gutter so content never touches the viewport
   edge on mid-size screens (below the 1320px max-width). Mobile (≤767.98px)
   already gets its gutter from .unqork-site-footer padding. */
@media (min-width: 768px) {
  .unqork-site-footer__inner,
  .unqork-site-footer__bottom {
    padding-inline: var(--wp--preset--spacing--16);
  }
}
/* Tablet (768–1024px): keep the desktop layout but rebalance the columns so the
   brand doesn't dominate, and tighten link line-height. Font sizes are unchanged.
   By Industry holds two sub-columns, so it gets extra grow while the single-list
   Learn/Company columns (which have spare width here) give some up. */
@media (min-width: 768px) and (max-width: 1024px) {
  .unqork-site-footer__cols > .unqork-site-footer__widget > .wp-block-columns > .wp-block-column {
    flex: 1 1 0;
  }
  .unqork-site-footer__cols > .unqork-site-footer__widget > .wp-block-columns > .wp-block-column:nth-child(1) {
    flex: 1 1 0;
  }
  .unqork-site-footer__cols > .unqork-site-footer__widget > .wp-block-columns > .wp-block-column:nth-child(2) {
    flex: 2 1 0;
  }
  .unqork-site-footer__cols .menu a {
    line-height: 0.875rem;
  }
}
/* Mobile (≤767.98px): single vertical stack. By Industry / Learn / Company
   collapse into accordion rows; Brand and Connect stay always-visible. */
@media (max-width: 767.98px) {
  .unqork-site-footer {
    padding: 0 var(--wp--preset--spacing--16);
  }
  .unqork-site-footer__cols {
    padding: var(--wp--preset--spacing--40) 0 0;
  }
  /* Divider stays visible on mobile: 16px gap after Connect, then the hairline. */
  .unqork-site-footer__divider {
    margin-top: var(--wp--preset--spacing--16);
  }
  /* Stack the four columns; 16px rhythm between them. */
  .unqork-site-footer__cols > .unqork-site-footer__widget > .wp-block-columns {
    flex-direction: column;
    gap: var(--wp--preset--spacing--16);
  }
  /* Each column is a full-width vertical stack (full width comes from the flex
     container's default stretch). The 16px gap also spaces the brand's
     logo/tagline/button and the Company↔Connect sections. Reset the desktop
     flex sizing — including the higher-specificity :nth-child rules — to auto so
     no column reserves a fixed height in the column-direction stack. */
  .unqork-site-footer__cols > .unqork-site-footer__widget > .wp-block-columns > .wp-block-column {
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--16);
  }
  .unqork-site-footer__cols > .unqork-site-footer__widget > .wp-block-columns > .wp-block-column, .unqork-site-footer__cols > .unqork-site-footer__widget > .wp-block-columns > .wp-block-column:nth-child(1), .unqork-site-footer__cols > .unqork-site-footer__widget > .wp-block-columns > .wp-block-column:nth-child(2) {
    flex: 0 0 auto;
  }
  /* Brand — 140px logo, 24px below the CTA before the first accordion row. */
  .unqork-footer-brand {
    padding-bottom: var(--wp--preset--spacing--24);
  }
  .unqork-site-footer__cols .unqork-footer-logo {
    width: 8.75rem;
  }
  .unqork-site-footer__cols .unqork-footer-logo img {
    width: 100%;
  }
  /* Brand items rely solely on the column's 16px flex gap — drop the desktop
     top margins on the tagline and button so spacing stays even. */
  .unqork-site-footer__tagline,
  .unqork-site-footer__cols .wp-block-buttons {
    margin-top: 0;
  }
  /* Collapsible accordion rows — By Industry / Learn / Company. */
  .unqork-site-footer__cols .unqork-footer-section:not(.unqork-footer-section--connect) {
    position: relative;
    padding: var(--wp--preset--spacing--20) 0;
    border-bottom: 1px solid var(--footer-accordion-border);
    margin: 0;
  }
  .unqork-site-footer__cols .unqork-footer-section:not(.unqork-footer-section--connect) > .wp-block-heading {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    font-family: var(--wp--preset--font-family--inter);
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.75rem;
    /* +/- disclosure indicator (mirrors the header accordion). */
  }
  .unqork-site-footer__cols .unqork-footer-section:not(.unqork-footer-section--connect) > .wp-block-heading::after {
    content: "+";
    font-size: 1.625rem;
    font-weight: 300;
    line-height: 1;
  }
  .unqork-site-footer__cols .unqork-footer-section:not(.unqork-footer-section--connect).is-open > .wp-block-heading::after {
    content: "−";
  }
  .unqork-site-footer__cols .unqork-footer-section:not(.unqork-footer-section--connect) {
    /* Transparent full-cover trigger — whole-row tap target + aria state. */
  }
  .unqork-site-footer__cols .unqork-footer-section:not(.unqork-footer-section--connect) .unqork-site-footer__toggle {
    display: block;
    position: absolute;
    inset: 0;
    width: 100%;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
  }
  .unqork-site-footer__cols .unqork-footer-section:not(.unqork-footer-section--connect) {
    /* Collapsed by default; animate open/close (max-height so height is auto-ish). */
  }
  .unqork-site-footer__cols .unqork-footer-section:not(.unqork-footer-section--connect) > :not(.wp-block-heading) {
    overflow: hidden;
    max-height: 0;
    margin-top: 0;
    opacity: 0;
    transition: max-height 0.3s ease, opacity 0.3s ease, margin-top 0.3s ease;
  }
  .unqork-site-footer__cols .unqork-footer-section:not(.unqork-footer-section--connect).is-open > :not(.wp-block-heading) {
    max-height: 62.5rem;
    margin-top: var(--wp--preset--spacing--20);
    opacity: 1;
  }
  /* Menu links inside expanded sections — Inter 400 / 16 / 26. */
  .unqork-site-footer__cols .unqork-footer-section .menu {
    gap: var(--wp--preset--spacing--16);
  }
  .unqork-site-footer__cols .unqork-footer-section .menu a {
    font-size: 1rem;
    line-height: 1.625rem;
    font-weight: 400;
  }
  /* By Industry — nested columns stack; 20px between the FS and Insurance blocks. */
  .unqork-site-footer__cols .wp-block-columns .wp-block-columns {
    flex-direction: column;
    gap: var(--wp--preset--spacing--20);
  }
  /* Financial Services / Insurance sub-labels — Inter 700 / 16 / 26. */
  .unqork-site-footer__cols .widgettitle {
    font-family: var(--wp--preset--font-family--inter);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.625rem;
    margin: 0 0 var(--wp--preset--spacing--16);
  }
  /* By Industry children — 20px indent. */
  .unqork-site-footer__cols .wp-block-columns .wp-block-columns .menu li {
    padding-left: var(--wp--preset--spacing--20);
  }
  /* Government / Healthcare — same title style as FS/Insurance, no indent. */
  .unqork-site-footer__cols .is-industry-direct {
    margin-top: var(--wp--preset--spacing--20);
  }
  .unqork-site-footer__cols .wp-block-columns .wp-block-columns .is-industry-direct .menu {
    gap: var(--wp--preset--spacing--20);
  }
  .unqork-site-footer__cols .wp-block-columns .wp-block-columns .is-industry-direct .menu li {
    padding-left: 0;
  }
  .unqork-site-footer__cols .wp-block-columns .wp-block-columns .is-industry-direct .menu a {
    font-family: var(--wp--preset--font-family--inter);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.625rem;
  }
  /* Connect — static section: no border, no toggle, always visible. */
  .unqork-site-footer__cols .unqork-footer-section--connect {
    margin: 0;
    padding: 0;
  }
  /* Bottom bar — copyright left, Privacy/Terms/Trust right; 16px above, 40px below. */
  .unqork-site-footer__bottom {
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--wp--preset--spacing--12);
    padding: var(--wp--preset--spacing--16) 0 var(--wp--preset--spacing--40);
  }
  .unqork-site-footer__copyright {
    line-height: 1rem;
  }
  .unqork-site-footer__legal .menu a {
    line-height: 1rem;
  }
}