:root{
  --green:#1F5B47; --green-deep:#173F32; --brand-accent:#C9A24A;
  --ivory:#F2EFE6; --stone:#E6E2D5; --charcoal:#2B2B28;
  --ink:#1A1A18; --muted:#3F3F39; --quiet:#6B6B62;
  --pad:48px; --nav-h:88px;
  --font-display:'Prata',Georgia,serif; --font-body:'Lato',system-ui,sans-serif;
  --ease:cubic-bezier(.2,.6,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
a,a:hover,a:focus,a:visited{text-decoration:none}
a{color:inherit}
button{font-family:inherit}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-body);line-height:1.65;color:var(--ink);background:var(--ivory);
  -webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,h4{margin:0;font-family:var(--font-display);font-weight:400;line-height:1.15;letter-spacing:.01em}
p{margin:0}
.wrap{max-width:1280px;margin:0 auto;padding:0 var(--pad)}
section{padding:100px 0}

.eyebrow{font-size:11px;letter-spacing:.22em;text-transform:uppercase;font-weight:700;
  color:var(--eyb-c,#7A6224);margin:0}
.on-green{background:var(--green);color:var(--ivory);
  --ghost:var(--ivory);--ghost-hb:var(--ivory);--ghost-hf:var(--green-deep);--eyb-c:var(--brand-accent)}
.on-deep{background:var(--green-deep);color:var(--ivory);
  --ghost:var(--ivory);--ghost-hb:var(--ivory);--ghost-hf:var(--green-deep);--eyb-c:var(--brand-accent)}
.on-ivory{background:var(--ivory)}
.on-stone{background:var(--stone)}

.btns{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}
.btn{display:inline-block;font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;
  padding:16px 30px;border:1px solid currentColor;min-height:44px;
  transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease)}
.btn-solid{background:var(--brand-accent);border-color:var(--brand-accent);color:var(--green-deep)}
.btn-solid:hover{background:transparent;color:var(--brand-accent)}
.btn-ghost{color:var(--ghost,var(--green))}
.btn-ghost:hover{background:var(--ghost-hb,var(--green));color:var(--ghost-hf,var(--ivory));
  border-color:var(--ghost-hb,var(--green))}

.ph{position:relative;background:repeating-linear-gradient(45deg,rgba(31,91,71,.10) 0 14px,rgba(31,91,71,.03) 14px 28px);
  display:flex;align-items:center;justify-content:center;text-align:center;padding:16px}
.ph span{font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:#7A6224;
  line-height:1.7;background:rgba(242,239,230,.86);border:1px dashed rgba(201,162,74,.75);padding:10px 13px}
img.ph{display:block;width:100%;height:100%;object-fit:cover;padding:0;background:none;border:0}
.ph.dark{background:repeating-linear-gradient(45deg,#20463a 0 14px,#1c4034 14px 28px)}
.ph.dark span{color:var(--brand-accent);background:rgba(23,63,50,.8)}
.needed{background:rgba(201,162,74,.22);border-bottom:1px dashed var(--brand-accent);padding:0 4px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.js .reveal{opacity:0;transform:translateY(18px)}
.js .reveal.is-visible{opacity:1;transform:none;transition:opacity .7s var(--ease),transform .7s var(--ease)}

/* ══ HERO ══ */
.lhero{position:relative;background:var(--green-deep);overflow:hidden;
  padding:calc(var(--nav-h) + 92px) 0 92px;
  --ghost:var(--ivory);--ghost-hb:var(--ivory);--ghost-hf:var(--green-deep);--eyb-c:var(--brand-accent)}
.lhero-media{position:absolute;top:0;right:0;bottom:0;width:42%}
.lhero-media .ph{position:absolute;inset:0}
.lhero-media::after{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;
  background:var(--brand-accent);opacity:.85}
.lhero-copy{position:relative;z-index:2;max-width:1280px;margin:0 auto;padding:0 var(--pad)}
.lhero-copy > div{width:52%}
.lhero h1{font-size:clamp(32px,4vw,52px);color:var(--ivory);max-width:15ch;margin-top:16px}
.lhero .dek{font-size:17px;color:rgba(242,239,230,.84);max-width:46ch;margin-top:18px}

/* ══ LEADERSHIP GRID ══ */
.team-head{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:end}
.team h2{font-size:clamp(25px,2.8vw,38px);max-width:18ch;margin-top:16px}
.team .lede{font-size:17px;color:var(--muted);max-width:56ch}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:52px}
/* Static cards. The lift and the media zoom were removed with the links, so
   nothing signals a click that no longer happens. */
.pcard{background:#fff;border:1px solid rgba(31,91,71,.18);display:block}
.pcard-media{position:relative;aspect-ratio:4/5;overflow:hidden}
.pcard-media .ph{position:absolute;inset:0}
.pcard-body{padding:24px 26px 26px}
.pcard h3{font-size:22px;color:var(--green)}
.pcard .role{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;
  color:var(--quiet);margin-top:8px}
/* Renamed from .co, which collided with the bordered white company card in
   homepage.css. That sheet loads on every page, so the box landed here. */
.pcard .entity{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  color:#7A6224;margin-top:5px;background:none;border:0;padding:0;box-shadow:none}

/* ══ PRESIDENTS ══ */
.pres{overflow-x:clip}
.pres h2{font-size:clamp(25px,2.8vw,38px);color:var(--ivory);max-width:20ch;margin-top:16px}
.pres .lede{font-size:17px;color:rgba(242,239,230,.84);max-width:62ch;margin-top:18px}
.plist{margin-top:64px;border-top:1px solid rgba(242,239,230,.26)}
.prow{position:relative;display:grid;grid-template-columns:.36fr 1fr;gap:60px;padding:52px 0;
  align-items:start;border-bottom:1px solid rgba(242,239,230,.26)}
/* Tint runs the full viewport width, not just the content column. */
.prow::before{content:"";position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);
  width:100vw;background:rgba(242,239,230,.05);opacity:0;pointer-events:none;
  transition:opacity .4s var(--ease)}
.prow:hover::before{opacity:1}
.prow > *{position:relative;z-index:1}
.pportrait{position:relative;aspect-ratio:4/5}
.pportrait .ph{position:absolute;inset:0;border:1px solid rgba(201,162,74,.4)}
.pgen{font-size:10px;letter-spacing:.22em;text-transform:uppercase;font-weight:700;
  color:var(--brand-accent);display:block}
.prow h3{font-size:clamp(24px,2.5vw,32px);color:var(--ivory);margin-top:12px}
.prow p{font-size:16px;color:rgba(242,239,230,.86);margin-top:20px;max-width:58ch}
.prow p + p{margin-top:14px}
/* Renamed from .now, which collided with a stone-filled section class of the
   same name in homepage.css. That stylesheet loads on every page, so the
   opaque stone background landed under ivory text. The reset is a failsafe. */
.prow.is-current{background:transparent;color:inherit}
.prow.is-current::before{background:rgba(201,162,74,.09);opacity:1}
.prow.is-current:hover::before{background:rgba(201,162,74,.15)}

/* ══ THE COMPANY ══ */
/* The card is one white surface carrying a uniform 28px inset, so the
   photograph is held off every card edge by the same amount as the copy.
   Body padding of 24px sits on top of that inset, which keeps the text's
   total distance from the right edge at the 52px it has always had.
   With the inset the media column runs about 619px wide, so its 7:5 height
   lands near 421px and exceeds the copy height, which means the image sets
   the row and no gap can open beneath it. */
.pointer-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:0;background:#fff;
  border:1px solid rgba(31,91,71,.2);padding:28px}
.pointer-media{position:relative;aspect-ratio:1400/1000;overflow:hidden;align-self:center}
.pointer-media .ph{position:absolute;inset:0}
.pointer-body{padding:20px 24px;display:flex;flex-direction:column;justify-content:center}
.pointer-body h2{font-size:clamp(24px,2.6vw,34px);max-width:18ch;margin-top:14px}
.pointer-body p{font-size:17px;color:var(--muted);max-width:46ch;margin-top:18px}

/* ══ CLOSE ══ */
.lclose{position:relative;overflow:hidden;background:var(--green-deep);
  --ghost:var(--ivory);--ghost-hb:var(--ivory);--ghost-hf:var(--green-deep);--eyb-c:var(--brand-accent)}
.lclose .ph{height:auto;aspect-ratio:1920/500;min-height:380px}
.lclose::after{content:"";position:absolute;inset:0;z-index:2;
  background:linear-gradient(180deg,rgba(23,63,50,.74) 0%,rgba(23,63,50,.88) 100%)}
.lclose-over{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;
  justify-content:center;text-align:center;padding:0 var(--pad)}
.lclose-over h2{font-size:clamp(26px,3.2vw,42px);color:var(--ivory);max-width:20ch;margin-top:16px}
.lclose-over .btns{justify-content:center}

/* ── FOOTER ── */
.jmi-footer{background:var(--green-deep);color:rgba(242,239,230,.72);padding:80px 0 40px;font-size:14px}
.f-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px}
.f-brand img{width:150px}
.f-nap{font-style:normal;margin-top:22px;line-height:1.9}
.f-nap a{color:var(--brand-accent)}
.f-col h4{font-family:var(--font-body);font-weight:700;font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--brand-accent);margin-bottom:16px}
.f-col a{display:block;padding:7px 0;color:rgba(242,239,230,.72);
  transition:color .3s var(--ease),transform .3s var(--ease)}
.f-col a:hover{color:var(--brand-accent);transform:translateX(4px)}
.f-bottom{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-top:56px;
  padding-top:26px;border-top:1px solid rgba(242,239,230,.18);font-size:13px}
.f-legal a{color:rgba(242,239,230,.72);margin-right:18px}

@media(max-width:1024px){
  :root{--pad:24px}
  section{padding:72px 0}
  .lhero{padding:0}
  .lhero-media{position:static;width:100%;height:300px}
  .lhero-media::after{left:0;right:0;top:auto;bottom:0;width:auto;height:1px}
  .lhero-copy{padding:52px var(--pad) 60px}
  .lhero-copy > div{width:100%}
  .team-head{grid-template-columns:1fr;gap:26px;align-items:start}
  .pgrid{grid-template-columns:1fr 1fr}
  .prow{grid-template-columns:.42fr 1fr;gap:30px;padding:38px 0}
  .pointer-grid{grid-template-columns:1fr;padding:20px}
  .pointer-media{aspect-ratio:1400/1000}
  .pointer-body{padding:28px 8px 8px}
  .f-grid{grid-template-columns:1fr 1fr;gap:36px}
}
@media(max-width:600px){
  .pgrid{grid-template-columns:1fr}
  .prow{grid-template-columns:1fr;gap:24px}
  .pportrait{max-width:280px}
  .f-grid{grid-template-columns:1fr}
  .btns{flex-direction:column;align-items:stretch}
  .btn{text-align:center}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none !important;animation:none !important}
  .js .reveal{opacity:1;transform:none}
}