.greenspire-page{
  min-height:100vh;
  background:var(--neutral-50);
  color:var(--neutral-900);
}

.greenspire-page [id]{
  scroll-margin-top:104px;
}

.greenspire-page :focus-visible{
  outline-color:var(--green-500);
}

.greenspire-page .home-header{
  border-color:var(--neutral-100);
  background:var(--paper);
}

.greenspire-page .home-navigation>.home-nav-item:hover{
  color:var(--green-700);
}

.greenspire-page .home-navigation>.home-nav-item[aria-pressed="true"]:not(.header-contact){
  color:var(--green-700);
}

.greenspire-page .home-navigation>.home-nav-item[aria-pressed="true"]:not(.header-contact):after{
  background:var(--green-500);
}

.greenspire-page .home-navigation>.header-contact{
  background:var(--green-600);
  color:var(--paper);
}

.greenspire-page .home-navigation>.header-contact:hover{
  background:var(--green-700);
  color:var(--paper);
}

.greenspire-page .home-navigation>.header-contact[aria-pressed="true"]{
  background:var(--green-800);
}

.greenspire-page .home-menu-button{
  border-color:var(--neutral-200);
  color:var(--green-700);
}

.greenspire-hero{
  min-height:calc(100svh - 88px);
  padding:64px 0 72px;
  background:
    radial-gradient(circle at 88% 18%,color-mix(in srgb,var(--green-100) 72%,transparent),transparent 34%),
    linear-gradient(135deg,var(--paper) 0%,var(--neutral-50) 58%,var(--green-50) 100%);
}

.greenspire-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:64px;
  align-items:center;
}

.greenspire-hero-copy{
  display:grid;
  justify-items:start;
  gap:24px;
}

.greenspire-hero-copy h1{
  max-width:720px;
  margin:0;
  color:var(--neutral-900);
  font-family:var(--serif);
  font-size:60px;
  font-weight:600;
  line-height:68px;
  letter-spacing:-.02em;
}

.greenspire-hero-copy p{
  max-width:600px;
  margin:0;
  color:var(--neutral-700);
  font-size:20px;
  line-height:30px;
}

.greenspire-page .greenspire-hero-cta{
  width:fit-content;
  max-width:100%;
  border-color:var(--green-500);
  background:var(--green-500);
  color:var(--paper);
  white-space:normal;
  text-align:center;
  transition:background-color 150ms ease,border-color 150ms ease,transform 100ms ease;
}

.greenspire-page .greenspire-hero-cta:hover{
  border-color:var(--green-600);
  background:var(--green-600);
  color:var(--paper);
}

.greenspire-page .greenspire-hero-cta:active,
.greenspire-page .greenspire-hero-cta[aria-pressed="true"]{
  transform:translateY(1px);
  border-color:var(--green-700);
  background:var(--green-700);
  color:var(--paper);
}

.greenspire-page .greenspire-hero-cta:focus-visible{
  outline:2px solid var(--green-300);
  outline-offset:2px;
}

.greenspire-hero-media{
  display:grid;
  min-width:0;
  place-items:center;
  margin:0;
  padding:8px;
}

.greenspire-hero-media img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  object-position:center;
  -webkit-mask-image:radial-gradient(ellipse 54% 54% at 50% 50%,#000 0%,#000 52%,rgba(0,0,0,.78) 68%,transparent 100%);
  mask-image:radial-gradient(ellipse 54% 54% at 50% 50%,#000 0%,#000 52%,rgba(0,0,0,.78) 68%,transparent 100%);
}

.greenspire-trust{
  margin-top:48px;
  padding-top:24px;
  border-top:1px solid var(--green-200);
}

.greenspire-trust p{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:0;
  color:var(--neutral-600);
  font-size:14px;
  line-height:20px;
  text-align:center;
}

.greenspire-trust strong{
  color:var(--green-700);
  font-weight:700;
}

.greenspire-trust p>span[aria-hidden]{
  color:var(--green-400);
}

.greenspire-problem{
  padding:144px 0;
  background:var(--neutral-900);
  color:var(--neutral-100);
}

.greenspire-problem-intro{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);
  gap:96px;
  align-items:start;
}

.greenspire-problem h2{
  max-width:760px;
  margin:0;
  color:var(--paper);
  font-family:var(--serif);
  font-size:56px;
  font-weight:600;
  line-height:64px;
  letter-spacing:-.02em;
}

.greenspire-problem-lead{
  max-width:520px;
}

.greenspire-problem-lead p{
  margin:0;
  color:var(--neutral-200);
  font-size:20px;
  line-height:30px;
}

