/* A compact product selector and a separate, centered chapter dock. */
:root .header.site-header.nav-header {
  --nav-ink:#f5f6f4;--nav-muted:#b3b8b5;--nav-line:#ffffff18;
  --nav-surface:#101212f5;--nav-panel:#101212;--nav-chip:#ffffff08;--nav-hover:#ffffff10;
  --nav-accent:#d7ef58;--nav-selected:#d7ef5812;
  height:82px;padding:10px clamp(16px,2.5vw,64px);gap:0;border:0;
  background:transparent;backdrop-filter:none;color:var(--nav-ink);z-index:50;
  transition:none;
}
:root body:is(.family-home,[data-product]) .header.site-header.nav-header.nav-is-collapsed {pointer-events:none}
:root .nav-peek {
  position:fixed;z-index:51;top:19px;
  left:calc(max(clamp(16px,2.5vw,64px),(100% - 1680px)/2) + 8px);
  display:grid;place-items:center;width:44px;height:44px;margin:0;padding:5px;
  border:0;border-radius:13px;background:transparent;cursor:pointer;
  opacity:0;visibility:hidden;pointer-events:none;transform:scale(.88);
  transition:opacity .24s ease,transform .4s cubic-bezier(.22,1,.36,1),visibility .24s;
}
:root .nav-peek.is-visible {opacity:1;visibility:visible;pointer-events:auto;transform:scale(1);transition-delay:.09s}
:root .nav-peek[hidden] {display:none}
:root .nav-peek img {display:block;width:34px;height:34px;border-radius:9px;box-shadow:0 3px 14px #0003}
:root .nav-peek:focus-visible {outline:2px solid #d7ef58;outline-offset:3px}
:root body:is(.family-home,[data-product]) .header.site-header.nav-header,
:root body:is(.family-home,[data-product]) .header.site-header.nav-header.is-scrolled {
  background:transparent;border:0;backdrop-filter:none;
}
:root .nav-header .nav-shell {
  position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;gap:24px;width:100%;max-width:1680px;height:62px;
  margin-inline:auto;padding:7px 14px;border:1px solid transparent;border-radius:20px;
  clip-path:inset(0 0 0 0 round 20px);
  transition:clip-path .48s cubic-bezier(.22,1,.36,1),background .25s ease,border-color .25s ease,box-shadow .25s ease;
}
/* Reveal a compact navigation horizontally from the brand mark. The expanded
   clip includes dropdowns; their visibility is still controlled separately. */
:root .nav-header.nav-from-peek .nav-shell {
  clip-path:inset(0 0 0 0 round 20px);
  transition:clip-path .48s cubic-bezier(.22,1,.36,1),background .25s ease,border-color .25s ease;
}
:root .nav-header.menu-is-open .nav-shell {clip-path:inset(-2px -60px -700px -60px round 20px)}
:root .nav-header.nav-is-collapsed .nav-shell {clip-path:inset(9px calc(100% - 52px) 9px 8px round 13px);box-shadow:none}
:root .nav-header .site-brand {
  width:112px;flex:0 0 auto;opacity:1;visibility:visible;transform:scale(1);transform-origin:left center;
  transition:width .48s cubic-bezier(.22,1,.36,1),opacity .24s ease .1s,transform .4s ease,visibility .24s;
}
:root .nav-header.nav-is-collapsed .site-brand {width:38px;opacity:0;visibility:hidden;transform:scale(.88);transition-delay:0s}
:root .nav-header .nav-shell > *, :root .nav-header .robot-toggle {transition:opacity .22s ease .1s}
:root .nav-header.nav-is-collapsed .nav-shell > *, :root .nav-header.nav-is-collapsed .robot-toggle {opacity:0;transition:opacity .12s ease}
:root .nav-header:is(.is-scrolled,.menu-is-open) .nav-shell {
  background:var(--nav-surface);border-color:var(--nav-line);box-shadow:0 8px 24px #00000012;
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
}
.nav-identity,.nav-actions {display:flex;align-items:center;gap:18px;min-width:0}
.nav-actions {justify-content:flex-end;gap:8px}
:root .nav-header .site-brand img {width:112px;height:auto}
:root .nav-header button {font-family:inherit}
:root .nav-header .robot-toggle {
  display:inline-flex;align-items:center;justify-content:center;gap:10px;flex-shrink:0;
  height:42px;margin:0;padding:0 12px;background:var(--nav-chip);color:var(--nav-ink);
  border:1px solid var(--nav-line);border-radius:12px;cursor:pointer;font-size:14px;font-weight:400;
}
.nav-status {width:5px;height:5px;border-radius:50%;background:var(--nav-accent)}
.nav-chevron {width:6px;height:6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateY(-2px) rotate(45deg);margin-left:4px;transition:transform .2s}
.robot-toggle[aria-expanded=true] .nav-chevron {transform:translateY(2px) rotate(225deg)}
:root .header.site-header.nav-header .section-nav {
  display:flex;position:static;flex-direction:row;align-items:center;gap:2px;margin:0;padding:4px;
  border:1px solid var(--nav-line);border-radius:50px;background:var(--nav-chip);
}
:root .header.site-header.nav-header .section-nav a {
  position:relative;padding:11px 17px;border-radius:50px;color:var(--nav-muted);
  font-size:13px;line-height:18px;font-weight:400;white-space:nowrap;min-height:40px;
  transition:color .2s,background .2s;box-sizing:border-box;
}
:root .header.site-header.nav-header .section-nav a:hover {background:var(--nav-hover);color:var(--nav-ink)}
:root .header.site-header.nav-header .section-nav a[aria-current=location] {color:var(--nav-accent);background:var(--nav-selected)}
:root .header.site-header.nav-header .section-nav .nav-mobile-contact {display:none}
:root .header.site-header.nav-header .site-contact {
  margin:0;display:inline-flex;align-items:center;gap:20px;height:42px;padding:0 16px;
  border:1px solid var(--nav-line);border-radius:12px;background:var(--nav-chip);
  font-size:13px;line-height:1;color:var(--nav-ink);white-space:nowrap;transition:background .2s;
}
:root .nav-header .site-contact span {color:var(--nav-accent);font-size:18px;line-height:1}
:root .header.site-header.nav-header .theme-toggle {
  width:42px;min-width:42px;height:42px;padding:0;border:0;background:transparent;color:var(--nav-muted);border-radius:50%;
}
:root .nav-header .theme-toggle [data-theme-label] {display:none}
:root .header.site-header.nav-header :is(.theme-toggle,.robot-toggle,.site-contact):hover {background:var(--nav-hover);color:var(--nav-ink)}
:root .nav-header :is(button,a):focus-visible {outline:2px solid var(--nav-accent);outline-offset:4px}
:root .header.site-header.nav-header .menu-toggle {display:none}
:root .nav-header .robot-menu {
  position:absolute;left:0;top:calc(100% + 10px);width:530px;max-width:100%;margin:0;padding:18px;
  display:block;background:var(--nav-panel);color:var(--nav-ink);border:1px solid var(--nav-line);border-radius:22px;
  box-shadow:0 20px 65px #0005;max-height:calc(100svh - 105px);overflow:auto;
  animation:nav-arrive .2s ease both;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
}
:root .nav-header .robot-menu[hidden] {display:none}
.robot-menu-top {display:flex;align-items:center;justify-content:space-between;padding:3px 4px 16px;font-size:12px;color:var(--nav-muted)}
:root .nav-header .robot-menu-top a {color:var(--nav-muted);font-size:12px;padding:4px 0;display:inline-flex;gap:12px}
.robot-menu-grid {display:grid;grid-template-columns:1fr 1fr;gap:12px}
:root .nav-header .robot-card {display:block;border:1px solid var(--nav-line);border-radius:14px;padding:0;background:var(--nav-chip);overflow:hidden;color:var(--nav-ink);transition:background .2s,border-color .2s}
:root .nav-header .robot-card:hover {background:var(--nav-hover);border-color:var(--nav-accent)}
:root .nav-header .robot-card[aria-current=page] {border-color:color-mix(in srgb,var(--nav-accent) 40%,transparent)}
.robot-card-image {height:168px;display:flex;align-items:center;justify-content:center;padding:14px 18px 0;background:radial-gradient(ellipse at 50% 75%,#ffffff0a,transparent 75%)}
.robot-card-image img {width:100%;height:100%;object-fit:contain;transition:transform .3s ease}
.robot-card:hover img {transform:translateY(-4px)}
.robot-card-caption {display:flex;justify-content:space-between;align-items:center;padding:16px 16px 18px}
.robot-card-caption strong {display:block;font-size:19px;font-weight:450;letter-spacing:-.03em}
.robot-card-caption small {display:block;margin-top:4px;font-size:11px;color:var(--nav-muted)}
.nav-arrow {color:var(--nav-accent);font-size:21px;font-weight:300}
html[data-theme=light] .header.site-header.nav-header {
  --nav-ink:#202424;--nav-muted:#5c6463;--nav-line:#20242418;--nav-surface:#e8ebedf5;--nav-panel:#e8ebed;
  --nav-chip:#ffffff35;--nav-hover:#00000007;--nav-accent:#566a0c;--nav-selected:#566a0c12;
}
html[data-theme=light] .family-home .header.site-header.nav-header:not(.is-scrolled):not(.menu-is-open) {
  --nav-ink:#f5f6f4;--nav-muted:#ebedeb;--nav-line:#ffffff25;--nav-chip:#00000018;
  --nav-hover:#ffffff15;--nav-accent:#d7ef58;--nav-selected:#d7ef5812;
}
html[data-theme=light] .family-home .nav-header.menu-is-open .site-brand .brand-logo-dark {display:none}
html[data-theme=light] .family-home .nav-header.menu-is-open .site-brand .brand-logo-light {display:block}
@keyframes nav-arrive {from {opacity:0;transform:translateY(-6px)}to {opacity:1;transform:none}}
@media(max-width:1300px) and (min-width:1101px) {
  :root .nav-header .nav-shell {gap:12px;padding-inline:10px}
  .nav-identity {gap:12px}
  :root .nav-header .site-brand img {width:100px}
  :root .nav-header:not(.nav-is-collapsed) .site-brand {width:100px}
  :root .header.site-header.nav-header .section-nav a {padding-inline:11px}
  :root .header.site-header.nav-header .site-contact {gap:10px;padding-inline:12px}
}
@media(max-width:1100px) {
  :root .nav-header .nav-shell {grid-template-columns:1fr auto}
  :root .header.site-header.nav-header .section-nav {
    display:none;position:absolute;top:calc(100% + 10px);left:auto;right:0;width:340px;max-width:100%;
    margin:0;padding:12px;flex-direction:column;align-items:stretch;gap:0;
    background:var(--nav-panel);border:1px solid var(--nav-line);border-radius:20px;
    box-shadow:0 20px 65px #0005;max-height:calc(100svh - 105px);overflow:auto;animation:nav-arrive .2s ease both;
  }
  :root .header.site-header.nav-header .section-nav.open {display:flex}
  :root .header.site-header.nav-header .section-nav a {display:flex;align-items:center;justify-content:space-between;min-height:50px;font-size:17px;padding:12px 16px;border-radius:12px}
  :root .header.site-header.nav-header .section-nav a[aria-current=location]::after {content:'';width:5px;height:5px;border-radius:50%;background:var(--nav-accent)}
  :root .header.site-header.nav-header .menu-toggle {display:flex;align-items:center;justify-content:center;gap:5px;width:42px;height:42px;padding:10px;border:1px solid var(--nav-line);border-radius:12px;background:var(--nav-chip)}
  :root .header.site-header.nav-header .menu-toggle span {width:18px;background:var(--nav-ink);transition:transform .2s}
  .nav-header .menu-toggle[aria-expanded=true] span:first-child {transform:translateY(3px) rotate(45deg)}
  .nav-header .menu-toggle[aria-expanded=true] span:last-child {transform:translateY(-3px) rotate(-45deg)}
}
@media(max-width:760px) {
  :root .nav-peek {top:13px;left:16px}
  :root .nav-header.nav-is-collapsed .nav-shell {clip-path:inset(6px calc(100% - 48px) 6px 4px round 13px)}
  :root .header.site-header.nav-header {height:70px;padding:7px 12px}
  :root .nav-header .nav-shell {height:56px;padding:5px 8px;gap:8px;border-radius:17px}
  :root .nav-header .site-brand img {width:86px}
  :root .nav-header:not(.nav-is-collapsed) .site-brand {width:86px}
  .nav-identity {gap:10px}.nav-actions {gap:2px}
  :root .nav-header .robot-toggle {padding-inline:10px;gap:7px;font-size:13px;height:40px}
  .nav-status {display:none}.nav-chevron {margin-left:3px}
  :root .header.site-header.nav-header .theme-toggle {width:38px;min-width:38px}
  :root .header.site-header.nav-header .site-contact {display:none}
  :root .header.site-header.nav-header .section-nav .nav-mobile-contact {display:flex;font-size:14px;color:var(--nav-accent);margin-top:8px;background:var(--nav-chip)}
  :root .nav-header .robot-menu {padding:12px;border-radius:18px;max-height:calc(100svh - 90px)}
  .robot-menu-grid {gap:8px}.robot-menu-top {padding:2px 4px 12px}
  .robot-card-image {height:140px;padding:12px 10px 0}.robot-card-caption {padding:14px 12px}
  .robot-card-caption strong {font-size:17px}
  :root .header.site-header.nav-header .section-nav {width:100%;max-height:calc(100svh - 90px)}
}
@media(prefers-reduced-motion:reduce) {
  :root .nav-peek {transition:none}
  :root .header.site-header.nav-header {transition:none}
  :root .nav-header * {animation:none!important;transition:none!important}
}
