/* widget: ss-nav */
.ss-nav {
  position: fixed; inset: 0 0 auto 0; z-index: 50;
  background: rgba(251, 249, 248, .8);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  transition: box-shadow .3s var(--ss-ease), background-color .3s var(--ss-ease);
}
.ss-nav.is-scrolled { background: rgba(251, 249, 248, .92); box-shadow: 0 6px 24px rgba(27, 28, 28, .06); }

.ss-nav__inner {
  max-width: var(--ss-max); margin-inline: auto;
  height: var(--ss-nav-h);
  padding-inline: var(--ss-gutter);
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px;
}
.ss-nav__brand {
  justify-self: start;
  font-family: var(--ss-font-display); font-style: italic; font-weight: 500;
  font-size: 1.5rem; line-height: 32px; color: var(--ss-primary); text-decoration: none; white-space: nowrap;
}
.ss-nav__menu { display: flex; align-items: center; gap: 32px; }
.ss-nav__links, .ss-nav__lang { display: flex; align-items: center; }
.ss-nav__links { gap: 32px; }
.ss-nav__links a, .ss-nav__lang a {
  position: relative; display: inline-block; padding-block: 1px;
  font-size: var(--ss-small); font-weight: 600; line-height: 20px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--ss-ink); text-decoration: none; transition: color .2s var(--ss-ease);
}
.ss-nav__links a::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px;
  background: var(--ss-accent); transform: scaleX(0); transform-origin: left; transition: transform .3s var(--ss-ease);
}
.ss-nav__links a:hover { color: var(--ss-primary); }
.ss-nav__links a:hover::after { transform: scaleX(1); }

/* active page — driven by <body data-page> (works without JS) */
body[data-page="home"] .ss-nav [data-nav="home"],
body[data-page="menu"] .ss-nav [data-nav="menu"],
body[data-page="gallery"] .ss-nav [data-nav="gallery"],
body[data-page="contact"] .ss-nav [data-nav="contact"],
.ss-nav__links a[aria-current="page"] { color: var(--ss-primary); }
body[data-page="home"] .ss-nav [data-nav="home"]::after,
body[data-page="menu"] .ss-nav [data-nav="menu"]::after,
body[data-page="gallery"] .ss-nav [data-nav="gallery"]::after,
body[data-page="contact"] .ss-nav [data-nav="contact"]::after,
.ss-nav__links a[aria-current="page"]::after { transform: scaleX(1); }

/* PT | EN | FR */
.ss-nav__lang li + li::before { content: '|'; margin-inline: .45em; color: var(--ss-ink); font-size: var(--ss-small); font-weight: 600; }
.ss-nav__lang a[aria-current="true"] { color: var(--ss-primary); }
.ss-nav__lang a:hover { color: var(--ss-primary); }

.ss-nav__cta { justify-self: end; }
.ss-nav__cta--mobile { display: none; }

/* burger */
.ss-nav__toggle {
  display: none; justify-self: end;
  width: 44px; height: 44px; padding: 0; border: 0; background: transparent; cursor: pointer; color: var(--ss-ink);
}
.ss-nav__bars, .ss-nav__bars::before, .ss-nav__bars::after {
  display: block; width: 24px; height: 2px; margin-inline: auto; background: currentColor; border-radius: 2px;
  transition: transform .3s var(--ss-ease), opacity .2s;
}
.ss-nav__bars { position: relative; }
.ss-nav__bars::before, .ss-nav__bars::after { content: ''; position: absolute; left: 0; }
.ss-nav__bars::before { top: -7px; }
.ss-nav__bars::after { top: 7px; }
.ss-nav.is-open .ss-nav__bars { background: transparent; }
.ss-nav.is-open .ss-nav__bars::before { transform: translateY(7px) rotate(45deg); }
.ss-nav.is-open .ss-nav__bars::after { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 1240px) {
  .ss-nav__menu, .ss-nav__links { gap: 22px; }
  .ss-nav__links a, .ss-nav__lang a { letter-spacing: .07em; }
}

@media (max-width: 1080px) {
  :root { --ss-nav-h: 72px; }
  .ss-nav__inner { grid-template-columns: 1fr auto; }
  .ss-nav__toggle { display: block; }
  .ss-nav__inner > .ss-nav__cta { display: none; }
  .ss-nav__menu {
    position: fixed; top: var(--ss-nav-h); left: 0; right: 0;
    flex-direction: column; align-items: stretch; gap: 0;
    padding: 8px var(--ss-gutter) 32px;
    background: var(--ss-bg); box-shadow: 0 24px 40px -16px rgba(27, 28, 28, .18);
    visibility: hidden; opacity: 0; transform: translateY(-8px);
    transition: opacity .3s var(--ss-ease), transform .3s var(--ss-ease), visibility 0s .3s;
    max-height: calc(100dvh - var(--ss-nav-h)); overflow-y: auto;
  }
  .ss-nav.is-open .ss-nav__menu { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
  .ss-nav__links { flex-direction: column; align-items: stretch; gap: 0; }
  .ss-nav__links a { display: block; padding: 18px 0; border-bottom: 1px solid rgba(188, 201, 202, .5); font-size: 1rem; }
  .ss-nav__links a::after { display: none; }
  .ss-nav__lang { padding-block: 20px; }
  .ss-nav__cta--mobile { display: inline-flex; }
}
@media (max-width: 400px) {
  .ss-nav__brand { font-size: 1.3rem; }
}

/* logo (SVG) in place of the text wordmark */
.ss-nav__brand { display: flex; align-items: center; }
.ss-nav__brand img { display: block; height: 58px; width: auto; }
@media (max-width: 560px) { .ss-nav__brand img { height: 48px; } }
