/* Unified header container to allow a single gradient across both bars */
:root{
  --line: #000000;
  --accent: #4D52FF;
  --bg: #FFFFFF;
  --text: #111;
  --sidebar: 220px;
  --grid-gap: 0;
  --border: 1px;
  --maxw: 100vw;
  --header-h: 94px;
  --nav-font-size: clamp(17px, 1.5vw + 3px, 22px);
  --nav-gap: clamp(8px, 1.3vw, 24px);
  --nav-pad-y: clamp(4px, 0.6vw + 2px, 10px);
  --nav-pad-left: clamp(6px, 0.9vw + 2px, 14px);
  --nav-symbol-size: 1.2em;
  --font: Manrope, 'Helvetica Neue', Helvetica, Arial, sans-serif, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans';
  --headline-font: Lora, Georgia, 'Times New Roman', serif;
}
h1,h2,h3,.homepage-headline,.hero-message,.subhero-message-big,.section-title{
  font-family:var(--headline-font);
}
*{box-sizing:border-box}
html{
  height:100%;
  font-size: 1rem;
}
/* Fluid typography like LangChain */
@media screen and (max-width:1920px) and (min-width:1281px) {
  html { font-size: calc(0.25rem + 0.625vw); }
}
@media screen and (max-width:1280px) and (min-width:992px) {
  html { font-size: calc(0.412rem + 0.422vw); }
}
body{
  height:100%;
  margin:0;
  color:var(--text);
  background:var(--bg);
  font-family:var(--font);
  line-height:1.4;
  font-weight:400;
  letter-spacing:-0.03em;
  min-height: 100vh;
  padding-bottom: 30px; /* extra space at very bottom on all pages */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.homepage-left .site-header{
  position:relative;
  z-index:2;
}
/* Homepage has darker gradient background across entire header */
body.home{
  background: linear-gradient(135deg, #5a68d8 0%, #7a88e8 100%);
}
/* Right column gradient background on all pages */
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.wrapper{
  display:grid;
  grid-template-columns: 1fr;
  min-height:auto;
  max-width:var(--maxw);
  width:100vw;
  margin:0 auto;
  border-left:0;
  border-right:0;
  position:relative;
  z-index: 1;
}
/* faint grid overlay with diagonals like CASPR */
aside{
  border-right:var(--border) solid var(--line);
  display:flex;
  flex-direction:column;
}
.brand{
  border-bottom:var(--border) solid var(--line);
  padding:6px 6px 6px 4px; /* shorter */
  height: var(--header-h);
  box-sizing: border-box;
  font-size:18px; /* shrink font more */
  letter-spacing:.02em;
  font-weight:700;
  color:#000;
}
.brand:hover{ background: transparent; color:#000 }
.brand:hover a{ color:#000 }
.brand .brand-logo{height:calc((96px - 24px) * 0.55);width:auto;display:block;filter:brightness(0);margin-left:10px}
.brand:hover .brand-logo{ filter: brightness(0) }
.nav{
  display:flex;
  flex-direction:column;
}
.nav a{
  padding:18px 16px;
  border-bottom:var(--border) solid var(--line);
  display:block;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:16px;
  font-weight:300;
  color:#000;
}
.nav a:hover,
.nav a:focus{
  background: #fff;
  color: #000;
  text-decoration: none;
}
.nav a:active{ text-decoration: none }
.nav a.active{
  background: transparent;
  color: #000;
  font-weight: 300;
}
main{
  display:grid;
  grid-template-rows: auto auto auto;
  min-height:auto;
}
.page.home{
  background: #fff;
}
.topbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:clamp(8px, 1.6vw, 20px);
  border-bottom:0;
  padding:18px 24px 18px 28px;
  font-size:14px;
  color:#000;
  height: var(--header-h);
  box-sizing: border-box;
  position: relative;
  z-index: 50;
}
.topbar > [data-partial="nav"]{
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  justify-content: flex-end;
}
/* Remove border on homepage topbar since we have the full-width line */
.homepage-left .topbar{
  border-bottom:0;
}
.topbar .top-nav a{ color:#000; text-decoration: none; }
body.home .topbar .top-nav a{ color:#fff; text-decoration: none; }
.topbar .breadcrumb a{ color:#000 }
body.home .topbar .breadcrumb a{ color:#fff }
.topbar:hover{ background: transparent }
/* Remove underline on hover in header bars */
.topbar a:hover,
.hero-topbar a:hover{ text-decoration: none }
.hero-topbar{
  border-bottom: var(--border) solid var(--line);
  display:none;
  align-items:center;
  padding: 0 40px;
  height: var(--header-h);
  box-sizing: border-box;
  background: transparent;
}
.hero-topbar .hero-message{ text-align:left; margin:0; font-size:24px; line-height:1.05; font-weight:200; color:#000 }
.hero-topbar:hover{ background: transparent }
.hero-topbar:hover .hero-message{ color: #000 }
.breadcrumb a{color:var(--accent)}
.top-nav{display:flex;gap:var(--nav-gap);align-items:center;flex-wrap:nowrap;padding-top:0;margin-left:auto}
.top-nav a{
  padding:var(--nav-pad-y) 2px var(--nav-pad-y) var(--nav-pad-left);
  text-transform:none;
  letter-spacing:0;
  font-size:var(--nav-font-size);
  font-weight:400;
  color:#000;
  border-radius:6px;
  transition:background-color 0.2s, font-size 0.15s;
  line-height:1.4;
  white-space:nowrap;
}
.top-nav a:hover{
  background:transparent;
  text-decoration:none;
  -webkit-text-stroke:0.4px currentColor;
}
.nav-symbol{
  margin-right:4px;
  font-size:var(--nav-symbol-size);
  position:relative;
  display:inline-block;
  width:0.48em;
  height:0.48em;
  vertical-align:0.08em;
  border:1.5px solid #000;
  transition:transform 0.3s ease;
}
.nav-symbol::after{
  content:"";
  position:absolute;
  inset:0;
  background:#000;
  transform:scaleX(0);
  transform-origin:right;
  transition:transform 0.3s ease;
}
body.home .nav-symbol{
  border-color:#fff;
}
body.home .nav-symbol::after{
  background:#fff;
}
.top-nav a:hover .nav-symbol,
.top-nav a.active .nav-symbol{
  transform:rotate(90deg);
}
.top-nav a:hover .nav-symbol::after,
.top-nav a.active .nav-symbol::after{
  transform:scaleX(1);
}
.top-nav a.active{
  -webkit-text-stroke:0.4px currentColor;
}
.top-nav .nav-search-toggle{
  appearance:none;
  border:0;
  background:transparent;
  color:#000;
  padding:var(--nav-pad-y) 10px;
  margin-left:2px;
  border-radius:10px;
  cursor:pointer;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
.top-nav .nav-search-toggle:hover{
  background:transparent;
  -webkit-text-stroke:0.4px currentColor;
}
.top-nav .nav-search-toggle:focus-visible{
  outline:2px solid currentColor;
  outline-offset:2px;
}
.search-icon-svg{
  width:18px;
  height:18px;
  stroke:currentColor;
  fill:none;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  display:block;
}
.top-nav .nav-search-toggle .nav-search-label{
  font-size:var(--nav-font-size);
  font-weight:400;
  line-height:1;
}
body.home .topbar .nav-search-toggle,
body.policy-page .topbar .nav-search-toggle,
body.research-page .topbar .nav-search-toggle,
body.team-page .topbar .nav-search-toggle,
body.approach-page .topbar .nav-search-toggle,
body.publication-page .topbar .nav-search-toggle,
body.stories-page .topbar .nav-search-toggle{
  color:#fff;
}
.brand-header{
  display:flex;
  align-items:center;
  flex-shrink:0;
}
.brand-logo-header{
  height:36px;
  width:auto;
  filter:none; /* show logo as-is */
  transform:translateY(4px);
  margin-left:15px;
}
body.home .brand-logo-header{
  filter:brightness(0) invert(1); /* white logo on dark background */
}
/* Button container in top nav */
.top-nav > div{
  display:flex;
  align-items:center;
  gap:8px;
}
/* Homepage specific two-column layout */
.homepage-header{
  display:block;
  min-height:calc(80vh - 80px);
  position:relative;
  overflow:hidden; /* prevent animation from overflowing into next section */
}
.homepage-left{
  width:100%;
  background:transparent;
  display:flex;
  flex-direction:column;
  position:relative;
  z-index:1;
}
.homepage-left .header-content{
  padding:0px 220px 80px 40px;
  max-width:1050px;
  flex-grow:1;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}
.homepage-left .header-content .page{ padding:0; margin:0 }
.homepage-right{
  position:absolute;
  top:0;
  right:calc(-15% + 80px);
  width:calc(40% + 90px);
  height:100%;
  z-index:0;
  pointer-events:none;
  overflow:hidden; /* clip animation canvas at the bottom */
  background: transparent;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,1) 40%);
  mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,1) 40%);
}
/* Cap animation area on interior pages so it only covers the upper-right hero region */
body:not(.home) .homepage-right{
  height: min(calc(100vh), 1000px);
}
body:not(.home) .animation-area{
  min-height: 0;
}
/* Subtle gradient variants for interior pages */
.bg-gradient-1{ background: linear-gradient(135deg, #b3caff 0%, #d6e4ff 100%) !important }
.bg-gradient-2{ background: linear-gradient(135deg, #b8a5ff 0%, #d8ccff 100%) !important }
.bg-gradient-3{ background: linear-gradient(135deg, #9aa7ff 0%, #c0ccff 100%) !important }
.bg-gradient-4{ background: linear-gradient(135deg, #a6b4ff 0%, #ccd6ff 100%) !important }
.animation-area{
  width:100%;
  height:100%;
  min-height:calc(80vh - 80px); /* Reserve space before animation loads to prevent layout shift */
  position:relative;
  overflow:hidden; /* ensure Vanta canvas is clipped within header area */
  background: transparent; /* Default background */
}
/* Keep canvas on a composited layer to reduce tab-switch flicker. */
.animation-area,
#subhero-section,
#subhero-section canvas{
  transform: translateZ(0);
  backface-visibility: hidden;
}
.animation-area canvas { opacity: 1; }
.animation-area.animation-ready canvas { opacity: 1; transition: none; }
/* Pre-set animation backgrounds to prevent layout shift */
body.home .animation-area{
  /* EXPERIMENTAL FIX: Using fixed gradient to match body gradient seamlessly.
     TO REVERT: Replace with: background: #5a68d8;
     and remove background-attachment line */
  background: linear-gradient(135deg, #5a68d8 0%, #7a88e8 100%);
  background-attachment: fixed;
}
/* Extend border line across full width on homepage - aligned with nav bottom */
.homepage-header::after{
  content:"";
  position:absolute;
  top:var(--header-h); /* Height of the topbar to align with nav bottom */
  left:0;
  right:0;
  height:1px;
  background:rgba(255,255,255,0.2);
  z-index:10;
}
.top-nav a.active{background:transparent}
.intro{padding:15px 0 60px; position:relative; z-index:1}
.page.home .intro{ padding:0px 40px 50px 40px; border-bottom:0 }
.homepage-left .intro{ padding:0px 220px 50px 40px; max-width:1050px; border-bottom:0; flex-grow:1; display:flex; flex-direction:column; justify-content:flex-start }
body.home .homepage-left .intro{ justify-content:center }
/* Ensure interior pages placed inside the header left column align with home intro padding */
.homepage-left .intro .page{ padding:0; margin:0 }
.intro .hero-message{
  font-size:42px;
  font-weight:400;
  line-height:1.12;
  margin:20px 0 40px 0;
  text-align:center;
}
.intro .subhero-message{
  font-size:32px;
  font-weight:400;
  line-height:1.12;
  margin:10px 0 0px 0;
  padding:12px 0;
}
body.home .intro .subhero-message{
  color:#fff;
  font-weight:400;
  font-size:1.75rem;
  line-height:1.3;
  opacity:0.8;
  padding:8px 0;
  margin:7px 0 0 0;
}
body.home .intro .subhero-message a{
  color: #fff;
  font-weight: 400;
  text-decoration: underline;
}
.intro .subhero-message a{
  color: #000;
  font-weight: 400;
  text-decoration: underline;
}
 .intro p.subhero-message-big{
   font-size:55px;
   font-weight:100;
   line-height:1.12;
   margin:0px 0 16px 0;
   padding:0px 0 10px 0;
   color:#000;
   display:block;
 }
 /* Homepage headline - dedicated class for white text */
 .homepage-headline{
   color:#ffffff !important;
   font-weight:400;
   font-size:2.1rem;
   line-height:1;
   letter-spacing:-.12rem;
   margin-top:22px;
   margin-bottom:0;
   padding-bottom:2px;
   font-family: var(--headline-font);
 }
 .intro p.subhero-message-big{
   margin-top:30px;
 }
 .intro p.homepage-headline{
   margin-bottom:4px;
   padding-bottom:2px;
 }
.intro .subhero-message strong{
  font-weight: 350;
}
#subhero-section{
  position: relative;
}

#subhero-section canvas{
  width: 120% !important;
  height: 120% !important;
  left: 0 !important;
  top: 0 !important;
  background: transparent !important;
  opacity: 1;
  transform: scale(1.2) translate(0, calc(-1 * var(--header-h)));
  transform-origin: left top;
}
/* Hide default header on homepage since we have custom layout */
body.home main > [data-partial="header"]{
  display: none;
}
.page{
  display:grid;
  grid-template-columns: 1fr;
  padding:28px 220px 0 40px;
  position:relative;
  z-index:1;
}
.page{will-change: contents}
/* Avoid jumps during SPA transitions */
body.nav-loading main .page{ opacity: .96 }
/* Reserve header height to reduce CLS before partial mounts */
main > [data-partial="header"]{ min-height: var(--header-h) }
.animation-area{
  min-height: inherit;
}
/* Smooth page transitions */
main .page{
  transition: opacity 0.15s ease-in-out;
}
body.nav-loading main .page{
  opacity: 0;
}
.page:not(.home){
  font-size:21px;
  max-width:950px;
}
/* Ensure team page inherits the site-wide font explicitly */
.page.team{ font-family: var(--font); }
.page.home{ padding:0 }
@media (min-width: 721px){
  /* Align top of main content with top of first sidebar nav item (HOME) */
  .page.home{ padding-top: 0 }
}
@media (max-width: 920px) and (min-width: 721px){
  /* Adjust for smaller brand logo/padding at this breakpoint */
  .page.home{ padding-top: 0 }
}
/* News grid uses gap-as-border technique: container bg = border color, gap = border width */
.page.home .grid-2{
  gap: var(--border);
  background: #5a68d8;
  border: var(--border) solid #5a68d8;
}
.page.home .box{
  margin:0;
  border:0;
  background: #fff;
}
/* Adjust padding for two-column layout */
.page.home h1{ padding-left:40px; padding-top:0; position:relative }
/* Line above section title removed */
/* Remove default top margin so the line sits flush with the header below the animation */
.page.home h1.section-title{ margin-top:0 }

/* Hover effect for homepage boxes */
.page.home .box:hover{
  background: #fff;
}
.page.home .box:hover a{ color:inherit; text-decoration:none }
.page.home .box:hover .eyebrow{ color:inherit; opacity:1 }
h1{
  font-size:36px;
  margin:4px 0 22px 0;
  letter-spacing:.01em;
  font-weight:600;
}
.page:not(.home) h1{ font-weight:300; line-height:1.1; padding-top: 40px;}
.page.home h1.section-title{
  font-size:22px;
  font-weight:300; 
  padding-bottom:0px;
  padding-top: 12px;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  min-height: 40px;
}
.page.home h1{
  font-size:56px;
  font-weight:300;
}
h2{
  font-size:22px;
  margin:26px 0 8px;
  font-weight:600;
}
h3{font-size:18px;margin:20px 0 6px}
.page:not(.home) h3{font-size:24px;margin:28px 0 10px}
p{margin:10px 0}
ul{list-style:square;margin:8px 0 16px 18px}
hr{border:0;border-top:var(--border) solid var(--line);margin:24px 0}
/* Editorial footer (shared across all pages) */
.editorial-footer {
  background: linear-gradient(135deg, #5a68d8 0%, #7a88e8 100%);
  color: rgba(255,255,255,0.7);
  padding: 56px 40px 40px;
  font-size: 14px;
  line-height: 1.7;
  font-family: var(--font);
}
.editorial-footer a {
  color: rgba(255,255,255,0.7);
  text-decoration: none;
}
.editorial-footer a:hover {
  color: #fff;
  text-decoration: none;
}
.editorial-footer .footer-top {
  display: flex;
  justify-content: space-between;
  gap: 40px;
  margin-bottom: 40px;
  padding-bottom: 36px;
  border-bottom: 1px solid rgba(255,255,255,0.15);
}
.editorial-footer h4 {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  margin: 0 0 12px;
}
.editorial-footer p {
  margin: 4px 0;
  color: rgba(255,255,255,0.7);
}
.editorial-footer .footer-bottom {
  font-size: 12px;
  color: rgba(255,255,255,0.35);
}
@media (max-width: 1024px) {
  .editorial-footer { padding: 48px 24px 32px; }
}
@media (max-width: 640px) {
  .editorial-footer { padding: 40px 16px 28px; }
  .editorial-footer .footer-top { flex-direction: column; }
}
/* content boxes */
.box{
  border:var(--border) solid var(--line);
  padding:16px 40px 16px 40px;
  margin:16px 0;
}
.box .eyebrow{
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:6px;
  opacity:.7;
}
.box p{
  line-height:1.3;
}
.page.home .box p{
  font-size:17px;
}
.page.team .box .eyebrow{ display:none }
/* Featured work links on home: semi-bold */
.box h3 a{
  font-size:19px;
  font-weight:600;
  color:inherit;
}
.box h3{
  margin:4px 0 0 0;
  line-height:1.1;
}
.page.home .box h3 + p{ margin-top:4px }
.box img{
  margin-bottom:4px;
}

/* Team page: make boxes flush with single-thickness dividers and tighter padding */
.page.team .grid-2{ 
  gap:0; 
  border-right: var(--border) solid var(--line); 
  border-bottom: var(--border) solid var(--line);
}
.page.team .box{ 
  margin:0; 
  padding:12px 20px; 
  border-left: var(--border) solid var(--line); 
  border-top: var(--border) solid var(--line); 
  border-right:0; 
  border-bottom:0;
}
/* Tighter typography inside team boxes */
.page.team .box{ font-size:15px; line-height:1.25 }
.page.team .box p{ margin:6px 0; line-height:1.25 }
.page.team .box a{ line-height:1.25 }
.page.team .box .eyebrow{ font-size:11px; margin-bottom:4px }
.page.team .box h3{ margin:2px 0 4px 0; font-size:16px }
/* Make the first line (name) in each team/advisor box semi-bold */
.page.team .box .eyebrow + p{ font-weight:600 }
.grid-2{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:18px;
}
.grid-3{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap:18px;
}
/* Use 3 across on wide screens */
@media (min-width: 1200px){
  .page.home .grid-2{
    grid-template-columns: 1fr 1fr 1fr;
  }
}

/* Mobile menu button base styles */
.mobile-menu-btn{
  align-items:center;
  gap:8px;
  background:transparent;
  border:none;
  padding:8px 12px;
  font-size:14px;
  font-weight:500;
  letter-spacing:0.05em;
  color:#000;
  cursor:pointer;
  margin-left:auto;
}
body.home .mobile-menu-btn,
body.team-page .mobile-menu-btn,
body.policy-page .mobile-menu-btn,
body.research-page .mobile-menu-btn,
body.approach-page .mobile-menu-btn,
body.publication-page .mobile-menu-btn{
  color:#fff;
}
.hamburger{
  display:block;
  width:16px;
  height:2px;
  background:currentColor;
  position:relative;
}
.hamburger::before,
.hamburger::after{
  content:"";
  position:absolute;
  left:0;
  width:16px;
  height:2px;
  background:currentColor;
}
.hamburger::before{top:-5px}
.hamburger::after{top:5px}

/* Transform hamburger to X when menu is open */
.nav-open .hamburger{
  background:transparent;
}
.nav-open .hamburger::before{
  top:0;
  transform:rotate(45deg);
}
.nav-open .hamburger::after{
  top:0;
  transform:rotate(-45deg);
}

@media (max-width: 920px){
  :root{ --sidebar: 200px }
  .grid-2{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr}
  .brand{font-size:24px;padding:10px 6px 10px 4px}
  .brand .brand-logo{height:calc(44px * 0.7);filter:brightness(0)}
}

/* desktop: show top nav, hide sidebar and mobile menu button */
@media (min-width: 721px){
  .topbar{display:flex}
  .top-nav{display:flex}
  aside{display:none}
  main{ border-left: 0 }
  .menu-btn{display:none}
  .mobile-menu-btn{display:none}
}

@media (max-width: 1200px) and (min-width: 721px){
  /* Narrow animation at smaller desktop widths */
  .homepage-right{
    width:calc(35% + 90px);
    right:-15%;
  }
}

@media (max-width: 900px) and (min-width: 721px){
  /* Reduce right padding on smaller screens */
  .page.home .intro{ padding-right:20px }
  .topbar{
    padding:14px 16px 14px 20px;
  }
}

@media (max-width: 720px){
  .wrapper{
    grid-template-columns:1fr;
  }
  .topbar{flex-direction:row;align-items:center;padding:12px 16px;height:auto;flex-wrap:wrap;justify-content:space-between;position:relative}
  .brand-header{margin-bottom:0;flex-shrink:0}
  /* Reduce page padding on mobile */
  .page{
    padding: 28px 16px 0;
  }
  .homepage-left .header-content{
    padding: 0px 16px 60px 16px;
  }
  .page.home .intro,
  .homepage-left .intro{
    padding: 0px 16px 60px 16px;
  }
  /* Mobile menu: show button, hide nav by default */
  .mobile-menu-btn{display:flex}
  .top-nav{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    flex-direction:column;
    align-items:stretch;
    background:rgba(58, 68, 160, 0.4);
    -webkit-backdrop-filter:blur(16px) saturate(180%);
    backdrop-filter:blur(16px) saturate(180%);
    border-bottom:1px solid rgba(255,255,255,0.2);
    box-shadow:0 8px 32px rgba(0,0,0,0.2);
    padding:12px 0;
    z-index:100;
  }
  .nav-open .top-nav{display:flex}
  .top-nav a{padding:10px 24px 10px calc(50vw - 80px);font-size:20px;white-space:nowrap;color:#fff;text-align:left;display:block;width:100%}
  .top-nav .nav-search-toggle{display:none}
  .nav-symbol{font-size:20px;width:10px;height:10px;border-color:#fff}
  .top-nav .nav-symbol::after{background:#fff}
  .top-nav .nav-symbol{margin-right:4px}
  .top-nav > div{margin-top:0}
  .font-switcher-btn,.animation-switcher{font-size:11px;padding:4px 8px}
  aside{display:none}
  /* Move horizontal line down on mobile when nav wraps */
  .homepage-header::after{
    top:auto;
    bottom:0;
  }
  /* Mobile homepage layout */
  .homepage-header{
    min-height:auto;
  }
  .homepage-right{
    display:none;
  }
  /* Reduce headline size on mobile */
  .intro p.subhero-message-big{
    font-size:40px;
  }
  /* Make substack embed responsive on mobile */
  .substack-embed-container{
    max-width: 100%;
    overflow: hidden;
    padding: 0 10px;
    box-sizing: border-box;
  }
  .substack-embed{
    max-width: 100% !important;
    width: 100% !important;
    height: 310px !important;
  }
  /* Prevent horizontal scroll on publication page */
  body.publication-page .page{
    overflow-x: hidden;
    max-width: 100vw;
  }
  .homepage-headline{
    font-size:2.25rem;
    letter-spacing:-.1rem;
    margin-top:-10px;
  }
  /* Make "Our mission..." text smaller on mobile */
  .intro .subhero-message{
    font-size:22px;
  }
  body.home .intro .subhero-message{
    font-size:1.25rem;
    font-weight:400;
    opacity:0.8;
    line-height:1.3;
  }
  /* Reduce side padding on mobile intro */
  .homepage-left .intro{
    padding-left:20px;
    padding-right:20px;
  }
  .page.home .intro{
    padding-left:20px;
    padding-right:20px;
  }
}

/* Remove home-page specific footer padding to allow full-width footer */

.small{font-size:13px}
.muted{opacity:.7}

/* Override for specific request: make .small.muted bigger and black */
.small.muted{
  font-size:16px;
  color:#000;
  opacity:1;
}

/* Hidden footer link */
.footer-hidden-link{
  display:none !important;
}

/* ── Design Switcher (font + color palette) ─────────────────── */
#caspr-switcher{
  position:fixed;
  bottom:20px;
  right:20px;
  z-index:9999;
  font-family:Manrope, system-ui, sans-serif;
  font-size:13px;
  font-weight:400;
  letter-spacing:0;
  color:#1d1b17;
}
.sw-toolbar{
  display:flex;
  gap:6px;
  justify-content:flex-end;
}
.sw-btn{
  width:38px;
  height:38px;
  border-radius:10px;
  border:1px solid rgba(0,0,0,0.12);
  background:rgba(255,255,255,0.92);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  font-weight:600;
  color:#333;
  box-shadow:0 2px 10px rgba(0,0,0,0.08);
  transition:all 0.15s ease;
}
.sw-btn:hover{
  background:#fff;
  box-shadow:0 4px 16px rgba(0,0,0,0.12);
  transform:translateY(-1px);
}
.sw-btn.active{
  background:#1d1b17;
  color:#fff;
  border-color:#1d1b17;
}
.sw-color-dots{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2px;
}
.sw-color-dots span{
  width:7px;
  height:7px;
  border-radius:50%;
  display:block;
}
.sw-panel{
  position:absolute;
  bottom:48px;
  right:0;
  width:260px;
  background:rgba(255,255,255,0.96);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border-radius:14px;
  border:1px solid rgba(0,0,0,0.1);
  box-shadow:0 12px 40px rgba(0,0,0,0.15);
  padding:16px;
  max-height:70vh;
  overflow-y:auto;
}
.sw-section{ margin-bottom:4px; }
.sw-label{
  font-size:11px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.08em;
  color:#666;
  margin-bottom:4px;
}
.sw-props{
  font-size:10px;
  color:#999;
  margin-bottom:8px;
  letter-spacing:0.02em;
}
.sw-divider{
  height:1px;
  background:rgba(0,0,0,0.08);
  margin:12px 0;
}
.sw-font-list{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
}
.sw-font-btn{
  padding:5px 10px;
  border-radius:6px;
  border:1px solid rgba(0,0,0,0.1);
  background:#fff;
  cursor:pointer;
  font-size:12px;
  font-weight:500;
  color:#444;
  transition:all 0.12s ease;
  letter-spacing:0;
}
.sw-font-btn:hover{
  border-color:#999;
  background:#f5f5f5;
}
.sw-font-btn.active{
  background:#1d1b17;
  color:#fff;
  border-color:#1d1b17;
}
.sw-font-btn.sw-placeholder{
  color:#aaa;
  font-style:italic;
  font-size:11px;
  cursor:default;
  border-style:dashed;
}
.sw-palette{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.sw-color-item{
  display:flex;
  align-items:center;
  gap:10px;
}
.sw-color-input{
  -webkit-appearance:none;
  appearance:none;
  width:36px;
  height:36px;
  border:2px solid rgba(0,0,0,0.1);
  border-radius:8px;
  cursor:pointer;
  padding:0;
  background:none;
}
.sw-color-input::-webkit-color-swatch-wrapper{ padding:2px; }
.sw-color-input::-webkit-color-swatch{ border:none; border-radius:4px; }
.sw-color-input::-moz-color-swatch{ border:none; border-radius:4px; }
.sw-color-info{
  display:flex;
  flex-direction:column;
  gap:1px;
}
.sw-color-label{
  font-size:12px;
  font-weight:600;
  color:#333;
}
.sw-color-hex{
  font-size:11px;
  font-family:'SF Mono',Menlo,monospace;
  color:#888;
}

/* Newsletter subscribe link */
.newsletter-form{
  display:inline-block;
  width:auto !important;
  max-width:max-content;
  background:rgba(255,255,255,0.15);
  border-radius:50px;
  padding:5px;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:0 4px 24px rgba(0,0,0,0.1), inset 0 0 0 1px rgba(255,255,255,0.2);
}
.subscribe-link{
  display:inline-block;
  padding:14px 28px;
  border-radius:45px;
  font-size:18px;
  font-weight:600;
  font-family:var(--font);
  background:rgba(255,255,255,0.95);
  color:#5a68d8 !important;
  text-decoration:none !important;
  cursor:pointer;
  transition:all 0.25s ease;
  box-shadow:0 2px 8px rgba(0,0,0,0.1);
}
.subscribe-link:hover{
  background:#ffffff;
  transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(0,0,0,0.15);
}

/* Hide font picker on homepage */
body.home #caspr-switcher{ display:none }

/* ── Interior page theme: gradient nav bar + light body ── */
body.policy-page,
body.research-page,
body.team-page,
body.approach-page,
body.publication-page{
  background:#fcfaf7;
  color:#2d2a26;
}
body.policy-page .page,
body.research-page .page,
body.team-page .page,
body.approach-page .page,
body.publication-page .page{
  color:#2d2a26;
}
body.policy-page .page h1,body.policy-page .page h2,body.policy-page .page h3,body.policy-page .page p,
body.research-page .page h1,body.research-page .page h2,body.research-page .page h3,body.research-page .page p,
body.team-page .page h1,body.team-page .page h2,body.team-page .page h3,body.team-page .page p,
body.approach-page .page h1,body.approach-page .page h2,body.approach-page .page h3,body.approach-page .page p,
body.publication-page .page h1,body.publication-page .page h2,body.publication-page .page h3,body.publication-page .page p{
  color:#2d2a26;
}
body.policy-page .page a,
body.research-page .page a,
body.team-page .page a,
body.approach-page .page a,
body.publication-page .page a{
  color:#4D52FF;
  text-decoration:underline;
  text-decoration-color:rgba(77,82,255,0.3);
}
body.policy-page .page a:hover,
body.research-page .page a:hover,
body.team-page .page a:hover,
body.approach-page .page a:hover,
body.publication-page .page a:hover{
  color:#4D52FF;
  text-decoration-color:rgba(77,82,255,0.8);
}
/* Gradient nav bar */
body.policy-page .topbar,
body.research-page .topbar,
body.team-page .topbar,
body.approach-page .topbar,
body.publication-page .topbar{
  background:linear-gradient(135deg,#5a68d8 0%,#7a88e8 100%);
  border-bottom:1px solid rgba(255,255,255,0.2);
}
/* Keep white text/logo on gradient nav */
body.policy-page .topbar .top-nav a,
body.research-page .topbar .top-nav a,
body.team-page .topbar .top-nav a,
body.approach-page .topbar .top-nav a,
body.publication-page .topbar .top-nav a{
  color:#fff;
  text-decoration:none;
}
/* Keep nav links white on hover (they sit on gradient bar) */
body.policy-page .topbar a:hover,
body.research-page .topbar a:hover,
body.team-page .topbar a:hover,
body.approach-page .topbar a:hover,
body.publication-page .topbar a:hover{
  color:#fff;
  text-decoration:none;
}
body.policy-page .brand-logo-header,
body.research-page .brand-logo-header,
body.team-page .brand-logo-header,
body.approach-page .brand-logo-header,
body.publication-page .brand-logo-header{
  filter:brightness(0) invert(1);
}
body.policy-page .nav-symbol,
body.research-page .nav-symbol,
body.team-page .nav-symbol,
body.approach-page .nav-symbol,
body.publication-page .nav-symbol{
  border-color:#fff;
}
body.policy-page .nav-symbol::after,
body.research-page .nav-symbol::after,
body.team-page .nav-symbol::after,
body.approach-page .nav-symbol::after,
body.publication-page .nav-symbol::after{
  background:#fff;
}
body.policy-page .mobile-menu-btn,
body.research-page .mobile-menu-btn,
body.team-page .mobile-menu-btn,
body.approach-page .mobile-menu-btn,
body.publication-page .mobile-menu-btn{
  color:#fff;
}
/* Animation area + header line */
body.policy-page .animation-area,
body.research-page .animation-area,
body.team-page .animation-area,
body.approach-page .animation-area,
body.publication-page .animation-area{
  background:#fcfaf7;
}
body.policy-page .homepage-header::after,
body.research-page .homepage-header::after,
body.team-page .homepage-header::after,
body.approach-page .homepage-header::after,
body.publication-page .homepage-header::after{
  background:#e0ddd8;
}
/* Boxes/borders */
body.team-page .box{
  border-color:#e0ddd8;
}
body.team-page .page.team .box{
  border-left-color:#e0ddd8;
  border-top-color:#e0ddd8;
}
body.team-page .page.team .grid-2{
  border-right-color:#e0ddd8;
  border-bottom-color:#e0ddd8;
}
body.team-page .eyebrow{
  color:#6d685f;
  border-bottom-color:#e0ddd8;
}
body.research-page .box{
  border-color:#e0ddd8;
}
/* Publication page image filter reset */
body.publication-page img{
  filter:none;
}
/* Policy page — make logos visible on light background (remove white invert) */
body.policy-page .page img,
body.research-page .page img{
  filter:none;
}
/* ── Flourishes: switchable styles (A/B/C/D) ── */
/* --- Flourish: accent bar above headings --- */
.ip .page:not(.home) h1::before,
.ip .page:not(.home) h2::before{
  content:"";
  display:block;
  width:60px;
  height:3px;
  background:#5a68d8;
  margin-bottom:12px;
  border-radius:2px;
}
.ip .page:not(.home) h2{
  font-size:27px;
}
.ip .page:not(.home) h2::before{
  width:40px;
  height:2px;
  margin-bottom:8px;
}

/* Blue tint on eyebrow labels */
.ip .eyebrow{
  color:#5a68d8;
  border-bottom-color:rgba(90,104,216,0.2);
}
/* Stories page — inherits interior page theme */
body.stories-page{ background:#fcfaf7; color:#2d2a26 }
body.stories-page .topbar{ background:linear-gradient(135deg,#5a68d8 0%,#7a88e8 100%); border-bottom:1px solid rgba(255,255,255,0.2) }
body.stories-page .topbar .top-nav a{ color:#fff; text-decoration:none }
body.stories-page .topbar a:hover{ color:#fff; text-decoration:none }
body.stories-page .brand-logo-header{ filter:brightness(0) invert(1) }
body.stories-page .nav-symbol{ border-color:#fff }
body.stories-page .nav-symbol::after{ background:#fff }
body.stories-page .mobile-menu-btn{ color:#fff }
body.stories-page .animation-area{ background:#fcfaf7 }
body.stories-page .homepage-header::after{ background:#e0ddd8 }
/* ── END Interior page theme ── */

/* ══════════════════════════════════════════════════
   Floating pill nav — replaces the old topbar
   ══════════════════════════════════════════════════ */
.site-header { display: none; }
.paper-header-bar { display: none; }
.homepage-header::after { display: none; }
/* Paper pages need top padding since they don't use .homepage-left */
body.paper-page main { padding-top: 100px; }

.floating-header {
  position: absolute;
  top: 0; left: 0; right: 0;
  z-index: 100;
  height: 100px;
  background: transparent;
  pointer-events: none;
  transform: translateZ(0);
  backface-visibility: hidden;
}
.floating-nav {
  pointer-events: all;
  display: flex;
  align-items: center;
  height: 72px;
  margin: 16px 20px 0;
  padding: 0 24px;
  max-width: 1920px;
  border-radius: 9999px;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0.06) 100%);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.28);
  transform: translateZ(0);
  backface-visibility: hidden;
}
.fn-left { display: flex; align-items: center; flex: 1; }
.fn-hamburger {
  display: none; flex-direction: column; justify-content: center; align-items: center;
  width: 36px; height: 36px; cursor: pointer; background: none; border: none;
  padding: 0; margin-right: 28px; flex-shrink: 0;
}
.fn-hamburger span { display: block; width: 18px; height: 1.5px; background: #fff; margin: 2.5px 0; border-radius: 1px; }
.fn-pages { display: flex; align-items: center; gap: 4px; }
.floating-header .floating-nav a,
.floating-header .floating-nav a:visited,
.floating-header .floating-nav a:hover {
  color: #fff; text-decoration: none;
}
.fn-pages a {
  font-size: 14px; font-weight: 400; letter-spacing: 0.04em; text-transform: uppercase; color: #fff;
  padding: 8px 14px; border-radius: 100px; transition: background 0.2s, color 0.2s;
  white-space: nowrap; line-height: 1.4; text-decoration: none;
}
.fn-pages a:hover, .fn-pages a.active { background: rgba(255,255,255,0.15); text-decoration: none; color: #fff; }
.fn-center { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; }
.floating-header .fn-center img { height: 34px; width: auto; filter: brightness(0) invert(1) !important; position: relative; top: 2px; }
.fn-right { display: flex; align-items: center; gap: 12px; flex: 1; justify-content: flex-end; }
.fn-search-toggle{
  appearance:none;
  border:0;
  background:transparent;
  color:#fff;
  padding:8px 14px;
  border-radius:100px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  cursor:pointer;
  transition:background 0.2s;
}
.fn-search-toggle:hover,
.fn-search-toggle[aria-expanded="true"]{
  background:rgba(255,255,255,0.15);
}
.fn-search-toggle:focus-visible{
  outline:2px solid rgba(255,255,255,0.9);
  outline-offset:2px;
}
.fn-search-toggle .search-icon-svg{
  width:16px;
  height:16px;
}
.fn-search-toggle .nav-search-label{
  font-size:14px;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:0.04em;
  line-height:1;
}
.fn-cta {
  font-size: 14px; font-weight: 600; color: #fff; background: #4a55b3;
  padding: 9px 22px; border-radius: 100px; border: 1.5px solid rgba(255,255,255,0.7);
  transition: background 0.2s; white-space: nowrap; text-decoration: none;
}
.fn-cta:hover { background: #5660c0; text-decoration: none; }
.fn-link {
  font-size: 14px; font-weight: 400; text-transform: uppercase; letter-spacing: 0.04em;
  color: #fff; padding: 8px 14px; border-radius: 100px;
  transition: background 0.2s, color 0.2s; white-space: nowrap; text-decoration: none;
}
.fn-link:hover, .fn-link.active { background: rgba(255,255,255,0.15); text-decoration: none; color: #fff; }

/* Nav items float above the mobile panel */
.fn-left, .fn-center, .fn-right { position: relative; z-index: 2; }

/* Mobile dropdown */
.fn-mobile-menu {
  position: absolute;
  top: -2px; left: -2px; right: -2px;
  background: rgba(58, 68, 160, 0.95);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
  padding: 66px 0 16px;
  pointer-events: none;
  opacity: 0;
  transform: translateY(-8px);
  transition: opacity 0.3s ease, transform 0.3s ease;
  z-index: 1;
}
.fn-mobile-menu.open {
  opacity: 1;
  transform: translateY(0);
  pointer-events: all;
}
.fn-mobile-menu a {
  display: block; padding: 14px 28px; color: #fff;
  font-size: 20px; font-weight: 500; text-decoration: none;
  transition: background 0.2s;
}
.fn-mobile-menu a:hover { background: rgba(255,255,255,0.1); }

/* Content needs top padding to clear the floating nav */
.homepage-left { padding-top: 100px; }

.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0, 0, 0, 0);
  border:0;
}
.nav-search-panel{
  position:fixed;
  left:0;
  right:0;
  top:var(--nav-search-top, 94px);
  z-index:1200;
  padding:0 27px;
  opacity:0;
  pointer-events:none;
  transform:translateY(-10px);
  transition:opacity 0.22s ease, transform 0.22s ease;
}
.nav-search-panel.open{
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
}
.nav-search-panel-inner{
  max-width:600px;
  margin:0 auto;
  border:1px solid rgba(255,255,255,0.42);
  border-radius:18px;
  background:rgba(236,238,242,0.9);
  -webkit-backdrop-filter:blur(8px) saturate(115%);
  backdrop-filter:blur(8px) saturate(115%);
  box-shadow:0 20px 44px rgba(16, 20, 40, 0.16);
  padding:24px 28px;
  min-height:116px;
  display:flex;
  align-items:center;
}
.nav-search-form{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr) auto;
  gap:18px;
  align-items:center;
  width:100%;
}
.nav-search-leading{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  color:#4a55b3;
}
.nav-search-leading .search-icon-svg{
  width:24px;
  height:24px;
  stroke-width:2.2;
}
.nav-search-input{
  width:100%;
  border:0;
  border-radius:0;
  background:transparent;
  font-size:clamp(15px, calc(4vw - 15px), 41px);
  font-weight:600;
  line-height:1.18;
  padding:4px 0;
  outline:none;
  box-shadow:none;
  color:#4a55b3;
  caret-color:#4a55b3;
  appearance:none;
  -webkit-appearance:none;
}
.nav-search-input::placeholder{
  color:#4a55b3;
  opacity:1;
}
.nav-search-input:focus{
  border:0;
  box-shadow:none;
}
.nav-search-submit{
  border:1px solid transparent;
  border-radius:8px;
  background:#5a68d8;
  color:#fff;
  padding:10px 16px;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  letter-spacing:0.03em;
  justify-self:end;
  opacity:0;
  pointer-events:none;
  transform:translateX(8px);
  max-width:0;
  padding-left:0;
  padding-right:0;
  overflow:hidden;
  white-space:nowrap;
  transition:opacity 0.2s ease, transform 0.2s ease, max-width 0.2s ease, padding 0.2s ease, border-color 0.2s ease;
}
.nav-search-panel.has-query .nav-search-submit{
  opacity:1;
  pointer-events:auto;
  transform:translateX(0);
  max-width:120px;
  padding-left:16px;
  padding-right:16px;
  border-color:#5a68d8;
}
.nav-search-submit:hover{
  background:#4d5ac3;
  border-color:#4d5ac3;
}

/* ── Interior-page nav treatment ── */
/* Version A: colored pill on interior pages */
body:not(.home) .floating-nav {
  background: linear-gradient(160deg, rgba(90, 104, 216, 0.92) 0%, rgba(75, 88, 200, 0.88) 100%);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.18);
}
/* Version B: blue header bar behind nav (opt-in with .ip-bar) */
body.ip-bar .floating-header {
  background: #5a68d8;
  height: 104px;
}
body.ip-bar .floating-nav {
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0.06) 100%);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.28);
}

@media (max-width: 860px) {
  .fn-pages { display: none; }
  .fn-link { display: none; }
  .fn-hamburger { display: flex; margin-right: 0; }
  .floating-nav { margin: 12px 12px 0; padding: 0 16px; height: 60px; }
  body.ip-bar .floating-header { height: 96px; }
}
@media (max-width: 480px) {
  .fn-cta { font-size: 13px; padding: 8px 16px; }
  .fn-center img { height: 22px; }
  .fn-search-toggle{ padding:7px 12px; }
  .nav-search-panel{ padding:0 10px; }
  .nav-search-panel-inner{ padding:18px 16px; min-height:96px; }
  .nav-search-form{ gap:12px; grid-template-columns:auto minmax(0, 1fr) auto; }
  .nav-search-leading{ width:24px; height:24px; }
  .nav-search-leading .search-icon-svg{ width:18px; height:18px; stroke-width:2.1; }
  .nav-search-input{ font-size:clamp(22px, 7vw, 32px); }
  .nav-search-panel.has-query .nav-search-submit{
    max-width:104px;
    padding-left:12px;
    padding-right:12px;
  }
}