/* Grove navigation families: product (Home) and editorial (Journal). */

/* ---------- Home: confident, glassy, balanced ---------- */
.gh .gh-bar{
  position:fixed;
  top:calc(12px + env(safe-area-inset-top));
  left:50%;
  z-index:90;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  width:min(calc(100% - clamp(24px,6vw,64px)),1000px);
  max-width:none;
  min-height:60px;
  margin:0;
  padding:7px 10px 7px 17px;
  transform:translateX(-50%);
  border:1px solid color-mix(in srgb,var(--terra) 15%,var(--line));
  border-radius:999px;
  background:color-mix(in srgb,var(--canvas) 88%,transparent);
  box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 66%,transparent),0 5px 12px rgba(36,28,20,.07),0 20px 48px rgba(36,28,20,.12);
  backdrop-filter:blur(20px) saturate(1.12);
  -webkit-backdrop-filter:blur(20px) saturate(1.12);
  transition:background .25s ease,border-color .25s ease,box-shadow .25s ease;
}
.gh .gh-bar.scrolled{
  background:color-mix(in srgb,var(--canvas) 94%,transparent);
  border-color:color-mix(in srgb,var(--terra) 19%,var(--line));
  box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 70%,transparent),0 7px 16px rgba(36,28,20,.09),0 24px 54px rgba(36,28,20,.16);
}
.gh .gh-brand{
  align-items:center;
  gap:10px;
  min-width:0;
  min-height:44px;
  flex:none;
}
.gh .gh-brand .wm{font-size:27px}
.gh .gh-bar-r{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:4px;
  min-width:0;
  margin-left:auto;
}
.gh .nav-div{display:none}
.gh .quiet,.gh .btn-primary{
  min-height:44px;
  padding:0 13px;
  border-radius:999px;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}
.gh .quiet:hover,.gh .btn-primary:hover{
  background:color-mix(in srgb,var(--terra-soft) 58%,transparent);
}
.gh .btn-primary::after{display:none}
.gh .sec.hero{padding-top:calc(clamp(76px,11vh,128px) + 74px)}

/* ---------- Journal: warm paper, quieter and more editorial ---------- */
.gb .gb-bar{
  position:fixed;
  top:calc(12px + env(safe-area-inset-top));
  left:50%;
  z-index:90;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  width:min(calc(100% - clamp(24px,7vw,64px)),920px);
  max-width:none;
  min-height:58px;
  margin:0;
  padding:6px 10px 6px 17px;
  transform:translateX(-50%);
  border:1px solid color-mix(in srgb,var(--terra) 10%,var(--line));
  border-radius:999px;
  background:color-mix(in srgb,var(--canvas) 96%,transparent);
  box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 58%,transparent),0 8px 24px rgba(70,45,25,.075);
  backdrop-filter:blur(9px) saturate(.96);
  -webkit-backdrop-filter:blur(9px) saturate(.96);
  transition:background .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.gb.gb-article .gb-bar{width:min(calc(100% - clamp(24px,7vw,64px)),760px)}
