/* Quietwork 2026-10-29: cookie banner (built by js/consent.js; hidden until it is needed).
   Fixed to the bottom of the window, so it never covers the phone header bar or the menu button,
   and consent.js pads the page by its height so the footer can still be scrolled into view.
   Site look: Lato, white panel, the brand yellow (#F5CD07) as the top rule and on both buttons.
   Accept and Reject are deliberately identical (same size, colour and weight): equal prominence.
   Buttons are at least 44px tall with a visible keyboard focus ring. */

.cookie-banner {
   position: fixed;
   left: 0;
   right: 0;
   bottom: 0;
   z-index: 100000;
   background: #ffffff;
   color: #1a1a1a;
   border-top: 4px solid #f5cd07;
   box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.18);
   font-family: 'Lato', sans-serif;
   font-size: 16px;
   line-height: 1.45;
   text-align: left;
}
.cookie-banner[hidden] {
   display: none;
}
.cookie-banner__inner {
   box-sizing: border-box;
   max-width: 1170px;
   margin: 0 auto;
   padding: 16px 20px;
   display: flex;
   align-items: center;
   gap: 16px 32px;
}
.cookie-banner__text {
   flex: 1 1 auto;
}
.cookie-banner .cookie-banner__title {
   margin: 0 0 4px;
   padding: 0;
   font-family: 'Lato', sans-serif;
   font-size: 18px;
   font-weight: bold;
   line-height: 1.3;
   color: #1a1a1a;
   text-transform: none;
   letter-spacing: 0;
   text-align: left;
}
.cookie-banner .cookie-banner__title:focus {
   outline: none;
}
.cookie-banner p {
   margin: 0;
   padding: 0;
   font-size: 16px;
   color: #1a1a1a;
   text-align: left;
}
.cookie-banner a {
   color: #1a1a1a;
   text-decoration: underline;
}
.cookie-banner a:hover {
   color: #1a1a1a;
   background: #f5cd07;
}
.cookie-banner__actions {
   flex: 0 0 auto;
   display: flex;
   gap: 12px;
}
.cookie-banner .cookie-banner__btn {
   -webkit-appearance: none;
   appearance: none;
   box-sizing: border-box;
   min-width: 120px;
   min-height: 48px;
   margin: 0;
   padding: 10px 20px;
   border: 2px solid #1a1a1a;
   border-radius: 0;
   background: #f5cd07;
   color: #1a1a1a;
   font-family: 'Lato', sans-serif;
   font-size: 16px;
   font-weight: bold;
   line-height: 1.2;
   cursor: pointer;
}
.cookie-banner .cookie-banner__btn:hover {
   background: #1a1a1a;
   color: #ffffff;
}
.cookie-banner a:focus-visible,
.cookie-banner .cookie-banner__btn:focus-visible {
   outline: 3px solid #1a1a1a;
   outline-offset: 3px;
}

/* Footer "Cookie settings" (a link without JavaScript, a button with it): keyboard focus ring on
   the grey legal bar, where the browser's default ring is hard to see. */
#legal a[data-cookie-settings]:focus-visible {
   outline: 2px solid #f5cd07;
   outline-offset: 2px;
}

@media (max-width: 768px) {
   .cookie-banner__inner {
      flex-direction: column;
      align-items: stretch;
      padding: 14px 16px;
   }
   .cookie-banner p {
      font-size: 15px;
   }
   .cookie-banner__actions .cookie-banner__btn {
      flex: 1 1 0;
      min-width: 0;
   }
}
