/* Shared site header — works on index + subpages */
.nav{
  --nav-canvas:var(--canvas,var(--page-bg,#faf9f5));
  --nav-soft:var(--soft,var(--bg-secondary,#f5f0e8));
  --nav-hairline:var(--hairline,var(--border-primary,#e6dfd8));
  --nav-hairline-soft:var(--hairline-soft,var(--gray-100,#ebe6df));
  --nav-ink:var(--ink,var(--fg-primary,#141413));
  --nav-body:var(--body,var(--fg-secondary,#3d3d3a));
  --nav-muted:var(--muted,var(--fg-tertiary,#6c6a64));
  --nav-muted-soft:var(--muted-soft,var(--gray-500,#8e8b82));
  --nav-coral-h:var(--coral-h,var(--accent-h,#a9583e));
  --nav-canvas-text:var(--canvas,#faf9f5);
  --nav-h:72px;
  --nav-max:min(1440px,100%);
  --nav-pad:clamp(16px,3vw,32px);
  --nav-radius:14px;
  position:sticky;top:0;z-index:300;
  background:var(--nav-canvas);
  border-bottom:1px solid transparent;
  transition:border-color .25s,box-shadow .25s
}
.nav.scrolled{border-color:var(--nav-hairline-soft);box-shadow:0 1px 0 rgba(0,0,0,.03)}
.nav-in{width:100%;max-width:var(--nav-max);margin:0 auto;padding:0 var(--nav-pad);height:var(--nav-h);display:flex;align-items:center;gap:0}
.nav-logo{display:flex;align-items:center;gap:6px;font-family:var(--ff-serif,var(--font-serif,"Cormorant Garamond",serif));font-size:clamp(24px,2.2vw,28px);font-weight:600;letter-spacing:-.025em;color:var(--nav-ink);flex-shrink:0}
.nav-logo svg,.nav-logo img{width:clamp(32px,2.8vw,36px);height:clamp(32px,2.8vw,36px);flex-shrink:0}
.nav-end{display:flex;align-items:center;gap:clamp(20px,3vw,36px);margin-left:auto;flex-shrink:0}
.nav-mid{display:flex;align-items:center;gap:2px}
.nav-item{position:relative}
.nav-trigger{display:flex;align-items:center;gap:6px;padding:10px 14px;font-size:16px;font-weight:500;color:var(--nav-ink);background:none;border:none;border-radius:10px;transition:background .15s,color .15s}
.nav-trigger:hover,.nav-item.open .nav-trigger{background:var(--nav-soft);color:var(--nav-ink)}
.nav-trigger svg{width:13px;height:13px;opacity:.5;transition:transform .2s}
.nav-item.open .nav-trigger svg{transform:rotate(180deg)}
.nav-drop{
  position:absolute;top:calc(100% + 8px);left:0;min-width:300px;padding:10px;
  background:#fff;border:1px solid var(--nav-hairline);border-radius:16px;
  box-shadow:0 16px 48px rgba(0,0,0,.09),0 2px 8px rgba(0,0,0,.04);
  opacity:0;visibility:hidden;transform:translateY(8px);
  transition:opacity .22s cubic-bezier(.22,1,.36,1),transform .22s cubic-bezier(.22,1,.36,1),visibility .22s
}
.nav-item--end .nav-drop{left:auto;right:0}
.nav-drop--wide{min-width:340px}
.nav-drop--cols{min-width:420px;padding:12px}
.nav-drop--pricing{min-width:320px}
.nav-item.open .nav-drop{opacity:1;visibility:visible;transform:none}
.nav-drop-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.nav-drop-grid .nav-link--full{grid-column:1/-1}
.nav-link{display:flex;align-items:flex-start;gap:12px;padding:10px 12px;border-radius:10px;text-decoration:none;color:inherit;transition:background .14s}
.nav-link:hover{background:var(--nav-soft);text-decoration:none}
.nav-link-title,.nav-link-desc{text-decoration:none}
.nav-logo,.btn-nav{text-decoration:none}
.nav-link-ico{
  width:36px;height:36px;border-radius:10px;background:var(--nav-soft);
  display:grid;place-items:center;flex-shrink:0;color:var(--nav-ink)
}
.nav-link-ico svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.nav-link-text{display:flex;flex-direction:column;gap:3px;min-width:0;padding-top:1px}
.nav-link-title{font-size:14px;font-weight:500;color:var(--nav-ink);line-height:1.3}
.nav-link-desc{font-size:12px;color:var(--nav-muted);line-height:1.45}
.nav-link--accent .nav-link-ico{background:rgba(204,120,92,.14);color:var(--nav-coral-h)}
.nav-drop-divider{height:1px;background:var(--nav-hairline-soft);margin:6px 8px}
.nav-drop-lbl{display:block;padding:10px 12px 4px;font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--nav-muted-soft)}
.nav-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.nav-actions .btn-nav{
  box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;
  min-width:108px;height:40px;padding:0 20px;
  font-size:14px;font-weight:500;line-height:1;
  border-radius:999px;border:1px solid rgba(20,20,19,.14);
  background:#fff;color:var(--nav-ink);white-space:nowrap;
  transition:background .15s,border-color .15s
}
.nav-actions .btn-nav:hover{background:var(--nav-soft);border-color:rgba(20,20,19,.2)}
.nav-actions .btn-nav--dark{background:var(--nav-ink);border-color:var(--nav-ink);color:var(--nav-canvas-text)}
.nav-actions .btn-nav--dark:hover{background:#2d2d2b;border-color:#2d2d2b}
.nav-toggle{display:none;width:40px;height:40px;border:1px solid var(--nav-hairline);background:#fff;border-radius:10px;align-items:center;justify-content:center;flex-direction:column;gap:5px;margin-left:auto}
.nav-toggle span{display:block;width:16px;height:1.5px;background:var(--nav-ink);transition:transform .2s,opacity .2s}
.nav.open .nav-toggle span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.nav.open .nav-toggle span:nth-child(2){opacity:0}
.nav.open .nav-toggle span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
@media(max-width:960px){
  .nav-toggle{display:flex}
  .nav-end{display:contents}
  .nav-mid,.nav-actions{display:none;position:absolute;top:var(--nav-h);left:0;right:0;background:var(--nav-canvas);border-bottom:1px solid var(--nav-hairline);padding:16px var(--nav-pad) 24px;flex-direction:column;align-items:stretch;gap:4px;max-height:calc(100svh - var(--nav-h));overflow-y:auto}
  .nav.open .nav-mid,.nav.open .nav-actions{display:flex}
  .nav-actions{padding-top:12px;border-top:1px solid var(--nav-hairline-soft)}
  .nav-actions .btn-nav{width:100%;min-width:0}
  .nav-item{width:100%}
  .nav-drop{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;background:transparent;padding:4px 0 8px 4px;display:none;min-width:0}
  .nav-item.open .nav-drop{display:block}
  .nav-drop--cols,.nav-drop--wide,.nav-drop--pricing{min-width:0}
  .nav-drop-grid{grid-template-columns:1fr}
  .nav-link{padding:10px 8px}
}