/* SK Minerals: the header menus and the footer link map. One file, loaded by every inner page
   (after site.css) and by the homepage (after day.css), so the navigation is styled once.
   It uses only tokens both stylesheets define. */

@media (min-width: 1001px) { .foot { grid-template-columns: minmax(0, 1fr) auto auto; } }
.foot__map { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem 2.5rem; padding-top: 1.5rem; }
.foot__map h2 { font-family: inherit; font-size: .82rem; font-weight: 700; letter-spacing: 0; color: #9d95c4; margin: 0 0 .7rem; }
.foot__map ul { display: grid; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.foot__map a { font-weight: 600; color: #cfc8ee; text-decoration: none; }
.foot__map a:hover { color: #fff; }
@media (max-width: 1000px) { .foot__map { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .foot__map { text-align: center; gap: 1.5rem 1rem; } }
.bar__item { position: relative; }
.bar__top { display: inline-flex; align-items: center; gap: .3rem; }
.bar__caret { flex: none; opacity: .6; transition: transform .25s var(--ease); }
.bar__sub { position: absolute; top: calc(100% + .55rem); left: 50%; min-width: 16rem; padding: .45rem; border-radius: 1.25rem; background: #fff; box-shadow: 0 1.5rem 3rem -1.2rem rgba(20, 19, 28, .45), 0 0 0 1px rgba(20, 19, 28, .05); opacity: 0; visibility: hidden; transform: translate(-50%, -.35rem); transition: opacity .2s, transform .2s var(--ease), visibility .2s; }
.bar__sub::before { content: ""; position: absolute; left: 0; right: 0; top: -.7rem; height: .7rem; }   /* keeps the menu open while the pointer crosses the gap */
.bar__item:hover .bar__sub, .bar__item:focus-within .bar__sub { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.bar__item:hover .bar__caret, .bar__item:focus-within .bar__caret { transform: rotate(180deg); }
.bar__nav .bar__sub a { display: block; padding: .6rem .85rem; border-radius: .8rem; font-size: .93rem; font-weight: 600; white-space: nowrap; }
.bar__nav .bar__sub a:hover, .bar__nav .bar__sub a[aria-current] { background: var(--paper); }
@media (max-width: 1000px) {
  .bar__nav { max-height: calc(100vh - var(--bar-h) - var(--bar-top) - 1.5rem); overflow-y: auto; overscroll-behavior: contain; }
  .bar__top { display: flex; justify-content: space-between; }
  .bar__caret { display: none; }
  .bar__sub { position: static; min-width: 0; padding: 0 0 .4rem .6rem; border-radius: 0; background: none; box-shadow: none; opacity: 1; visibility: inherit; transform: none; transition: none; }
  .bar__sub::before { content: none; }
  .bar__item:hover .bar__sub, .bar__item:focus-within .bar__sub { transform: none; }
  .bar__nav .bar__sub a { padding: .6rem 1rem; font-size: .98rem; font-weight: 600; color: var(--soft); white-space: normal; }
}

/* ----- cookie choice: the bar and the footer link (includes/site-consent.php) ----- */
.cookies { position: fixed; z-index: 70; left: 50%; bottom: max(.75rem, env(safe-area-inset-bottom)); transform: translateX(-50%); width: min(46rem, calc(100vw - 1.5rem)); display: flex; align-items: center; gap: 1rem 1.5rem; padding: 1rem 1.1rem 1rem 1.4rem; border-radius: 1.5rem; background: #fff; color: #14131c; box-shadow: 0 1.5rem 3rem -1.2rem rgba(20, 19, 28, .5), 0 0 0 1px rgba(20, 19, 28, .08); font-size: .92rem; line-height: 1.45; }
.cookies[hidden] { display: none; }
.cookies p { margin: 0; flex: 1 1 auto; min-width: 0; }
.cookies a { color: inherit; font-weight: 700; text-underline-offset: .2em; }
.cookies__acts { display: flex; gap: .5rem; flex: none; }
.cookies__acts button { font: inherit; font-weight: 700; padding: .65rem 1.2rem; border-radius: 999px; border: 1.5px solid #2d2277; background: #fff; color: #2d2277; cursor: pointer; transition: background .2s, color .2s; }
.cookies__acts button[data-cookies="yes"] { background: #2d2277; color: #fff; }
.cookies__acts button:hover { background: #5b35d5; border-color: #5b35d5; color: #fff; }
.cookies__acts button:focus-visible { outline: 3px solid rgba(91, 53, 213, .45); outline-offset: 2px; }
.foot__cookies { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; text-underline-offset: .25em; }
.foot__cookies:hover { color: #fff; }
@media (max-width: 640px) {
  .cookies { flex-direction: column; align-items: stretch; padding: 1rem; border-radius: 1.25rem; font-size: .88rem; }
  .cookies__acts button { flex: 1 1 0; }
}

/* ----- footer in one grid (owner, 13 Nov 2026): four equal columns shared by the top row and the
   link map, so every block starts on the same lines. Brand takes two columns, then Find us and
   Follow; below, Our businesses, Company (two columns of links) and More. The legal links sit in
   the bottom line with the copyright. ----- */
@media (min-width: 1001px) {
  .foot { grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 2.5rem; }
  .foot__brand { grid-column: span 2; }
  .foot__map { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem 2.5rem; padding-top: 2.25rem; border-top: 1px solid rgba(255, 255, 255, .12); }
  .foot__map-company { grid-column: span 2; }
  .foot__map-company ul { display: block; columns: 2; column-gap: 2.5rem; }
  .foot__map-company li { break-inside: avoid; padding-bottom: .5rem; }
  .social { flex-wrap: wrap; }
}
.foot__base { border-top: 1px solid rgba(255, 255, 255, .12); }
.foot__legal { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem 1.5rem; margin: 0; }
.foot__legal a, .foot__legal .foot__cookies { font-weight: 600; color: #cfc8ee; text-decoration: none; }
.foot__legal a:hover, .foot__legal .foot__cookies:hover { color: #fff; }
/* two columns on tablets and phones: the third group sits across both, so nothing is left alone on one side */
@media (max-width: 1000px) { .foot__map-more { grid-column: 1 / -1; } }