/* ==========================================================================
   JMI GROUP — NAVIGATION
   Loaded on every page. Page stylesheets carry no nav rules.
   ========================================================================== */

.skip-link{position:absolute;left:-9999px;top:0;z-index:1200;background:var(--brand-accent);
  color:var(--green-deep);padding:14px 22px;font-weight:700}
.skip-link:focus{left:12px;top:12px}

/* The bar is solid from the first paint. It used to be transparent until the
   page scrolled eighty pixels, which left ivory links on an ivory page with
   nothing behind them, so on any light page the navigation read as missing.
   The scrolled state now adds the gold hairline and nothing else. */
.nav{position:fixed;top:0;left:0;right:0;z-index:900;background:var(--green-deep);
  transition:box-shadow .4s var(--ease)}
.nav.is-stuck{box-shadow:0 1px 0 rgba(201,162,74,.28)}
.admin-bar .nav{top:32px}

.nav-inner{max-width:1280px;margin:0 auto;padding:0 var(--pad);height:var(--nav-h);
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px}
.nav-logo{display:block}
.nav-logo img{width:132px;height:auto}

/* ── Top level ── */
.nav-menu > ul{display:flex;justify-content:center;gap:4px;list-style:none;margin:0;padding:0}
.nav-item{position:static}
.nav-menu .nav-top,.nav-menu .nav-top:visited{position:relative;display:inline-flex;
  align-items:center;gap:7px;padding:12px 14px;color:rgba(242,239,230,.9);font-size:12px;
  letter-spacing:.14em;text-transform:uppercase;font-weight:700;transition:color .3s var(--ease)}
.nav-top .caret{width:9px;height:6px;stroke:currentColor;fill:none;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;transition:transform .35s var(--ease),stroke .3s var(--ease)}
/* The signature gold hairline, drawn under the active or open item */
.nav-top::after{content:"";position:absolute;left:14px;right:14px;bottom:4px;height:1px;
  background:var(--brand-accent);transform:scaleX(0);transform-origin:left;
  transition:transform .38s var(--ease)}
.nav-menu .nav-top:hover,.nav-menu .nav-top:focus-visible,
.nav-menu .nav-top.is-active{color:var(--brand-accent)}
.nav-top.is-active::after,.nav-item.open .nav-top::after{transform:scaleX(1)}
.nav-menu .nav-item.open .nav-top{color:var(--brand-accent)}
.nav-item.open .caret{transform:rotate(180deg)}

/* ── Panel ── */
.nav-panel{position:absolute;left:0;right:0;top:var(--nav-h);z-index:-1;
  background:var(--green-deep);border-top:1px solid rgba(201,162,74,.55);
  box-shadow:0 26px 50px rgba(10,26,20,.4);
  opacity:0;transform:translateY(-10px);pointer-events:none;
  transition:opacity .3s var(--ease),transform .3s var(--ease)}
.admin-bar .nav-panel{top:var(--nav-h)}
.nav-item.open .nav-panel{opacity:1;transform:none;pointer-events:auto}
.panel-inner{max-width:1280px;margin:0 auto;padding:46px var(--pad) 50px;
  display:grid;grid-template-columns:.9fr 1.6fr;gap:70px;align-items:start}

.panel-lede{border-left:2px solid var(--brand-accent);padding-left:26px}
.pl-title{display:inline-flex;align-items:baseline;gap:14px;
  font-family:var(--font-display);font-size:26px;line-height:1.2;color:var(--ivory);
  transition:color .3s var(--ease)}
.pl-title .ar{font-family:var(--font-body);font-size:17px;color:var(--brand-accent);
  opacity:0;transform:translateX(-6px);
  transition:opacity .3s var(--ease),transform .35s var(--ease)}
.pl-title:hover,.pl-title:focus-visible{color:var(--brand-accent)}
.pl-title:hover .ar,.pl-title:focus-visible .ar{opacity:1;transform:none}
.pl-blurb{font-size:15px;color:rgba(242,239,230,.78);margin-top:12px;max-width:34ch}

