/* One continuous frame from the navigation to the footer. */
body.nuweb-site {
  position: relative;
  --frame-gutter: 6.5vw;
  --nuweb-frame-line: #0ac18e33;
  --nuweb-frame-pad: clamp(20px, 2vw, 32px);
}

/* Keep homepage text inside the same rails at every breakpoint. */
body.nuweb-site #content .nuweb-home :is(.scene,.normal-bridge,.contact-section) {
  padding-inline: calc(var(--frame-gutter) + var(--nuweb-frame-pad));
}

/* The fixed header supplies the first segment of these document-height rails. */
body.nuweb-site::before {
  content: "";
  position: absolute;
  inset: var(--header-height) var(--frame-gutter) 0;
  z-index: 2;
  border-inline: 1px solid var(--nuweb-frame-line);
  pointer-events: none;
}

body.nuweb-site .site-header {
  /* Legacy subpage selectors set a literal 84px height. Keep the frame token authoritative. */
  height: var(--header-height) !important;
  view-transition-name: nuweb-header;
}

body.nuweb-site .site-header[data-scrolled] {
  /* The shared frame replaces the legacy opaque subpage header surface. */
  background: #020b0766 !important;
  backdrop-filter: blur(12px) !important;
}

body.nuweb-site .site-header::before,
body.nuweb-site .site-header::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

body.nuweb-site .site-header::before {
  inset: 0 var(--frame-gutter);
  border-inline: 1px solid var(--nuweb-frame-line);
}

body.nuweb-site .site-header::after {
  inset: auto var(--frame-gutter) 0;
  border-bottom: 1px solid var(--nuweb-frame-line);
}

body.nuweb-site .nav-shell,
body.nuweb-site .footer-grid,
body.nuweb-site .footer-cta .cta-panel,
body.nuweb-site .nuweb-project-index,
body.nuweb-site .footer-languages {
  box-sizing: border-box;
  width: calc(100% - var(--frame-gutter) * 2);
  max-width: none;
  margin-inline: auto;
}

body.nuweb-site .nav-shell {
  padding-inline: var(--nuweb-frame-pad);
}

body.nuweb-site .site-footer,
body.nuweb-site .footer-cta {
  padding-block: 0;
  border-top: 0;
}

body.nuweb-site .footer-grid {
  grid-template-columns: 1.4fr 1fr 1.4fr 1.4fr 1fr;
  gap: 0;
  align-items: stretch;
  border-inline: 0;
  border-top: 1px solid var(--nuweb-frame-line);
}

body.nuweb-site .footer-grid > * {
  min-width: 0;
  padding-block: clamp(45px, 5vw, 80px);
  padding-inline: var(--nuweb-frame-pad);
}

body.nuweb-site .footer-about {
  max-width: none;
}

body.nuweb-site .footer-home-share {
  border-top: 0;
}

body.nuweb-site .footer-link-group {
  border-inline-start: 1px solid var(--nuweb-frame-line);
}

body.nuweb-site .footer-link-group a {
  font-size: 16px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

body.nuweb-site .footer-link-group h3 {
  font-size: 16px;
}

body.nuweb-site :is(.footer-contact-links, .footer-home-share) a {
  font-size: 16px;
  line-height: 1.55;
}

body.nuweb-site .footer-cta .cta-panel {
  padding-block: 100px;
  padding-inline: var(--nuweb-frame-pad);
  border-inline: 0;
  border-top: 1px solid var(--nuweb-frame-line);
}

body.nuweb-site .nuweb-project-index {
  margin-top: 0;
  padding: 24px var(--nuweb-frame-pad);
  border-top-color: var(--nuweb-frame-line);
}

body.nuweb-site .nuweb-menu-meta {
  border-top-color: var(--nuweb-frame-line);
}

body.nuweb-site .footer-languages {
  margin-top: 0;
  padding: 24px var(--nuweb-frame-pad) 30px;
  border-block: 1px solid var(--nuweb-frame-line);
}

body.nuweb-site :is(.nuweb-menu-languages, .footer-languages) .language-switch {
  gap: 22px;
  flex-wrap: wrap;
}

body.nuweb-site :is(.nuweb-menu-languages, .footer-languages) .language-link {
  /* Legacy page-specific header surfaces must not turn language labels into tiles. */
  background: transparent !important;
  padding-bottom: 5px;
  border-bottom: 1px solid transparent;
  border-bottom-color: transparent !important;
  font-size: 13px;
  line-height: 1.4;
  opacity: 1;
  color: var(--muted) !important;
}

body.nuweb-site .footer-languages .language-link {
  font-size: 16px;
}

body.nuweb-site :is(.nuweb-menu-languages, .footer-languages) .language-name {
  font-size: inherit;
}

body.nuweb-site :is(.nuweb-menu-languages, .footer-languages) .language-link.is-current,
body.nuweb-site :is(.nuweb-menu-languages, .footer-languages) .language-link:hover {
  color: var(--green) !important;
  border-bottom-color: var(--green) !important;
}

/* Native same-origin document navigation. Links and history remain native. */
@view-transition {
  navigation: auto;
}

::view-transition-group(root) {
  animation-duration: 620ms;
  animation-timing-function: cubic-bezier(.22, .61, .36, 1);
}

::view-transition-old(root) {
  animation: nuweb-document-out 620ms cubic-bezier(.22, .61, .36, 1) both;
  mix-blend-mode: plus-lighter;
}

::view-transition-new(root) {
  animation: nuweb-document-in 620ms cubic-bezier(.22, .61, .36, 1) both;
  mix-blend-mode: plus-lighter;
}

/* The navigation frame stays in place while the viewport content dissolves. */
::view-transition-group(nuweb-header) {
  animation-duration: 620ms;
  z-index: 2;
}

::view-transition-old(nuweb-header) {
  animation: nuweb-header-out 620ms ease both;
}

::view-transition-new(nuweb-header) {
  animation: nuweb-header-in 620ms ease both;
}

@keyframes nuweb-document-out {
  from { opacity: 1; filter: blur(0); transform: translateY(0); }
  to { opacity: 0; filter: blur(3px); transform: translateY(-20px); }
}

@keyframes nuweb-document-in {
  from { opacity: 0; filter: blur(4px); transform: translateY(20px); }
  to { opacity: 1; filter: blur(0); transform: translateY(0); }
}

@keyframes nuweb-header-out {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes nuweb-header-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@media (max-width: 1050px) {
  body.nuweb-site .footer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.nuweb-site .footer-about {
    padding-block: 40px;
    border-bottom: 1px solid var(--nuweb-frame-line);
  }

  body.nuweb-site .footer-link-group {
    padding-block: 30px;
    border-inline-start: 0;
  }

  body.nuweb-site .footer-link-group:nth-of-type(even) {
    border-inline-start: 1px solid var(--nuweb-frame-line);
  }

  body.nuweb-site .footer-link-group:nth-of-type(n + 3) {
    border-top: 1px solid var(--nuweb-frame-line);
  }
}

@media (max-width: 700px) {
  body.nuweb-site {
    --frame-gutter: 25px;
    --nuweb-frame-pad: 14px;
  }

  body.nuweb-site .nav-shell {
    padding-inline: 12px;
    gap: 14px;
  }

  body.nuweb-site .footer-cta .cta-panel {
    padding-block: 70px;
  }
}

@media (prefers-reduced-motion: reduce) {
  @view-transition {
    navigation: none;
  }

  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*) {
    animation: none !important;
  }
}