.greenspire-problem-lead p:first-child{
  margin-bottom:16px;
  color:var(--green-200);
  font-family:var(--serif);
  font-size:36px;
  font-weight:600;
  line-height:44px;
}

.greenspire-question-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  margin:88px 0 0;
  padding:0;
  list-style:none;
}

.greenspire-question-list li{
  position:relative;
  display:flex;
  min-height:176px;
  align-items:flex-end;
  padding:32px;
  overflow:hidden;
  border:1px solid var(--neutral-700);
  border-top:3px solid var(--green-500);
  border-radius:12px;
  background:var(--neutral-800);
}

.greenspire-question-list li:before{
  content:"";
  position:absolute;
  top:28px;
  left:32px;
  width:40px;
  height:8px;
  border-radius:999px;
  background:var(--green-500);
}

.greenspire-question-list p{
  max-width:520px;
  margin:0;
  color:var(--paper);
  font-family:var(--serif);
  font-size:24px;
  font-weight:600;
  line-height:32px;
}

.greenspire-problem-closing{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);
  gap:64px;
  align-items:start;
  margin-top:96px;
  padding:48px;
  border-left:4px solid var(--green-500);
  border-radius:0 16px 16px 0;
  background:var(--green-900);
}

.greenspire-problem-closing>p{
  max-width:680px;
  margin:0;
  color:var(--green-50);
  font-family:var(--serif);
  font-size:30px;
  font-weight:600;
  line-height:38px;
}

.greenspire-problem-closing>div{
  display:grid;
  gap:12px;
}

.greenspire-problem-closing>div p{
  margin:0;
  color:var(--neutral-100);
  font-size:17px;
  line-height:26px;
}

@media(max-width:1180px){
  .greenspire-hero{
    padding-top:56px;
  }

  .greenspire-hero-grid{
    gap:40px;
  }

  .greenspire-hero-copy h1{
    font-size:54px;
    line-height:62px;
  }

  .greenspire-problem-intro{
    gap:64px;
  }

  .greenspire-problem h2{
    font-size:48px;
    line-height:56px;
  }
}

@media(max-width:900px){
  .greenspire-hero{
    min-height:auto;
    padding:72px 0 96px;
  }

  .greenspire-hero-grid{
    grid-template-columns:1fr;
    gap:56px;
  }

  .greenspire-hero-copy{
    max-width:760px;
  }

  .greenspire-hero-copy h1{
    max-width:760px;
    font-size:52px;
    line-height:60px;
  }

  .greenspire-hero-media{
    width:min(100%,720px);
    margin-inline:auto;
  }

  .greenspire-problem{
    padding:120px 0;
  }

  .greenspire-problem-intro,
  .greenspire-problem-closing{
    grid-template-columns:1fr;
    gap:40px;
  }

  .greenspire-problem-lead{
    max-width:680px;
  }
}

@media(max-width:767px){
  .greenspire-page [id]{
    scroll-margin-top:72px;
  }

  .greenspire-hero{
    padding:56px 0 80px;
  }

  .greenspire-hero-grid{
    gap:40px;
  }

  .greenspire-hero-copy{
    gap:24px;
  }

  .greenspire-hero-copy h1{
    font-size:48px;
    line-height:56px;
  }

  .greenspire-hero-copy p{
    font-size:18px;
    line-height:28px;
  }

  .greenspire-page .greenspire-hero-cta{
    width:100%;
    min-height:52px;
  }

  .greenspire-hero-media{
    padding:0;
  }

  .greenspire-trust{
    margin-top:40px;
  }

  .greenspire-trust p{
    justify-content:flex-start;
    text-align:left;
  }

  .greenspire-problem{
    padding:96px 0;
  }

  .greenspire-problem h2{
    font-size:40px;
    line-height:48px;
  }

  .greenspire-question-list{
    grid-template-columns:1fr;
    gap:12px;
    margin-top:64px;
  }

  .greenspire-question-list li{
    min-height:152px;
    padding:24px;
  }

  .greenspire-question-list li:before{
    top:24px;
    left:24px;
  }

  .greenspire-question-list p{
    font-size:22px;
    line-height:30px;
  }

  .greenspire-problem-closing{
    gap:32px;
    margin-top:64px;
    padding:32px;
  }

  .greenspire-problem-closing>p{
    font-size:26px;
    line-height:34px;
  }
}

@media(max-width:420px){
  .greenspire-hero-copy h1{
    font-size:40px;
    line-height:48px;
  }

  .greenspire-problem h2{
    font-size:36px;
    line-height:44px;
  }

  .greenspire-problem-closing{
    padding:28px 24px;
  }
}

@media print{
  .greenspire-hero{
    min-height:0;
    padding:48px 0;
    background:var(--paper);
  }
}