/* Derived from labs/contact-block-2026-09-16/patches/footer-legal.css by build.mjs — edit it there. */
/* ============================================================
   14b — service line of the footer: © and the legal pages
   Patch for css/14b-footer.css. The footer owns this geometry in every band
   (COMPONENTS.md, law 1); a page only supplies the content.

   ≥ 1400      inside the frame, on both sides of the lockup, centred on the
               DESIGNED line; inset from the corner lines by the contact card
               padding (48 at 1600, same unit as the block above). The bottom
               line of the right corner runs to the first letter of PRIVACY
               POLICY, the left one is its mirror (Alexa, 16.09.2026).
   769 … 1399  under the frame, one row: © on the left line, links on the right.
   ≤ 768       under the frame, centred: links (wrap if needed), then ©.
   Links: the site law of 95-chips.css — the underline is drawn left → right
   in 300 ms and taken back in 240 ms, cubic-bezier(.4, 0, .2, 1).
   ============================================================ */

.ftr-legal {
  --ftr-legal-inset: calc(48 * clamp(0.8px, 0.0625vw, 1.6px));
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0 32px;
  margin-top: 8px;
  font: 500 11px / 16px "Inter", system-ui, -apple-system, sans-serif;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #a4a4aa;
}

.ftr-legal-copy {
  margin: 0;
  white-space: nowrap;
}

.ftr-legal-twin { display: none; }

.ftr-legal-nav {
  display: flex;
  flex-wrap: wrap;
  column-gap: 28px;
}

.ftr-legal-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: inherit;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: color 240ms cubic-bezier(0.4, 0, 0.2, 1);
}
.ftr-legal-link::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0.16em; /* the tracking after the last letter */
  bottom: 12px;
  height: 1px;
  background: currentColor;
  clip-path: inset(0 100% 0 0);
  transition: clip-path 240ms cubic-bezier(0.4, 0, 0.2, 1);
}
.ftr-legal-link:hover,
.ftr-legal-link:focus-visible {
  color: #f7f7f7;
  transition-duration: 300ms;
}
.ftr-legal-link:hover::after,
.ftr-legal-link:focus-visible::after {
  clip-path: inset(0);
  transition-duration: 300ms;
}
.ftr-legal-link:focus-visible {
  outline: 2px solid #eaeaea;
  outline-offset: 3px;
  border-radius: 2px;
}

/* Inside the frame. One grid decides both corner lines: the side tracks take
   the width of the links plus the inset, the frame and the service line share
   them through subgrid (the line's own gap is 0, otherwise the subgrid adds
   half of it to every item and the line overshoots the first letter). The
   right track holds the links, the left one their invisible twin, so both
   lines have one length. The row sits at the bottom of the frame: the 44px
   link box is centred 46px above it — the DESIGNED line of the lockup. */
@media (min-width: 1400px) {
  .ftr-wrap {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr) max-content;
  }
  .ftr-inner,
  .ftr-legal {
    grid-row: 1;
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: subgrid;
  }
  .ftr-inner { grid-template-rows: 100%; }
  .ftr-corner {
    position: relative;
    grid-row: 1;
    width: auto;
    height: auto;
  }
  .ftr-corner--l { grid-column: 1; }
  .ftr-corner--r { grid-column: 3; }

  .ftr-legal {
    align-self: end;
    align-items: center;
    gap: 0;
    margin: 0;
    padding: 0 var(--ftr-legal-inset) 24px;
    pointer-events: none;
  }
  .ftr-legal > * {
    grid-row: 1;
    pointer-events: auto;
  }
  .ftr-legal-copy {
    grid-column: 1;
    justify-self: start;
  }
  .ftr-legal-twin {
    grid-column: 1;
    display: flex;
    column-gap: 28px;
    white-space: nowrap;
    visibility: hidden;
    pointer-events: none;
  }
  .ftr-legal-nav {
    grid-column: 3;
    justify-self: end;
    flex-wrap: nowrap;
  }
}

@media (max-width: 768px) {
  .ftr-legal {
    flex-direction: column;
    justify-content: flex-start;
    margin-top: 4px;
    text-align: center;
  }
  .ftr-legal-nav {
    order: -1;
    justify-content: center;
    column-gap: 24px;
  }
  /* wrapped rows sit 32 apart, not 44: each link keeps its 44px target,
     neighbouring targets overlap by 6px above and below */
  .ftr-legal-link { margin-block: -6px; }
}

@media (prefers-reduced-motion: reduce) {
  .ftr-legal-link,
  .ftr-legal-link::after { transition: none; }
}

@media (forced-colors: active) {
  .ftr-legal-link::after { background: LinkText; }
}
