/* v2 legal pages (templates/pages/v2/show.html.twig) — redesign 2026.
   Only the chrome is v2 (header, footer, page title): the legal text is the legacy markup of
   templates/pages/{locale}/*.html.twig, untouched, and keeps its legacy look. This file ports
   the legacy rules that styled it (custom.css, style.css, base.css + UIkit's body colour),
   scoped under .bf-legal__main so the v2 header and footer are not affected. The legacy CSS
   files are not loaded: they would restyle the v2 chrome. */

/* ---- Legacy fonts (custom.css) ---- */

@font-face {
  font-family: 'HCo Knockout 26';
  src: url('../../fonts/knockout/woff2/Knockout-26_Web.woff2') format('woff2'),
       url('../../fonts/knockout/woff/Knockout-26_Web.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'HCo Knockout 27';
  src: url('../../fonts/knockout/woff2/Knockout-27_Web.woff2') format('woff2'),
       url('../../fonts/knockout/woff/Knockout-27_Web.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'HCo Knockout 28';
  src: url('../../fonts/knockout/woff2/Knockout-28_Web.woff2') format('woff2'),
       url('../../fonts/knockout/woff/Knockout-28_Web.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Legacy declares this face as 'Helvetica Neue'. That name is in UIkit's system font stack,
   so declaring it here would also change any v2 text left on the UIkit stack: own name. */
@font-face {
  font-family: 'BF Legal Helvetica Neue';
  src: url('../../fonts/helvetica_neue/HelveticaNeueLTStd-Md.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* ---- Legacy content look ---- */

/* body (custom.css: font, cream background; UIkit: colour, line-height). */
.bf-legal .bf-legal__main {
  font-family: 'BF Legal Helvetica Neue';
  font-size: 16px;
  line-height: 1.5;
  color: #666;
  background: #f9f6f1;
}

/* `.page .content` vertical padding (base.css). */
.bf-legal .bf-legal__main > .content {
  padding-top: 50px;
  padding-bottom: 50px;
}

.bf-legal .bf-legal__main h1 {
  font-family: 'HCo Knockout 27';
  text-transform: uppercase;
  font-size: 50px;
  line-height: 55px;
}

.bf-legal .bf-legal__main h2 {
  font-family: 'HCo Knockout 26';
  text-transform: uppercase;
  font-size: 50px;
  line-height: 55px;
}

.bf-legal .bf-legal__main h3 {
  font-family: 'HCo Knockout 28';
  text-transform: uppercase;
  font-size: 40px;
  line-height: 46px;
}

.bf-legal .bf-legal__main h4 {
  font-family: 'HCo Knockout 28';
  text-transform: uppercase;
  font-size: 30px;
  line-height: 36px;
}

.bf-legal .bf-legal__main a {
  color: #000;
  text-decoration: none !important;
  transition: color .3s ease-in-out, box-shadow .3s ease-in-out, background-color .3s ease-in-out;
}

.bf-legal .bf-legal__main a:hover {
  color: #fff;
}

@media (min-width: 640px) {
  .bf-legal .bf-legal__main h1 {
    font-size: 90px;
    line-height: 100px;
    margin-top: 40px;
    margin-bottom: 40px;
  }

  .bf-legal .bf-legal__main h2 {
    font-size: 70px;
  }
}

@media (max-width: 639px) {
  .bf-legal .bf-legal__main {
    font-size: 14px;
  }
}

/* ---- Page title: v2 style (the only v2 element of the legal text) ----
   The first heading of the legal text: an h2 (h1 in de/en-ie/en-us/it privacy-policy), first
   child of .content or right after the print logo (pages/embeds/print_header.html.twig).
   de-de GPC 2024-12-23 puts a date <p> between the logo and the h2.
   Same treatment as the dark-on-light v2 section titles (directory.css .bf-prov-clubs__title):
   the hero titles (54-104px) are sized for image heroes, too big for long legal titles. */

.bf-legal .bf-legal__main > .content > h1:first-child,
.bf-legal .bf-legal__main > .content > h2:first-child,
.bf-legal .bf-legal__main > .content > .print-logo:first-child + h1,
.bf-legal .bf-legal__main > .content > .print-logo:first-child + h2,
.bf-legal .bf-legal__main > .content > .print-logo:first-child + p + h2 {
  /* !important on margin-bottom: 24 templates put uk-margin-medium-bottom on this h2. */
  margin: 0 0 24px !important;
  font: 400 38px/.95 var(--bf-font-display);
  text-transform: uppercase;
  color: var(--bf-c-black);
}

@media (min-width: 960px) {
  .bf-legal .bf-legal__main > .content > h1:first-child,
  .bf-legal .bf-legal__main > .content > h2:first-child,
  .bf-legal .bf-legal__main > .content > .print-logo:first-child + h1,
  .bf-legal .bf-legal__main > .content > .print-logo:first-child + h2,
  .bf-legal .bf-legal__main > .content > .print-logo:first-child + p + h2 {
    margin-bottom: 40px !important;
    font-size: 68px;
  }
}

/* ---- Print (legacy base.css @media print) ---- */

@media print {
  /* Logo embedded in the legal text (pages/embeds/print_header.html.twig), hidden on screen. */
  .bf-legal .print-logo {
    display: block !important;
    max-width: 150px;
  }

  .bf-legal .bf-header,
  .bf-legal .bf-promo-bar,
  .bf-legal .bf-footer,
  .bf-legal .bf-contact-bubble,
  .bf-legal .bf-contact-modal,
  .bf-legal .bf-menu {
    display: none !important;
  }
}