/* Footer — reference treatment ----------------------------------------------
 *
 * Restyles the existing Webflow footer; the markup already has the right
 * structure (a label per column, a list of links under it), it was just set in
 * one size and one colour.
 *
 * Both dark references use the same pairing, measured at 1440:
 *
 *   harmattan.ai   label  IBM Plex Mono 10.8px / w500 / ls 0.432px / uppercase
 *                         colour #BAAE9B (their muted sand)
 *                  link   Figtree 13.5px / w500 / ls 0.09px / sentence case / #fff
 *   anduril.com    label  12px / w500 / ls 0.48px / uppercase / #fff
 *                  link   18px / w400 / ls -0.176px / sentence case / #fff
 *
 * So: a small tracked caps label over larger, plain, sentence-case links. Ours
 * takes Harmattan's sand for the label (we have that colour already) and sits
 * between the two on link size at 17px.
 *
 * Own file so a re-scrape of dronivo.css cannot overwrite it.
 */

.footer_component {
  --ft-line: rgba(255, 255, 255, 0.14);
  --ft-muted: rgba(255, 255, 255, 0.55);
  --ft-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  border-top: 1px solid var(--ft-line);
}

/* --- Column labels --------------------------------------------------------- */

/* Was the site's body face at 12px with 6px of tracking. In the mono it reads
   as a system label rather than as shouted copy — which is the whole point of
   the device on both references. */
.footer_component .text-style-tagline-small {
  font-family: var(--ft-mono);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--site-accent, #c4b798);
}

/* The "//" motif, added without touching the markup. */
.footer_component .text-style-tagline-small::before {
  content: "//";
  margin-right: 0.625rem;
  opacity: 0.55;
}

/* --- Links ----------------------------------------------------------------- */

/* Sentence case and a size up: both references let the footer links carry real
   weight rather than setting the whole block as fine print. */
.footer_component .footer_link-list a,
.footer_component .underline-link {
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: -0.01em;
  text-transform: none;
  color: #fff;
}

.footer_component .footer_link-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 1.25rem;
}

/* --- Legal row ------------------------------------------------------------- */

/* Set as fine print, which is the one place in the footer where that is right.
   Deliberately NOT `.text-size-small`: that class also carries the company
   description, and the mono caps treatment turned a real sentence into a block
   of legal boilerplate. */
.footer_component .footer1_legal-list,
.footer_component .footer1_legal-list a {
  font-family: var(--ft-mono);
  /* 12px statt 11: der Kunde meldet die Schriften generell als zu klein, und
     11px Mono in Versalien ist an der Grenze — hier steht mit Impressum und
     AGB ausserdem, was ein Besucher zuverlaessig finden koennen muss. */
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ft-muted);
}

/* --- Kopfzeile des Fusses --------------------------------------------------- */

/* Einspaltig, sobald die Menuespalte fehlt.
 *
 * lib/footer.ts entfernt Leistungs- und Menuespalte samt ihrer Huelle — das
 * war so gewollt. Webflows Raster darunter blieb aber zweispaltig
 * (`.75fr 1fr` mit 15rem Spalt), und ein Raster reserviert seine Spuren auch
 * ohne Inhalt. Gemessen bei 1440: der linke Block endete bei 523, die Spur
 * daneben lief bis 1376 — 853px reservierte Leere. Genau das sieht im Fuss
 * aus, als sei etwas verrutscht.
 *
 * Mit :has geschrieben, nicht fest einspaltig: kaeme die Menuespalte je
 * zurueck, stellt sich das Raster von selbst wieder her. */
.footer_component .footer_top-wrapper:not(:has(.footer_menu-wrapper)) {
  grid-template-columns: minmax(0, 1fr);
  column-gap: 0;
}

/* Logo und Beschreibung gehoeren zusammen.
 *
 * Webflows `.margin-top.margin-huge` setzt 4.625rem, dazu die 1.5rem unter
 * dem Logo — 98px zwischen einer Bildmarke und dem Satz, der sie erklaert.
 * Das war der Abstand, als in derselben Spalte noch die Leistungsliste stand
 * und der Satz das Ende einer langen Spalte war. Ohne sie stehen die beiden
 * allein da und der Abstand liest sich als Loch. */
.footer_component .footer_left-wrapper .margin-top.margin-huge {
  margin-top: 1rem;
}

/* The description stays a sentence. */
.footer_component .footer_left-wrapper .text-size-small {
  max-width: 46ch;
  font-size: 0.9375rem;
  line-height: 1.55;
  letter-spacing: normal;
  text-transform: none;
  color: var(--ft-muted);
}

/* Die Haarlinie gehoert auf die ganze Zeile, nicht auf die Linkliste.
   Auf .footer1_legal-list gesetzt lief sie von 773 bis 1376 — sie begann also
   mitten im Nichts, rechts neben der Copyright-Zeile, und sah aus wie ein
   abgeschnittener Rest. */
.footer_component .footer_bottom-wrapper {
  padding-top: 1.5rem;
  border-top: 1px solid var(--ft-line);
}

/* --- Logo ------------------------------------------------------------------ */

/* No knockout any more: lib/logo.ts now serves the light variant of the Figma
   vector here, so the mark is already white where it needs to be. The filter
   was a workaround for the CDN bitmap being the dark version. */
