/* chrome.css — shared site-chrome styles for talventech.com (single source).
   Linked at the top of partials/nav.html, stamped into every page by
   tools/sync-chrome.mjs; loads after each page's inline <style>, so it wins ties.
   Institutional register — no mega-menus; the mobile menu is the studio-proven
   no-JS <details> pattern (closed panel must be display:none: modern Chrome keeps
   geometry for closed details children, which leaks horizontal overflow). */

.navright{ display:flex; align-items:center; gap:18px; }

.mnav{ display:none; }
@media (max-width:900px){
  .mnav{ display:block; position:static; }
  .mnav summary{ list-style:none; display:inline-flex; flex-direction:column;
    justify-content:center; gap:5px; width:40px; height:40px; padding:0 10px;
    border:1px solid var(--line); border-radius:10px; cursor:pointer; background:transparent; }
  .mnav summary::-webkit-details-marker{ display:none; }
  .mnav summary:hover{ border-color:rgba(31,148,96,.55); }
  .mnav summary .mbar{ display:block; height:2px; width:100%; background:var(--tx);
    border-radius:2px; transition:transform .22s, opacity .22s; }
  .mnav[open] summary .mbar:nth-child(1){ transform:translateY(7px) rotate(45deg); }
  .mnav[open] summary .mbar:nth-child(2){ opacity:0; }
  .mnav[open] summary .mbar:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
  .mnav:not([open]) .mpanel{ display:none; }
  .mnav .mpanel{ position:fixed; top:70px; right:12px; left:auto; z-index:60;
    width:min(320px, calc(100vw - 24px)); max-height:calc(100vh - 92px); overflow:auto;
    background:#fff; border:1px solid var(--line-soft); border-radius:16px;
    box-shadow:0 30px 70px -30px rgba(26,26,31,.45), 0 8px 24px -12px rgba(26,26,31,.18);
    padding:16px 12px; }
  .mnav .mpanel .mh{ font-size:10.5px; font-weight:600; letter-spacing:.22em;
    text-transform:uppercase; color:var(--tx3); margin:14px 10px 6px; }
  .mnav .mpanel .mh:first-child{ margin-top:0; }
  .mnav .mlink{ display:block; font-family:var(--body); font-size:15px; font-weight:500;
    color:var(--tx); text-decoration:none; padding:10px; border-radius:9px; }
  .mnav .mlink:hover{ background:rgba(31,148,96,.07); }
}
@media (max-width:480px){
  .navright{ gap:12px; }
  .nav .wordmark{ font-size:16px; }
  .mnav summary{ width:36px; height:36px; padding:0 8px; }
}
@media (prefers-reduced-motion:reduce){
  .mnav summary .mbar{ transition:none; }
}

/* footer v3 (2026-07-24): compact company endcap.
   The previous five-column chassis survived the content simplification and made
   three small groups consume almost a full viewport. Keep the dark close, but
   let the content — not inherited whitespace — determine its height. */
footer.dark{ padding:44px 0 28px; }
footer.dark .fgrid.three{
  grid-template-columns:minmax(260px,1.8fr) minmax(130px,.7fr) minmax(130px,.7fr);
  gap:48px;
  align-items:start;
}
footer.dark .fbrand p{ margin-top:12px; max-width:360px; line-height:1.55; }
footer.dark .fcol .fh{ margin-bottom:14px; }
footer.dark .fcol ul{
  margin:0;
  flex-direction:row;
  align-items:center;
  flex-wrap:wrap;
  gap:0;
}
footer.dark .fcol li{ display:inline-flex; align-items:center; }
footer.dark .fcol li + li::before{
  content:"·";
  margin:0 10px;
  color:var(--tx3);
}
footer.dark .fbottom{
  margin-top:32px;
  padding-top:18px;
  align-items:center;
  flex-wrap:nowrap;
}
.futility{ display:flex; align-items:center; gap:22px; }
.futility a{ color:var(--tx3); text-decoration:none; }
.futility a:hover{ color:var(--tx); }
/* .langswitch removed 2026-07-26 with the EN/FR toggle it styled; it returns
   with the FR mirror. Kept out rather than kept dead — see partials/nav.html. */

@media (max-width:900px){
  footer.dark .fgrid.three{
    grid-template-columns:minmax(220px,1.4fr) minmax(120px,.7fr) minmax(120px,.7fr);
    gap:28px;
  }
}
@media (max-width:600px){
  footer.dark{ padding:40px 0 28px; }
  footer.dark .fgrid.three{
    grid-template-columns:1fr;
    gap:24px;
  }
  footer.dark .fbrand p{ max-width:100%; }
  footer.dark .fgrid.three .fcol:not(.fbrand){
    display:grid;
    grid-template-columns:88px minmax(0,1fr);
    align-items:baseline;
    gap:20px;
  }
  footer.dark .fgrid.three .fcol:not(.fbrand) .fh{ margin:0; }
  footer.dark .fbottom{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
    margin-top:30px;
    padding-top:18px;
  }
  .futility{ flex-wrap:wrap; gap:10px 20px; }
}