/* Website-only additions on top of the brand CSS copied from the cockpit.
   Keep this file small: anything that belongs to the brand itself belongs in
   tokens.css / base.css / public.css so both code bases stay recognisable. */

/* The cockpit's hero is a two-column grid (copy | product mockup). The
   placeholder home page has no mockup yet, so without this the right half
   renders as a wide empty column and the page looks broken. Drop the modifier
   again as soon as WS-C fills the second column. */
.landing-hero--solo {
  grid-template-columns: 1fr;
  max-width: 900px;
  text-align: left;
}

/* Keyboard access to the mobile navigation.
   public.css hides the hamburger's checkbox with `display: none`, which also
   removes it from the tab order and the accessibility tree — so below 1200px,
   where .landing-nav-actions is collapsed behind that checkbox, the language
   switch and both cockpit CTAs were unreachable without a mouse (WCAG 2.1.1).
   A <label> is not focusable and we run no JavaScript, so the checkbox itself
   has to stay focusable: visually hidden instead of display:none, with a
   visible focus ring drawn on the label it controls. */
@media (max-width: 1200px) {
  .nav-toggle-checkbox {
    display: block;
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    padding: 0;
    opacity: 0;
    pointer-events: none;
  }
  .nav-toggle-checkbox:focus-visible ~ .nav-toggle-btn {
    outline: 2px solid var(--fv-gold-400);
    outline-offset: 2px;
    border-radius: var(--radius-md);
  }
}

/* The footer's legal links carry a duty ("leicht erkennbar", § 5 DDG), so they
   do not inherit the decorative rgba(255,255,255,.4) of the surrounding footer
   text — that is roughly 3.6:1 on the navy background, below the WCAG AA
   threshold of 4.5:1 for 13px text. The other footer links are decorative and
   stay as they are. */
.landing-footer .footer-legal-links a {
  color: rgba(255, 255, 255, .78);
}
.landing-footer .footer-legal-links a:hover,
.landing-footer .footer-legal-links a:focus-visible {
  color: var(--fv-white);
  text-decoration: underline;
}