@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600&family=Inter:wght@300;400;500;600&display=swap');

:root{
  --charcoal: #14171c;
  --charcoal-deep: #0d0f13;
  --paper: #f2efe8;
  --bronze: #b98a5e;
  --bronze-light: #d7ad84;
  --teal: #52766f;
  --muted: #9a9c9f;
  --line: rgba(242,239,232,0.12);
  --line-dark: rgba(20,23,28,0.1);
  --max: 1180px;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--paper);
  color:var(--charcoal);
  font-family:'Inter',sans-serif;
  font-weight:400;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:.001ms !important; transition-duration:.001ms !important;}
}

img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
.wrap{max-width:var(--max); margin:0 auto; padding:0 32px;}

h1,h2,h3,h4{
  font-family:'Fraunces',serif; font-weight:500; letter-spacing:-0.01em; color:var(--charcoal);
}

a:focus-visible, button:focus-visible{outline:2px solid var(--bronze); outline-offset:3px;}

.kicker{
  font-size:0.72rem; letter-spacing:0.28em; text-transform:uppercase; color:var(--bronze);
  display:block; margin-bottom:14px; font-weight:600;
}

/* ---------- HEADER ---------- */
header.site{
  position:sticky; top:0; z-index:100;
  background:var(--charcoal-deep);
  border-bottom:1px solid var(--line);
}
header.site nav.wrap{
  display:flex; align-items:center; justify-content:space-between; padding:18px 32px;
}
.logo img{height:38px; width:auto;}
.navlinks{display:flex; align-items:center; gap:6px; list-style:none;}
.navlinks > li{position:relative;}
.navlinks > li > a{
  display:block; padding:10px 16px; font-size:0.78rem; letter-spacing:0.09em;
  text-transform:uppercase; color:var(--paper); opacity:0.82;
  transition:opacity .2s ease, color .2s ease;
}
.navlinks > li > a:hover, .navlinks > li > a.active{opacity:1; color:var(--bronze-light);}
.has-sub > a::after{content:' ▾'; font-size:0.65em; opacity:0.6;}
.submenu{
  list-style:none; position:absolute; top:100%; left:8px; min-width:190px;
  background:var(--charcoal-deep); border:1px solid var(--line);
  opacity:0; visibility:hidden; transform:translateY(6px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
  padding:6px 0;
}
.has-sub:hover .submenu, .has-sub:focus-within .submenu{
  opacity:1; visibility:visible; transform:translateY(0);
}
.submenu a{
  padding:10px 18px; font-size:0.78rem; letter-spacing:0.04em; text-transform:none;
  color:var(--paper); opacity:0.75; display:block;
}
.submenu a:hover{opacity:1; color:var(--bronze-light);}
.navtoggle{
  display:none; background:none; border:0; color:var(--paper); font-size:1.5rem; cursor:pointer;
}
@media (max-width:900px){
  .navtoggle{display:block;}
  .navlinks{
    position:fixed; inset:0 0 0 auto; width:min(82vw,340px); height:100vh;
    background:var(--charcoal-deep); flex-direction:column; align-items:stretch;
    gap:0; padding:90px 8px 40px; transform:translateX(100%);
    transition:transform .35s ease; overflow-y:auto;
    box-shadow:-10px 0 30px rgba(0,0,0,0.35);
  }
  .navlinks.open{transform:translateX(0);}
  .navlinks > li > a{padding:16px 18px; opacity:1;}
  .submenu{
    position:static; opacity:1; visibility:visible; transform:none;
    background:none; border:0; padding-left:14px; display:none;
  }
  .has-sub.open .submenu{display:block;}
}

/* ---------- HERO ---------- */
.hero{
  position:relative; background:var(--charcoal); color:var(--paper);
  padding:110px 0 90px; overflow:hidden;
}
.hero::before{
  content:''; position:absolute; inset:0; opacity:0.5;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse at 70% 30%, black 0%, transparent 70%);
}
.hero .wrap{position:relative; z-index:1; display:grid; grid-template-columns:1.1fr 0.9fr; gap:60px; align-items:center;}
.hero h1{color:var(--paper); font-size:clamp(2.4rem, 5vw, 3.6rem); line-height:1.08;}
.hero h1 .accent{color:var(--bronze-light); display:block;}
.hero p.lead{margin-top:22px; color:var(--muted); font-size:1.08rem; max-width:480px; font-weight:300;}
.hero-figure{
  border:1px solid var(--line); background:var(--charcoal-deep); padding:18px;
}
@media (max-width:860px){
  .hero .wrap{grid-template-columns:1fr;}
}

.page-hero{
  background:var(--charcoal); color:var(--paper); padding:74px 0 54px; text-align:left;
}
.page-hero h1{color:var(--paper); font-size:clamp(2rem,4.4vw,2.9rem);}

/* ---------- SECTIONS ---------- */
section{padding:96px 0;}
section.alt{background:var(--charcoal-deep); color:var(--paper);}
section.alt h2, section.alt h3{color:var(--paper);}
section.alt p{color:var(--muted);}
.section-head{max-width:660px; margin-bottom:48px;}
.section-head h2{font-size:clamp(1.8rem,3.6vw,2.5rem);}

