/* Equal side columns keep the navigation centred independently of the logo width. */
.feer-nav-actions{display:contents}
@media(min-width:1200px){
  .feer-nav-inner{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);column-gap:20px}
  .feer-brand{grid-column:1;grid-row:1;justify-self:start;margin-inline-end:0}
  .feer-navigation{grid-column:2;grid-row:1;justify-self:center;gap:24px}
  .feer-nav-actions{grid-column:3;grid-row:1;justify-self:end;display:flex;align-items:center;gap:20px;margin-inline-end:64px}
  .feer-nav-actions .feer-language{margin-inline-start:0}
  .feer-nav .theme-toggle{grid-column:3;grid-row:1;justify-self:end;margin:0}
}

/* Inset header shared by every page using the common navigation. */
.feer-nav{width:calc(100% - 32px);max-width:1360px;margin:16px auto;top:12px;border:1px solid var(--line);border-radius:18px;box-shadow:0 8px 30px color-mix(in srgb,var(--navy-deep) 12%,transparent)}
/* Glass bar (2026-10-25): more translucent, stronger frost, a hairline top highlight. Solid fallbacks sit in apple-foundation.css (reduced transparency, more contrast). */
.feer-nav{background:color-mix(in srgb,var(--navy-deep) 88%,transparent);-webkit-backdrop-filter:blur(22px) saturate(170%);backdrop-filter:blur(22px) saturate(170%);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 1px 1px rgba(0,0,0,.18),0 14px 34px -18px rgba(0,0,0,.55)}
:root[data-theme="light"] .feer-nav{background:color-mix(in srgb,#f8f7f4 76%,transparent);border-color:rgba(30,27,23,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 1px 2px rgba(30,27,23,.06),0 14px 34px -20px rgba(30,27,23,.28)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.feer-nav{background:var(--navy-deep)}:root[data-theme="light"] .feer-nav{background:#f8f7f4}}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){.feer-nav{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--navy-deep)}:root[data-theme="light"] .feer-nav{background:#f8f7f4}}
.feer-nav-inner{min-height:72px;padding:10px 22px;border-radius:inherit}
@media(max-width:1199px){.feer-nav-inner{display:flex;flex-wrap:wrap;gap:12px}.feer-nav .feer-navigation{order:5;flex:1 0 100%;display:grid;grid-template-columns:1fr 1fr;gap:0 24px;max-height:65dvh;overflow:auto}.feer-nav .feer-navigation a{border-bottom:1px solid var(--line)}.feer-nav .feer-brand{margin-inline-end:auto}.feer-nav .feer-language{margin-inline-start:0}}
@media(max-width:600px){.feer-nav{width:calc(100% - 20px);margin-block:10px;top:8px;border-radius:14px}.feer-nav-inner{padding:9px 12px;gap:8px;min-height:64px}.feer-nav .feer-navigation{grid-template-columns:1fr}.feer-nav .feer-language{display:none}.feer-nav:has(.feer-menu-toggle[aria-expanded=true]) .feer-language{display:block}.feer-nav .precision-logo{font-size:15px}.feer-nav .feer-mobile-contact{display:block}}
@media(min-width:1200px) and (max-width:1399px){html:not([lang="en"]) .feer-nav-inner{display:flex;flex-wrap:wrap;gap:12px}html:not([lang="en"]) .feer-nav .feer-navigation{order:5;flex:1 0 100%;display:grid;grid-template-columns:1fr 1fr;max-height:65dvh;overflow:auto}html:not([lang="en"]) .feer-nav-actions{display:contents}html:not([lang="en"]) .feer-brand{margin-inline-end:auto}}

/* No layout jump before site-navigation.js runs: with scripting on, start from the collapsed mobile menu (the script reaches the same state). Without scripting the link list stays open. */
@media(scripting:enabled) and (max-width:1199px){
  .feer-nav:not(:has(.feer-menu-toggle[aria-expanded=true])) .feer-navigation{display:none}
  .feer-menu-toggle[hidden]{display:block}
}
@media(scripting:enabled) and (min-width:1200px) and (max-width:1399px){
  html:not([lang="en"]) .feer-nav:not(:has(.feer-menu-toggle[aria-expanded=true])) .feer-navigation{display:none}
  html:not([lang="en"]) .feer-menu-toggle[hidden]{display:block}
}
/* Scroll edge and vibrant menu text (2026-10-26, M approved). The bar loses its hard bottom line:
   the hairline fades out toward the bottom edge, and a soft fade sits under the bar only while
   content scrolls beneath it (html.feer-scrolled, set in site-navigation.js). Menu text goes one
   weight step up with +0.01em tracking, in the full ink colour, never a flat grey on glass.
   Reduced transparency and more contrast keep the solid bar and its full border (below). */
.feer-nav{border-color:transparent}
.feer-nav::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;
  background:linear-gradient(to bottom,var(--line) 0,var(--line) 45%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
:root[data-theme="light"] .feer-nav::before{background:linear-gradient(to bottom,rgba(30,27,23,.18) 0,rgba(30,27,23,.18) 45%,transparent 100%)}
.feer-nav::after{content:"";position:absolute;left:18px;right:18px;top:100%;height:16px;pointer-events:none;border-radius:0 0 16px 16px;
  background:linear-gradient(to bottom,color-mix(in srgb,var(--navy-deep) 34%,transparent),transparent);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  -webkit-mask:linear-gradient(to bottom,#000,transparent);mask:linear-gradient(to bottom,#000,transparent);
  opacity:0;transition:opacity .25s ease}
:root[data-theme="light"] .feer-nav::after{background:linear-gradient(to bottom,rgba(30,27,23,.10),transparent)}
html.feer-scrolled .feer-nav::after{opacity:1}
.feer-navigation a,.feer-language summary{font-weight:600;letter-spacing:.01em;color:var(--ivory)}
@media(prefers-reduced-motion:reduce){.feer-nav::after{transition:none}}
@media(prefers-reduced-transparency:reduce){.feer-nav{border-color:var(--line)}:root[data-theme="light"] .feer-nav{border-color:rgba(30,27,23,.16)}.feer-nav::before,.feer-nav::after{display:none}}
@media(prefers-contrast:more){.feer-nav{border-color:var(--ivory)}.feer-nav::before,.feer-nav::after{display:none}}
:root[data-theme="light"] .feer-nav{border-color:transparent}
.feer-nav{position:sticky}
@media(prefers-reduced-transparency:reduce){:root[data-theme="light"] .feer-nav{border-color:rgba(30,27,23,.16)}}
@media(prefers-contrast:more){:root[data-theme="light"] .feer-nav{border-color:var(--ivory)}}

/* Header phone (M approved 2026-10-27): number always visible, hours line from 1400px up. */
.feer-phone{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;line-height:1.2;min-width:0}
.feer-phone a{display:inline-flex;align-items:center;gap:7px;min-height:44px;font-size:1rem;font-weight:600;letter-spacing:.01em;color:var(--ivory);white-space:nowrap;text-decoration:none}
.feer-phone a:hover,.feer-phone a:focus-visible{text-decoration:underline;text-underline-offset:3px}
.feer-phone small{display:none;font-size:.75rem;color:color-mix(in srgb,var(--ivory) 80%,transparent);max-width:19rem}
.feer-phone svg{flex:none}
.gradient-home .feer-phone a{color:var(--gradient-ink)}
.gradient-home .feer-phone small{color:color-mix(in srgb,var(--gradient-ink) 80%,transparent)}
@media(min-width:1400px){.feer-phone{margin-inline-end:4px}.feer-phone a{min-height:0}:root:lang(en) .feer-phone small{display:block}}
@media(min-width:1800px){:root:not(:lang(en)) .feer-phone small{display:block}}
@media(min-width:1200px) and (max-width:1399px){.feer-phone svg{display:none}}
/* Phones: the number stays in the top bar instead of a second row (the header was 142px
   tall at 390px). Hours drop out of the bar; under 480px the number is a 44px call button
   whose accessible name is still the number. 27 Oct 2026. */
@media(max-width:600px){
  .feer-nav .feer-phone{flex:0 0 auto;margin-inline-start:auto}
  .feer-nav .feer-phone small{display:none}
}
@media(max-width:479px){
  .feer-nav .feer-phone a{font-size:0;gap:0;min-width:44px;min-height:44px;justify-content:center;border:1px solid var(--line);border-radius:999px}
  .feer-nav .feer-phone svg{width:18px;height:18px}
}
