/* studio.notme navigation: warm ink, quiet amber and native disclosures. */
html{scroll-padding-top:var(--snm-nav-offset,auto)}
.nav.pivot-nav,.nav.pivot-nav *,.tool-nav,.tool-nav *{box-sizing:border-box}
.nav.pivot-nav{z-index:100;background:rgba(20,17,16,.94);border-bottom:1px solid var(--line-soft);backdrop-filter:blur(16px)}
.nav.pivot-nav .wrap{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;height:auto;min-height:80px;gap:24px;padding-top:0;padding-bottom:0}
.nav.pivot-nav .brand{flex:none;white-space:nowrap;min-height:44px}
.nav.pivot-nav .wrap>nav{margin-left:auto;position:static}
.nav.pivot-nav #menu{display:flex;position:static;align-items:center;gap:4px;margin:0;padding:0;list-style:none}
.nav.pivot-nav #menu>li{position:relative;min-width:0}
.nav.pivot-nav #menu>li>a,.nav.pivot-nav .offer-dropdown>summary{min-height:44px;padding:12px;font:500 14px/1.3 var(--fb);border:0;border-radius:10px;color:var(--muted);text-decoration:none;white-space:nowrap;transition:background .18s,color .18s}
.nav.pivot-nav #menu>li>a{display:flex;align-items:center}
.nav.pivot-nav #menu>li>a:hover,.nav.pivot-nav .offer-dropdown>summary:hover,.nav.pivot-nav .offer-dropdown[open]>summary{color:var(--head);background:var(--panel)}
.nav.pivot-nav #menu>li:last-child>a{border:1px solid var(--line);padding:10px 17px;color:var(--paper)}
.nav.pivot-nav #menu>li:last-child>a:hover{border-color:var(--safe-d);color:var(--safe)}
.nav.pivot-nav .nav-right{display:flex;align-items:center;flex:none;gap:12px}
.nav.pivot-nav .lang{margin:0;flex:none}
.nav.pivot-nav .lang button{min-height:28px;min-width:30px;padding:5px 9px}
.nav.pivot-nav .burger{display:none;flex:none;width:44px;height:44px;border-radius:12px;gap:5px}
.offer-dropdown{position:relative}
.offer-dropdown>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:9px;cursor:pointer}
.offer-dropdown>summary::-webkit-details-marker{display:none}
.offer-dropdown>summary svg{width:14px;height:14px;flex:none;stroke:var(--safe,var(--accent,#E8A33D));transition:transform .2s ease}
.offer-dropdown[open]>summary svg{transform:rotate(180deg)}
.offer-dropdown:not([open])>.offer-submenu{display:none!important}
.nav.pivot-nav #menu .offer-submenu,.tool-nav .offer-submenu{max-height:calc(100dvh - var(--snm-nav-top,80px) - 24px);overflow:auto;overscroll-behavior:contain}
.nav.pivot-nav #menu .offer-submenu,.tool-nav .offer-submenu{position:absolute;top:calc(100% + 16px);left:50%;right:auto;transform:translateX(-50%);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;width:500px;min-width:0;max-width:calc(100vw - 32px);margin:0;padding:16px;list-style:none;border:1px solid var(--line);border-radius:18px;background:var(--panel);box-shadow:0 24px 64px rgba(0,0,0,.38);z-index:5;animation:snm-menu-in .18s ease-out}
.nav.pivot-nav #menu .offer-submenu>li,.tool-nav .offer-submenu>li{min-width:0;position:static}
.offer-submenu .nav-intro,.offer-submenu .nav-overview{grid-column:1/-1}
.nav-intro{padding:7px 10px 18px;margin-bottom:5px;border-bottom:1px solid var(--line)}
.nav-eyebrow{display:block;font:600 11px/1.4 var(--fb,var(--sans,sans-serif));letter-spacing:.12em;text-transform:uppercase;color:var(--safe,var(--accent,#E8A33D));margin-bottom:8px}
.nav.pivot-nav .nav-intro p,.tool-nav .nav-intro p{font:500 22px/1.2 var(--fd,var(--sans,sans-serif));letter-spacing:-.02em;color:var(--head,var(--text));max-width:30ch;margin:0;text-wrap:balance}
.nav.pivot-nav #menu .offer-submenu a,.tool-nav .offer-submenu a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:50px;padding:13px 14px;border:1px solid transparent;border-radius:10px;background:rgba(127,110,87,.045);color:var(--paper,var(--text));font:400 14px/1.4 var(--fb,var(--sans,sans-serif));text-decoration:none;white-space:normal;overflow-wrap:anywhere;transition:background .18s,border-color .18s,color .18s}
.offer-submenu a::after{content:'→';flex:none;color:var(--safe,var(--accent,#E8A33D));opacity:.55;transition:opacity .18s,transform .18s}
.nav.pivot-nav #menu .offer-submenu a:hover,.tool-nav .offer-submenu a:hover,.nav.pivot-nav #menu .offer-submenu a:focus-visible,.tool-nav .offer-submenu a:focus-visible{border-color:var(--safe-d,var(--line));background:var(--panel-2,var(--panel2));color:var(--safe,var(--accent,#E8A33D))}
.offer-submenu a:hover::after,.offer-submenu a:focus-visible::after{opacity:1;transform:translateX(2px)}
.nav.pivot-nav #menu a[aria-current],.nav.pivot-nav .offer-dropdown.is-active>summary,.tool-nav .offer-submenu a[aria-current]{color:var(--safe,var(--accent,#E8A33D))}
.nav.pivot-nav :focus-visible,.tool-nav :focus-visible{outline:2px solid var(--safe,var(--accent,#E8A33D));outline-offset:3px}
.nav-scrim{position:fixed;inset:var(--snm-nav-top,80px) 0 0;z-index:99;background:rgba(10,8,7,.56);backdrop-filter:blur(3px)}
.nav-scrim[hidden]{display:none}
body.snm-nav-open{overflow:hidden}
/* Keep the configurator's independent header and language engine. */
.tool-nav{position:relative}
.tool-nav>ul{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;list-style:none;padding:0;margin:0;min-width:0}
.tool-nav .offer-dropdown{position:static}
.tool-nav .offer-dropdown>summary,.tool-nav>ul>li>a{font:500 14px/1.35 var(--sans,sans-serif);min-height:44px;padding:10px 12px;color:var(--text);border:1px solid var(--line);border-radius:10px;text-decoration:none}
.tool-nav .offer-dropdown[open]>summary,.tool-nav .offer-dropdown>summary:hover,.tool-nav>ul>li>a:hover{color:var(--accent);border-color:var(--accent)}
.tool-nav .offer-submenu{left:0;transform:none;top:calc(100% + 8px)}
@keyframes snm-menu-in{from{opacity:0;translate:0 -5px}to{opacity:1;translate:0 0}}
@media(max-width:1100px){
  .nav.pivot-nav .wrap{min-height:72px;gap:16px}
  .nav.pivot-nav .wrap>nav{display:contents;margin:0;order:3}
  .nav.pivot-nav .nav-right{margin-left:auto}
  .nav.pivot-nav .burger{display:flex}
  .nav.pivot-nav #menu{display:none;position:absolute;top:calc(100% + 10px);left:auto;right:16px;width:min(560px,calc(100vw - 32px));max-height:calc(100dvh - var(--snm-nav-top,72px) - 24px);overflow:auto;overscroll-behavior:contain;flex-direction:column;align-items:stretch;gap:5px;padding:12px;border:1px solid var(--line);border-radius:18px;background:var(--panel);box-shadow:0 24px 64px rgba(0,0,0,.35);z-index:2;scrollbar-width:thin;animation:snm-menu-in .18s ease-out}
  .nav.pivot-nav #menu.open{display:flex}
  .nav.pivot-nav #menu>li{width:100%}
  .nav.pivot-nav .offer-dropdown>summary{padding:16px 14px;min-height:56px;font-size:17px;color:var(--head);white-space:normal;overflow-wrap:anywhere}
  .nav.pivot-nav .offer-dropdown[open]>summary{color:var(--safe);background:var(--panel-2)}
  .nav.pivot-nav #menu .offer-submenu{position:static;transform:none;display:grid;top:auto;left:auto;width:100%;max-width:none;max-height:none;overflow:visible;padding:8px 0 12px;gap:4px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;box-shadow:none;animation:none}
  .nav.pivot-nav .nav-intro{padding:10px 14px 16px;margin:0 0 4px;border:0}
  .nav.pivot-nav .nav-intro p{font-size:20px}
  .nav.pivot-nav #menu .offer-submenu a{min-height:48px;margin:0 2px;padding:12px;font-size:15px}
  .nav.pivot-nav #menu>li>a{padding:15px 14px;min-height:52px;font-size:16px;white-space:normal}
  .nav.pivot-nav #menu>li:last-child>a{justify-content:center;border-color:var(--safe-d);background:rgba(232,163,61,.07);color:var(--safe);margin-top:4px}
  .nav.pivot-nav:not([data-nav-ready]) .wrap{flex-wrap:wrap}
  .nav.pivot-nav:not([data-nav-ready]) .wrap>nav{display:block;flex-basis:100%;order:3}
  .nav.pivot-nav:not([data-nav-ready]) #menu{display:flex;position:static;width:100%;max-height:none;overflow:visible;box-shadow:none;margin-bottom:14px}
  .nav.pivot-nav:not([data-nav-ready]) .burger{display:none}
}
@media(min-width:1101px){.nav.pivot-nav #menu{display:flex!important}}
@media(max-width:900px){
  .tool-nav>ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;align-items:start;gap:8px}
  .tool-nav>ul>li{min-width:0}
  .tool-nav .offer-dropdown{position:relative}
  .tool-nav .offer-dropdown>summary{white-space:normal;min-height:52px}
  .tool-nav .offer-submenu{position:static;transform:none;width:100%;max-width:none;max-height:none;overflow:visible;grid-template-columns:1fr;padding:8px;margin-top:8px;border-radius:12px;box-shadow:none}
  .tool-nav .nav-intro{padding:8px 5px 12px}
  .tool-nav .nav-intro p{font-size:18px}
  .tool-nav .offer-submenu a{font-size:13px;padding:12px 8px}
}
@media(max-width:600px){.nav.pivot-nav #menu .offer-submenu{grid-template-columns:1fr}}
@media(max-width:480px){
  .nav.pivot-nav .wrap{display:flex;min-height:68px;gap:8px;padding:0 12px}
  .nav.pivot-nav .wrap>nav{position:static;order:3}
  .nav.pivot-nav .nav-right{display:flex;gap:7px;margin-left:auto}
  .nav.pivot-nav .brand{font-size:18px;gap:6px}
  .nav.pivot-nav .brand svg{width:22px;height:22px}
  .nav.pivot-nav .lang{margin:0;padding:3px;gap:1px}
  .nav.pivot-nav .lang button{font-size:11px;min-width:26px;min-height:28px;padding:5px 6px}
  .nav.pivot-nav #menu{right:12px;width:calc(100vw - 24px)}
}
@media(max-width:360px){.nav.pivot-nav .wrap{gap:6px}.nav.pivot-nav .brand{font-size:17px}.nav.pivot-nav .nav-right{gap:5px}.nav.pivot-nav .lang button{min-width:25px;padding:5px}}
@media(prefers-reduced-motion:reduce){.nav.pivot-nav *,.tool-nav *{animation:none!important;transition:none!important}}