.prose{max-width:760px;}
.prose p{margin-bottom:20px; color:#4a4d52; font-size:1.02rem;}
.prose p:last-child{margin-bottom:0;}
section.alt .prose p{color:var(--muted);}

/* ---------- STAT STRIP ---------- */
.stat-strip{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  border-top:1px solid var(--line-dark); border-bottom:1px solid var(--line-dark);
}
.stat-strip div{padding:34px 28px; border-left:1px solid var(--line-dark);}
.stat-strip div:first-child{border-left:0;}
.stat-num{font-family:'Fraunces',serif; font-size:2rem; color:var(--bronze); display:block; margin-bottom:6px;}
.stat-label{font-size:0.8rem; letter-spacing:0.06em; color:#6a6d72;}

/* ---------- APPROACH / CARDS ---------- */
.pillars{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-dark); border:1px solid var(--line-dark); margin-top:8px;}
.pillar{background:var(--paper); padding:36px 30px;}
.pillar .pill-num{font-family:'Fraunces',serif; color:var(--bronze); font-size:1.1rem; display:block; margin-bottom:14px;}
.pillar h3{font-size:1.15rem; margin-bottom:12px;}
.pillar p{color:#5a5d61; font-size:0.95rem;}
@media (max-width:820px){.pillars{grid-template-columns:1fr;}}

.figure-block{margin-top:56px;}
.figure-block img{border:1px solid var(--line-dark);}
.figure-caption{font-size:0.82rem; color:#7a7d81; margin-top:12px; letter-spacing:0.02em;}
.figure-block a.zoom{font-size:0.78rem; color:var(--bronze); letter-spacing:0.05em; text-transform:uppercase; display:inline-block; margin-top:10px; border-bottom:1px solid var(--bronze);}

/* ---------- FUND TABLE ---------- */
.fund-table{width:100%; border-collapse:collapse; margin-top:8px;}
.fund-table tr{border-bottom:1px solid var(--line-dark);}
.fund-table tr:first-child{border-top:1px solid var(--line-dark);}
.fund-table th, .fund-table td{
  text-align:left; padding:20px 18px; font-size:0.98rem; vertical-align:middle;
}
.fund-table th{
  width:38%; color:#7a7d81; font-weight:500; letter-spacing:0.04em; text-transform:uppercase; font-size:0.76rem;
}
.fund-table td img{display:inline-block; height:16px; margin-left:8px; vertical-align:middle;}

/* ---------- TEAM ---------- */
.team-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:40px;}
.team-card{border:1px solid var(--line-dark);}
.team-card img{aspect-ratio:7/4; object-fit:cover; width:100%;}
.team-card-body{padding:28px 26px;}
.team-card-body h3{font-size:1.2rem; margin-bottom:2px;}
.team-role{color:var(--bronze); font-size:0.78rem; letter-spacing:0.1em; text-transform:uppercase; display:block; margin-bottom:14px;}
.team-card-body p{color:#5a5d61; font-size:0.95rem;}
@media (max-width:760px){.team-grid{grid-template-columns:1fr;}}

/* ---------- PORTFOLIO ---------- */
.portfolio-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:34px;}
.portfolio-card{border:1px solid var(--line-dark); background:#fff;}
.portfolio-card img{aspect-ratio:4/3; object-fit:cover; width:100%;}
.portfolio-card-body{padding:24px 22px;}
.portfolio-card-body h3{font-size:1.1rem; margin-bottom:10px;}
.portfolio-card-body p{color:#5a5d61; font-size:0.92rem;}
@media (max-width:900px){.portfolio-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:620px){.portfolio-grid{grid-template-columns:1fr;}}

/* ---------- CONTACT ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:60px;}
.contact-block h3{font-size:1rem; margin-bottom:14px; letter-spacing:0.04em; text-transform:uppercase; font-weight:600;}
.contact-block p{color:#5a5d61; margin-bottom:6px;}
.contact-block a.email{color:var(--bronze); border-bottom:1px solid var(--bronze);}
@media (max-width:760px){.contact-grid{grid-template-columns:1fr;}}

/* ---------- MISSION BANNER (repeated on every page, above footer) ---------- */
.mission{
  background:var(--charcoal); color:var(--paper); padding:70px 0; text-align:center;
}
.mission img{height:52px; margin:0 auto 22px;}
.mission h2{color:var(--paper); font-size:1.5rem; margin-bottom:14px;}
.mission p{color:var(--muted); max-width:560px; margin:0 auto; font-weight:300;}

/* ---------- FOOTER ---------- */
footer.site{background:var(--charcoal-deep); color:var(--muted); padding:56px 0 30px;}
footer.site .footer-grid{display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:40px; margin-bottom:40px;}
footer.site h4{color:var(--paper); font-size:0.85rem; letter-spacing:0.08em; text-transform:uppercase; margin-bottom:16px; font-family:'Inter',sans-serif; font-weight:600;}
footer.site p{font-size:0.9rem; margin-bottom:4px;}
footer.site ul{list-style:none;}
footer.site ul li a{font-size:0.9rem; color:var(--muted); display:inline-block; padding:4px 0; transition:color .2s ease;}
footer.site ul li a:hover{color:var(--bronze-light);}
.footer-bottom{border-top:1px solid var(--line); padding-top:22px; font-size:0.78rem; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}
@media (max-width:760px){footer.site .footer-grid{grid-template-columns:1fr;}}

.btn{
  display:inline-block; padding:13px 28px; background:var(--bronze); color:var(--charcoal-deep);
  font-size:0.8rem; letter-spacing:0.08em; text-transform:uppercase; font-weight:600;
  border:1px solid var(--bronze); transition:background .2s ease, color .2s ease;
}
.btn:hover{background:transparent; color:var(--bronze-light);}