.footer_component .footer_logo {
  width: auto;
  /* 48px, raised from 36px with the official mark — same reason as the header
     (see navbar.css): the wordmark occupies 27% of that file's height instead
     of 45%, so the box has to grow for the lettering to hold its size. Scaled
     by the same factor as the header, so the two stay in proportion. */
  height: 3rem;
  object-fit: contain;
}

/* Defence only — Lawenforcement and General have their own marks and keep the
   original 36px. See the matching note in navbar.css. */
.wf-site .footer_component .footer_logo {
  height: 2.25rem;
}

@media (max-width: 767px) {
  .footer_component .footer_link-list a,
  .footer_component .underline-link {
    font-size: 1rem;
  }
}

/* --- Hover underline ------------------------------------------------------- */

/* The sweep itself survived the move to the dark ground — the ::before is there
   and still animates — but Webflow paints it #131313, which is invisible on
   #0b0b0b. `currentColor` rather than a fixed white, so the rule keeps working
   if a link ever takes another colour. */
.footer_component .underline-link::before,
.footer_component .footer_link-list a::before,
.footer_component .footer1_legal-list a::before {
  background-color: currentColor;
}


/* --- Schmaler ------------------------------------------------------------- */

/* Der Fuss trug 100px Polster oben und 40px unten und darin eine dreispaltige
   Linkwand. Nachdem die Leistungsliste und die MENU-Spalte weggefallen sind
   (lib/footer.ts), stand dort viel Luft um wenig Inhalt — genau die "zu vielen
   schwarzen Flaechen", die der Kunde meldet. */
.footer_component {
  padding-top: 3.5rem;
  padding-bottom: 2rem;
}

@media (max-width: 767px) {
  .footer_component {
    padding-top: 2.75rem;
    padding-bottom: 1.5rem;
  }
}

/* --- Social-Profile ------------------------------------------------------- */

/* Als Text, nicht als Symbol — so vom Kunden gewuenscht.
 *
 * Die Vorgaengerfassung setzte 44x44-Kaesten mit SVG darin. Sie war nie zu
 * sehen, weil keine Adressen vorlagen; mit den beiden gelieferten waere sie es
 * geworden — und dann als einzige Bildsprache in einem Block, der seine
 * uebrigen Verweise als Wortmarken fuehrt.
 *
 * Typografie deshalb wie die Rechtszeile darunter: Mono, Versalien, 12px. Das
 * "Follow us" davor ist die gedaempfte Variante derselben Zeile, damit die
 * beiden Namen als das Anklickbare lesbar bleiben. */
.footer_socials {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.375rem 1.25rem;
  margin: 1.5rem 0 0;
  font-family: var(--ft-mono);
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.footer_socials-label {
  color: var(--ft-muted);
  /* Die Beschriftung ist kein Ziel; der volle Wortabstand daneben wuerde sie
     wie eines aussehen lassen. */
  margin-right: -0.5rem;
}

/* 44px hoch, ohne die Zeile auseinanderzuziehen.
 *
 * Zwei Woerter in 12px sind 18px hoch — als Ziel fuer einen Daumen zu wenig.
 * Der erste Versuch legte ein unsichtbares ::before-Feld darueber: das
 * funktioniert am Geraet, ist aber nicht nachmessbar — verify/mobile.mjs sieht
 * die Box des Elements und meldete weiter 61x18. Eine Trefferflaeche, die nur
 * ich kenne, ist keine.
 *
 * Also echte Hoehe: 13px Innenabstand oben und unten ergeben 44, der negative
 * Aussenabstand nimmt sie dem Layout wieder weg. Die Box ist damit wirklich
 * 44px hoch und die Zeile steht, wo sie vorher stand. */
.footer_social {
  position: relative;
  display: inline-block;
  padding-block: 13px;
  margin-block: -13px;
  color: #fff;
  text-decoration: none;
  transition: color 0.18s ease;
}

/* Dieselbe Unterstreichung, die der Fuss seinen anderen Verweisen gibt —
   von links aufziehend, in der Farbe des Textes. */
.footer_social::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  /* 13px Polster minus 3px Luft unter der Grundlinie. */
  bottom: 10px;
  height: 1px;
  background-color: currentColor;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.28s cubic-bezier(0.625, 0.05, 0, 1);
}

.footer_social:hover,
.footer_social:focus-visible {
  color: var(--_primitives---colors--brand-yellow, #c4b798);
}

.footer_social:hover::after,
.footer_social:focus-visible::after {
  transform: scaleX(1);
}

@media (prefers-reduced-motion: reduce) {
  .footer_social::after {
    transition: none;
  }
}

/* Die Luecke zwischen Beschreibung und Rechtszeile.
 *
 * Gemessen: 120px Innenabstand unten am oberen Block plus 40px oben an der
 * Rechtszeile — 160px, in denen nichts steht. Das Mass stammt aus der Zeit, als
 * dazwischen drei Linkspalten sassen; ohne sie ist es nur noch Leere. */
.footer_component .padding-bottom.padding-xxlarge {
  padding-bottom: 2.5rem;
}

.footer_component .padding-top.padding-medium {
  padding-top: 1.5rem;
}
