:root{
    --paper: #F6F1E5;
    --paper-deep: rgb(255 255 255 / 35%);
    --ink: #2A2420;
    --ink-soft: #5B5148;
    --eucalyptus: #3F7468;
    --eucalyptus-deep: #2C544B;
    --ochre: #C1832E;
    --plum: #7C5878;
    --card: #EFE6D2;
    --card-line: rgba(42,36,32,0.14);
    --cream-arch: #FBF8F0;
    --shadow: 0 18px 40px -20px rgba(42,36,32,0.35);
    --maxw: 1080px;
  }

  *{box-sizing:border-box;}

  body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:'Public Sans', sans-serif;
    font-size:17px;
    line-height:1.65;
    -webkit-font-smoothing:antialiased;
  }
  ::selection{background:var(--ochre); color:var(--cream-arch);}

  h1,h2,h3{
    font-family:'Fraunces', serif;
    font-weight:560;
    letter-spacing:-0.01em;
    margin:0;
    color:var(--ink);
  }

  a{color:var(--eucalyptus-deep);}

  .wrap{max-width:var(--maxw); margin:0 auto; }
  .images img{
    width: 50%;
  }

  .eyebrow{
    font-family:'Public Sans', sans-serif;
    font-size:12.5px;
    font-weight:700;
    letter-spacing:0.16em;
    text-transform:uppercase;
    color:var(--eucalyptus-deep);
  }

  /* ---------- reduced motion ---------- */
  @media (prefers-reduced-motion: reduce){
    *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important;}
  }

  :focus-visible{ outline:3px solid var(--ochre); outline-offset:3px; border-radius:4px; }

  /* ---------- top nav ---------- */
  header.site{
    position:sticky; top:0; z-index:50;
    background:rgba(246,241,229,0.86);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--card-line);
  }
  .nav-inner{
    max-width:var(--maxw); margin:0 auto; padding:16px 0px;
    display:flex; align-items:center; justify-content:space-between; gap:20px;
  }

  nav.contents{
    display:flex; gap:22px; flex-wrap:wrap;
    font-size:13.5px; font-weight:600;
  }
  nav.contents a{
    color:var(--ink-soft); text-decoration:none;
    padding-bottom:3px; border-bottom:2px solid transparent;
    transition: color .2s ease, border-color .2s ease;
  }
  nav.contents a:hover{ color:var(--eucalyptus-deep); border-color:var(--ochre); }
  @media (max-width: 780px){ nav.contents{display:none;} }

  /* ---------- hero ---------- */
  .hero{
    position:relative; overflow:hidden;
    padding:96px 0 84px;
  }
  .hero-inner{
    max-width:var(--maxw); margin:0 auto; padding:0 28px;
    display:grid; grid-template-columns: 1.15fr 0.85fr; gap:48px; align-items:center;
  }
  @media (max-width: 860px){ .hero-inner{grid-template-columns:1fr;} }

  .hero h1{
    font-size:clamp(44px, 6.4vw, 74px);
    line-height:0.98;
    margin:14px 0 20px;
  }
  .hero h1 em{
    font-style:italic; font-weight:440; color:var(--eucalyptus-deep);
  }
  .hero p.lede{
    font-size:19px; color:var(--ink-soft); max-width:46ch; margin:0 0 30px;
  }
  .hero-cta{
    display:inline-flex; align-items:center; gap:10px;
    font-weight:700; font-size:14.5px; letter-spacing:0.02em;
    color:var(--cream-arch); background:var(--eucalyptus-deep);
    padding:13px 22px; border-radius:100px; text-decoration:none;
    box-shadow: var(--shadow);
    transition: transform .25s ease, background .25s ease;
  }
  .hero-cta:hover{ transform: translateY(-2px); background:var(--eucalyptus); }
  .hero-cta svg{ transition: transform .25s ease; }
  .hero-cta:hover svg{ transform: translateY(2px); }

  /* the arch / window — signature element */
  .arch-frame{
    position:relative;
    aspect-ratio: 3/4;
    max-width:380px; margin:0 auto;
  }
  .arch-frame svg{ width:100%; height:100%; display:block; }
  .arch-glow{
    animation: glow-drift 9s ease-in-out infinite;
    transform-origin: 50% 30%;
  }
  @keyframes glow-drift{
    0%,100%{ transform: translate(0,0) scale(1); opacity:0.9; }
    50%{ transform: translate(-2%, -3%) scale(1.06); opacity:1; }
  }
  .mote{ animation: float-up linear infinite; }
  @keyframes float-up{
    0%{ transform:translateY(0); opacity:0; }
    12%{ opacity:0.65; }
    88%{ opacity:0.35; }
    100%{ transform:translateY(-140px); opacity:0; }
  }

  /* ---------- sections ---------- */
  section{ padding:78px 0; }
  section.alt{ background:var(--paper-deep); box-shadow:rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;}
  .section-head{
    display:flex; align-items:baseline; gap:16px; margin-bottom:30px;
    border-bottom:1px solid var(--card-line); padding-bottom:18px;
  }
  .section-head h2{ font-size:clamp(28px,3.4vw,38px); }
  .section-head .eyebrow{ white-space:nowrap; }

  .reveal{ opacity:0; transform:translateY(22px); transition: opacity .7s ease, transform .7s ease; }
  .reveal.in{ opacity:1; transform:translateY(0); }

  .prose{  color:var(--ink-soft); font-size:17px; text-align:justify;}
  .prose p{ margin:0 0 18px; text-align:justify;}
  .prose strong{ color:var(--ink); font-weight:600; }
  .prose + .callout, .prose + .stat-row{ margin-top:32px; }

  .callout{
    background:var(--card);
    border:1px solid var(--card-line);
    border-left:4px solid var(--eucalyptus);
    border-radius:4px 14px 14px 4px;
    padding:20px 24px;
    max-width:70%;
    font-size:15.5px;
    color:var(--ink-soft);
  }
  .callout b{ color:var(--ink); }

  /* stat row */
  .stat-row{
    display:grid; grid-template-columns:repeat(3,1fr); gap:18px;;
  }
  @media (max-width:700px){ .stat-row{grid-template-columns:1fr;} }
  .stat-card{
    background:var(--cream-arch); border:1px solid var(--card-line);
    border-radius:18px 18px 6px 6px; padding:24px 20px; text-align:left;
    box-shadow: 0 10px 26px -18px rgba(42,36,32,0.4);
  }
  .stat-num{
    font-family:'Fraunces', serif; font-weight:650; font-size:clamp(30px,3.6vw,40px);
    color:var(--eucalyptus-deep); line-height:1;
  }
  .stat-label{ font-size:13.5px; color:var(--ink-soft); margin-top:8px; }

  /* strategy / partner cards with arch tops */
  .card-grid{ display:grid; grid-template-columns:1fr 1fr; gap:26px; }
  @media (max-width:760px){ .card-grid{grid-template-columns:1fr;} }

  .arch-card{
    background:var(--cream-arch);
    border:1px solid var(--card-line);
    border-radius: 25px;
    padding:52px 30px 32px;
    position:relative;
    box-shadow: var(--shadow);
    transition: transform .3s ease, box-shadow .3s ease;
  }
  .arch-card:hover{ transform: translateY(-6px); box-shadow: 0 26px 50px -22px rgba(42,36,32,0.42); }
  .arch-card .num{
        position: absolute;
    top: 5px;
    left: 50%;
    transform: translateX(-50%);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Fraunces', serif;
    font-weight: 650;
    font-size: 17px;
    background: linear-gradient(160deg, #a29e99, var(--eucalyptus));
    color: var(--cream-arch);
  }
  .arch-card h3{ font-size:21px; text-align:center; margin-bottom:10px; }
  .arch-card p{ font-size:15.5px; color:var(--ink-soft); margin:0; }

  .partner-card{
    background:var(--card); border:1px solid var(--card-line);
    border-radius:18px; padding:28px 26px;
  }
  .partner-card h3{ font-size:20px; margin-bottom:4px; }
  .partner-card .role{ font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ochre); }
  .partner-card p{ font-size:15px; color:var(--ink-soft); margin:12px 0 0; }

  /* resources */
  .resource-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
  @media (max-width:820px){ .resource-grid{grid-template-columns:1fr;} }
  .resource-col h3{
    font-size:15px; font-family:'Public Sans',sans-serif; font-weight:700;
    letter-spacing:.03em; color:var(--eucalyptus-deep); margin-bottom:14px;
    display:flex; align-items:center; gap:8px;
  }
  .resource-col h3 svg{ flex:0 0 auto; }
  .resource-item{
    background:var(--cream-arch); border:1px solid var(--card-line);
    border-radius:12px; padding:16px 18px; margin-bottom:12px;
  }
  .resource-item .title{ font-weight:600; font-size:15px; color:var(--ink); }
  .resource-item .meta{ font-size:13px; color:var(--ink-soft); margin-top:4px; }

  .closing-line{
    max-width:70ch; margin-top:38px; font-size:15.5px; color:var(--ink-soft);
    border-top:1px solid var(--card-line); padding-top:26px;
  }
 .reference-list {
    padding: 50px;
    background-color: rgba(255, 255, 255, 0.14);
}

.reference-list h2 {
    color: rgb(0, 2, 128);
    position: relative;
    margin: 0 35px;
}

.reference-list h2:before {
    position: absolute;
    content: '';
    left: 0px;
    bottom: 0px;
    width: 100px;
    height: 3px;
    background-color: rgb(0, 2, 128);
}

.reference-list ul li {
    list-style: disc;
    margin: 5px 0px 0px 0px;
    text-align: left;
}

  /* footer */
  footer{
    background:var(--eucalyptus-deep); color:#EFE6D2;
    padding:56px 0 34px;
  }
  footer .wrap{ display:flex; flex-direction:column; gap:6px; }
  footer h3{ color:#FBF8F0; font-size:24px; margin-bottom:6px; }
  footer p{ color:#D9E4DF; font-size:14.5px; max-width:60ch; margin:0 0 22px; }
  footer .refs{ font-size:12px; color:#B9CCC4; line-height:1.9; }
  footer .rule{ height:1px; background:rgba(255,255,255,0.14); margin:26px 0; }