/* =========================================================================
   Shared site chrome: the NEW header + footer used on every page.
   Markup lives in _partials/new-header.html and _partials/new-footer.html.
   ========================================================================= */

/* six nav items → switch to the burger earlier */
.header-nav-item { margin: 0 .75vw; }
@media (max-width: 1180px) {
  :root { --header-height: 107px; }
  .header-desktop { display: none; }
  .header-mobile { display: flex; }
}

/* current section underlined in the nav */
.header-nav-item--active a {
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 1px 1px;
  background-position: 0 calc(100% - .1em);
  background-repeat: repeat-x;
}

/* Page headers (26 Oct 2026): navy texture (dot grid + soft glow) behind every dark page header
   without its own image; it drifts very slowly. The homepage hero keeps its photo. */
main > .page-section.dark:first-of-type > .section-bg:empty::before {
  content: ''; position: absolute; inset: -4%;
  background: url(/assets/bg/navy-texture.jpg) center / cover no-repeat;
}
@media (prefers-reduced-motion: no-preference) {
  main > .page-section.dark:first-of-type > .section-bg:empty::before { animation: header-drift 26s ease-in-out infinite alternate; }
}
@keyframes header-drift { from { transform: translate3d(0, 0, 0) scale(1); } to { transform: translate3d(-2%, 1.5%, 0) scale(1.04); } }

/* Footer (26 Oct 2026): same navy texture and drift as the page headers */
.footer > .page-section.dark > .section-bg::before {
  content: ''; position: absolute; inset: -4%;
  background: url(/assets/bg/navy-texture.jpg) center / cover no-repeat;
}
@media (prefers-reduced-motion: no-preference) {
  .footer > .page-section.dark > .section-bg::before { animation: header-drift 26s ease-in-out infinite alternate; }
}

/* Location pins (About "Global footprint", Contact): drop in with a small bounce, one after another (27 Oct 2026) */
@media (prefers-reduced-motion: no-preference) {
  .pin-drop.pre-slide { transform: none; opacity: 1; }
  .pin-drop img { opacity: 0; }
  .pin-drop.in img { animation: pin-drop .9s cubic-bezier(.3, 1.35, .5, 1) var(--pd, 0s) both; transform-origin: 50% 100%; }
}
@keyframes pin-drop {
  0%   { opacity: 0; transform: translateY(-60%) scaleY(1.06); }
  55%  { opacity: 1; transform: translateY(0) scaleY(.92); }
  75%  { transform: translateY(-8%) scaleY(1.02); }
  100% { opacity: 1; transform: translateY(0) scaleY(1); }
}

/* Footer credit (27 Oct 2026): centred in the bottom row on desktop, own line on mobile */
.footer-credit { text-align: center; }
.footer-credit a { color: inherit; text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: .2em; }
@media (max-width: 767px) { .footer-credit { text-align: left; } }
.footer-credit { text-align: right; }
@media (max-width: 767px) { .footer-credit { text-align: left; } }
@media (max-width: 767px) { #footer .footer-col-head { padding-top: 1.75rem; } }

/* Footer top (27 Oct 2026): the rounded top used to be a flat navy SVG at the bottom of the CTA section,
   so the footer texture started 2vw below the curve and left a seam. Round the footer itself instead. */
#cta .section-divider { display: none; }
body:has(#cta .section-divider) #footer { position: relative; z-index: 2; margin-top: -2vw; border-radius: 2vw 2vw 0 0; overflow: hidden; }

/* Nav hover (27 Oct 2026): underline draws in from the left, same line as the current-page underline */
.header-nav-item a {
  background-image: linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  background-position: 0 calc(100% - .1em);
  background-size: 0% 1px;
  transition: background-size .3s cubic-bezier(.4, 0, .2, 1);
}
.header-nav-item a:hover, .header-nav-item a:focus-visible { opacity: 1; background-size: 100% 1px; }
.header-nav-item--active a { background-size: 100% 1px; background-repeat: no-repeat; }

/* Cookie consent bar (27 Oct 2026, /consent.js): equal-weight choices, fixed to the bottom */
.consent { position: fixed; left: 0; right: 0; bottom: 0; z-index: 200; background: var(--white); border-top: 1px solid rgba(38, 59, 80, .15); box-shadow: 0 -12px 40px rgba(38, 59, 80, .12); padding-bottom: env(safe-area-inset-bottom); }
.consent[hidden] { display: none; }
.consent-bar { width: min(var(--sqs-site-max-width), calc(100% - var(--sqs-site-gutter) * 2)); margin: 0 auto; padding: 1rem 0; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.consent-text { margin: 0; max-width: 52em; font-size: .9rem; line-height: 1.5; color: #5d6b78; }
.consent-text strong { color: var(--black); font-weight: 600; }
.consent-text a { color: var(--black); text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: .2em; }
.consent-actions { display: flex; flex-shrink: 0; gap: .6rem; }
.consent-btn { padding: .8rem 1.4rem; border-radius: 300px; font: inherit; font-size: .95rem; font-weight: 500; cursor: pointer; transition: opacity .15s ease; }
.consent-btn:hover { opacity: .85; }
.consent-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.consent-btn--accept { background: var(--black); color: var(--white); border: 1px solid var(--black); }
.consent-btn--reject { background: var(--white); color: var(--black); border: 1px solid var(--black); }
@media (max-width: 767px) {
  .consent-bar { width: calc(100% - var(--sqs-mobile-site-gutter) * 2); flex-direction: column; align-items: stretch; gap: .9rem; }
  .consent-actions .consent-btn { flex: 1 1 0; }
}
/* Footer column titles are real headings (WCAG: no paragraphs styled as headings); look identical to the old p.large */
#footer h2.footer-heading { margin: 1rem 0; font-family: inherit; font-weight: inherit; letter-spacing: inherit; text-wrap: wrap; font-size: var(--fs-large); line-height: 1.5em; }
#footer .txt > h2.footer-heading:first-child { margin-top: 0; }
#footer .txt > h2.footer-heading:last-child { margin-bottom: 0; }