.gb .gb-bar.scrolled{
  background:color-mix(in srgb,var(--canvas) 98%,transparent);
  border-color:color-mix(in srgb,var(--terra) 13%,var(--line));
  box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 64%,transparent),0 10px 28px rgba(70,45,25,.1);
}
.gb .gb-brand{
  align-items:center;
  gap:9px;
  min-width:0;
  min-height:44px;
  color:var(--ink);
}
.gb .gb-brand .wm{font-size:26px;color:var(--ink)}
.gb .journal-mark{overflow:visible}
.gb .journal-accessories{pointer-events:none}
.gb .journal-specs{
  color:var(--ink);
  transform-box:fill-box;
  transform-origin:center;
  animation:journalSpecsSettle .68s cubic-bezier(.22,.9,.3,1.28) .18s both;
}
.gb .journal-specs ellipse{fill:rgba(255,253,249,.16)}
.gb .journal-pen{
  transform-box:fill-box;
  transform-origin:18% 84%;
  animation:journalPenArrive .62s cubic-bezier(.22,.9,.3,1.18) .34s both;
}
.gb .journal-pen .barrel{stroke:var(--ink);fill:var(--terra2)}
.gb .journal-pen .cap{stroke:var(--ink);fill:var(--ink)}
.gb .journal-pen .nib{stroke:var(--ink);fill:var(--canvas)}
.gb .journal-pen .shine{stroke:var(--canvas)}
.gb .gb-brand:hover .mk .leaf,.gb .gb-brand:focus-visible .mk .leaf{animation:none}
.gb .gb-brand:hover .journal-specs,.gb .gb-brand:focus-visible .journal-specs{
  animation:journalSpecsNudge .52s cubic-bezier(.22,.9,.3,1.2) both;
}
.gb .gb-brand:hover .journal-pen,.gb .gb-brand:focus-visible .journal-pen{
  animation:journalPenJot .7s cubic-bezier(.22,.8,.28,1) both;
}
.gb .gb-brand:active .journal-specs{animation:journalSpecsNudge .42s cubic-bezier(.22,.9,.3,1.2) both}
.gb .gb-brand:active .journal-pen{animation:journalPenJot .56s cubic-bezier(.22,.8,.28,1) both}
@keyframes journalSpecsSettle{
  0%{opacity:0;transform:translateY(-13px) rotate(-7deg)}
  68%{opacity:1;transform:translateY(2px) rotate(1.5deg)}
  100%{opacity:1;transform:none}
}
@keyframes journalPenArrive{
  0%{opacity:0;transform:translate(9px,-7px) rotate(18deg)}
  100%{opacity:1;transform:none}
}
@keyframes journalSpecsNudge{
  0%,100%{transform:none}
  42%{transform:translateY(1px) rotate(-3deg)}
  72%{transform:translateY(-1px) rotate(1deg)}
}
@keyframes journalPenJot{
  0%,100%{transform:none}
  28%{transform:translate(-1px,2px) rotate(-7deg)}
  52%{transform:translate(2px,-1px) rotate(5deg)}
  74%{transform:translate(-1px,1px) rotate(-3deg)}
}
.gb .gb-brand .tag{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  margin-left:2px;
  padding-left:11px;
  border:0;
  border-left:1px solid color-mix(in srgb,var(--terra) 13%,var(--line));
  border-radius:0;
  background:none;
  color:var(--terra2);
  font:400 19px/1 var(--serif);
  font-style:italic;
  letter-spacing:0;
  text-transform:none;
  white-space:nowrap;
}
.gb .gb-bar-r{display:flex;align-items:center;justify-content:flex-end;gap:3px;margin-left:auto}
.gb .home-link,.gb .a11y-trigger{
  min-height:44px;
  padding:0 11px;
  border-radius:999px;
  transition:background .18s ease,color .18s ease;
}
.gb .home-link:hover,.gb .a11y-trigger:hover{
  background:color-mix(in srgb,var(--terra-soft) 44%,transparent);
}
.gb>.wrap{padding-top:calc(clamp(40px,7vw,84px) + 80px)}
.gb>.art{padding-top:calc(clamp(30px,6vw,64px) + 80px)}
.gb .crumb{margin-bottom:22px}
.gb .crumb a{display:inline-flex;align-items:center;min-height:36px}

@media (max-width:600px){
  .gh .gh-bar,.gb .gb-bar,.gb.gb-article .gb-bar{
    top:calc(9px + env(safe-area-inset-top));
    width:calc(100% - 20px);
  }
  .gh .gh-bar{
    min-height:56px;
    padding:5px 7px 5px 12px;
    gap:7px;
  }
  .gb .gb-bar{
    min-height:56px;
    padding:5px 7px 5px 12px;
    gap:8px;
  }
  .gh .gh-brand,.gb .gb-brand{gap:8px}
  .gh .gh-brand svg.mk,.gb .gb-brand svg.mk{width:27px;height:34px}
  .gb .gb-brand svg.journal-mark{width:30px;height:37px}
  .gh .gh-brand .wm,.gb .gb-brand .wm{font-size:22px}
  .gb .gb-brand .tag{min-height:26px;margin-left:1px;padding-left:8px;font-size:17px}
  .gh .gh-bar-r,.gb .gb-bar-r{gap:0}
  .gh .quiet,.gh .btn-primary,.gb .home-link,.gb .a11y-trigger{
    min-height:44px;
    padding:0 8px;
    font-size:13px;
  }
  .gh .sec.hero{padding-top:calc(clamp(58px,10vh,84px) + 78px)}
  .gb>.wrap{padding-top:calc(clamp(40px,7vw,84px) + 76px)}
  .gb>.art{padding-top:calc(clamp(30px,6vw,64px) + 76px)}
}
@media (max-width:370px){
  .gh .quiet,.gh .btn-primary{padding-inline:6px;font-size:12.5px}
  .gb .home-link{padding-inline:6px}
  .gb .gb-brand .tag{font-size:16px;padding-left:7px}
}
@media (prefers-reduced-motion:reduce){
  .gh .gh-bar,.gb .gb-bar,.gh .quiet,.gh .btn-primary,.gb .home-link,.gb .a11y-trigger{transition:none}
  .gb .journal-specs,.gb .journal-pen,.gb .gb-brand:hover .journal-specs,.gb .gb-brand:hover .journal-pen,.gb .gb-brand:focus-visible .journal-specs,.gb .gb-brand:focus-visible .journal-pen{animation:none;opacity:1;transform:none}
}