.panel-links{list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.panel-links li{border-top:1px solid rgba(242,239,230,.2)}
.panel-links li:first-child,.panel-links li:nth-child(2){border-top:0}
.panel-links a{min-height:64px}
.panel-links a{display:block;padding:16px 16px 16px 0;position:relative;
  transition:padding-left .35s var(--ease)}
.panel-links a::before{content:"";position:absolute;left:0;top:50%;width:0;height:1px;
  background:var(--brand-accent);transform:translateY(-50%);transition:width .35s var(--ease)}
.panel-links a:hover,.panel-links a:focus-visible{padding-left:22px}
.panel-links a:hover::before,.panel-links a:focus-visible::before{width:14px}
.panel-links a:visited .cl{color:var(--ivory)}
.panel-links .cl{display:block;font-family:var(--font-display);font-size:19px;color:var(--ivory);
  transition:color .3s var(--ease)}
.panel-links a:hover .cl{color:var(--brand-accent)}
.panel-links .cd{display:block;font-size:13px;color:rgba(242,239,230,.62);margin-top:5px}
.panel-links a[aria-current="page"] .cl{color:var(--brand-accent)}

/* ── Contact ── */
.nav-cta,.nav-cta:visited{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;
  color:var(--green-deep);background:var(--brand-accent);padding:14px 22px;
  border:1px solid var(--brand-accent);min-height:44px;
  transition:background .35s var(--ease),color .35s var(--ease)}
.nav-cta:hover{background:transparent;color:var(--brand-accent)}

/* ── Toggle ── */
.nav-toggle{display:none;width:46px;height:46px;background:none;border:0;cursor:pointer;
  flex-direction:column;justify-content:center;gap:6px;padding:0}
.nav-toggle span{display:block;height:2px;width:26px;background:var(--ivory);
  transition:transform .3s var(--ease),opacity .3s var(--ease)}

/* ── Drawer ── */
.nav-overlay{position:fixed;inset:0;background:rgba(15,32,26,.72);z-index:940;opacity:0;
  transition:opacity .3s var(--ease)}
.drawer-open .nav-overlay{opacity:1}
.nav-drawer{position:fixed;top:0;right:0;bottom:0;width:min(400px,88vw);background:var(--green-deep);
  z-index:960;padding:96px 30px 40px;overflow-y:auto;transform:translateX(100%);
  transition:transform .34s var(--ease);border-left:1px solid rgba(201,162,74,.5)}
.drawer-open .nav-drawer{transform:none}
.drawer-close{position:absolute;top:22px;right:22px;width:46px;height:46px;background:none;
  border:1px solid rgba(242,239,230,.4);color:var(--ivory);font-size:18px;cursor:pointer;
  transition:background .3s var(--ease),color .3s var(--ease)}
.drawer-close:hover{background:var(--brand-accent);color:var(--green-deep);border-color:var(--brand-accent)}

.drawer-list{list-style:none;margin:0;padding:0}
.drawer-list > li{border-bottom:1px solid rgba(242,239,230,.16)}
.drawer-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.drawer-row a{flex:1;display:block;padding:19px 0;color:var(--ivory);font-size:13px;
  letter-spacing:.16em;text-transform:uppercase;font-weight:700}
.drawer-row a:hover{color:var(--brand-accent)}
.drawer-more{width:46px;height:46px;background:none;border:0;cursor:pointer;position:relative}
.drawer-more .pm,.drawer-more .pm::before{content:"";position:absolute;background:var(--brand-accent)}
.drawer-more .pm{left:50%;top:50%;width:13px;height:2px;transform:translate(-50%,-50%)}
.drawer-more .pm::before{left:0;top:0;width:13px;height:2px;transform:rotate(90deg);
  transition:transform .3s var(--ease),opacity .3s var(--ease)}
.drawer-more[aria-expanded="true"] .pm::before{transform:rotate(0);opacity:0}

.drawer-sub{list-style:none;margin:0;padding:0 0 16px 16px;border-left:1px solid rgba(201,162,74,.5)}
.drawer-sub a{display:block;padding:12px 0;color:rgba(242,239,230,.8);font-size:14px;
  letter-spacing:.02em;text-transform:none;font-weight:400}
.drawer-sub a:hover{color:var(--brand-accent)}
.drawer-phone{display:inline-block;margin-top:32px;color:var(--brand-accent);
  font-family:var(--font-display);font-size:23px}

@media(max-width:1240px){
  .nav-menu,.nav-cta{display:none}
  .nav-toggle{display:flex}
  .nav-inner{grid-template-columns:auto 1fr}
}
@media(max-width:768px){
  .nav-drawer{padding:88px 24px 36px}
}
@media (prefers-reduced-motion:reduce){
  .nav *,.nav-panel,.nav-drawer,.nav-overlay{transition:none !important}
}
