.gs-data.gs-data-v2{
  padding:128px 0;
  background-color:var(--green-900);
  background-image:
    linear-gradient(
      color-mix(in srgb,var(--green-800) 58%,transparent),
      color-mix(in srgb,var(--green-700) 52%,transparent)
    ),
    url("assets/greenspire-adatalapu-fenntarthatosag-szervezetfejlesztes-hatter.png");
  background-position:center center;
  background-repeat:no-repeat;
  background-size:cover;
  color:var(--paper);
}

.gs-data-v2 .gs-data-v2-head{
  max-width:900px;
  margin-bottom:96px;
}

.gs-data-v2 .gs-data-v2-head h2{
  max-width:860px;
  margin:0;
  color:var(--paper);
  font-family:var(--serif);
  font-size:60px;
  font-weight:600;
  line-height:68px;
  letter-spacing:-.02em;
}

.gs-data-v2 .gs-data-flow{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:32px;
  align-items:start;
  margin:0;
}

.gs-data-v2 .gs-data-flow-step{
  min-width:0;
  padding:0;
  border:0;
  background:transparent;
}

.gs-data-v2 .gs-data-flow-step::after{
  display:none;
}

.gs-data-v2 .gs-data-flow-survey{
  grid-column:1 / span 4;
}

.gs-data-v2 .gs-data-flow-survey::before{
  content:"2";
  display:block;
  margin-bottom:8px;
  color:var(--green-300);
  font-family:var(--serif);
  font-size:72px;
  font-weight:600;
  line-height:80px;
  letter-spacing:-.02em;
}

.gs-data-v2 .gs-data-survey-lead{
  max-width:360px;
  margin:0;
  color:var(--paper);
  font-family:var(--sans);
  font-size:16px;
  font-weight:600;
  line-height:24px;
}

.gs-data-v2 .gs-data-survey-lead span{
  display:block;
  margin-top:8px;
  color:var(--green-100);
  font-weight:400;
}

.gs-data-v2 .gs-data-flow-program{
  grid-column:6 / 13;
  grid-row:1;
}

.gs-data-v2 .gs-data-flow-program p{
  max-width:760px;
  margin:0;
  color:var(--paper);
  font-family:var(--serif);
  font-size:48px;
  font-weight:600;
  line-height:56px;
}

.gs-data-v2 .gs-data-flow-program strong{
  color:var(--green-200);
  font-weight:600;
}

.gs-data-v2 .gs-data-flow-reaction{
  grid-column:7 / 12;
  margin-top:16px;
}

.gs-data-v2 .gs-data-flow-reaction p{
  margin:0;
  color:var(--green-100);
  font-size:20px;
  line-height:30px;
}

.gs-data-v2 .gs-data-context{
  max-width:760px;
  margin:96px 0 0 auto;
  color:var(--green-100);
  font-size:20px;
  line-height:30px;
}

.gs-data-v2 .gs-situation-grid{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:32px;
  row-gap:40px;
  margin:64px 0 0;
  padding:0;
  border:0;
  list-style:none;
}

.gs-data-v2 .gs-situation-grid li,
.gs-data-v2 .gs-situation-grid li:nth-child(n){
  display:block;
  min-height:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  transform:none;
  justify-self:stretch;
}

.gs-data-v2 .gs-situation-grid li::before{
  display:none;
}

.gs-data-v2 .gs-situation-grid li:nth-child(1){
  grid-column:1 / span 5;
  grid-row:1;
}

.gs-data-v2 .gs-situation-grid li:nth-child(2){
  grid-column:8 / span 5;
  grid-row:1;
  margin-top:48px;
}

.gs-data-v2 .gs-situation-grid li:nth-child(3){
  grid-column:3 / span 6;
  grid-row:2;
  margin-top:8px;
}

.gs-data-v2 .gs-situation-grid li:nth-child(4){
  grid-column:9 / span 4;
  grid-row:2;
  margin-top:72px;
}

.gs-data-v2 .gs-situation-grid p{
  max-width:500px;
  margin:0;
  color:var(--paper);
  font-family:var(--serif);
  font-size:24px;
  font-weight:600;
  line-height:32px;
}

.gs-data-v2 .gs-data-closing{
  max-width:760px;
  margin:112px 0 0 auto;
  color:var(--green-100);
  font-size:20px;
  line-height:30px;
}

.gs-data-v2 .gs-data-closing strong{
  display:block;
  color:var(--green-200);
  font-family:var(--serif);
  font-size:36px;
  font-weight:600;
  line-height:44px;
}

@media(max-width:1024px){
  .gs-data.gs-data-v2{
    padding:96px 0;
  }

  .gs-data-v2 .gs-data-v2-head{
    margin-bottom:72px;
  }

  .gs-data-v2 .gs-data-v2-head h2{
    font-size:48px;
    line-height:56px;
  }

  .gs-data-v2 .gs-data-flow{
    grid-template-columns:repeat(8,minmax(0,1fr));
    gap:32px;
  }

  .gs-data-v2 .gs-data-flow-survey{
    grid-column:1 / span 3;
  }

  .gs-data-v2 .gs-data-flow-survey::before{
    font-size:60px;
    line-height:68px;
  }

  .gs-data-v2 .gs-data-flow-program{
    grid-column:4 / 9;
  }

  .gs-data-v2 .gs-data-flow-program p{
    font-size:36px;
    line-height:44px;
  }

  .gs-data-v2 .gs-data-flow-reaction{
    grid-column:4 / 9;
  }

  .gs-data-v2 .gs-data-context{
    margin-top:80px;
  }

  .gs-data-v2 .gs-situation-grid{
    grid-template-columns:repeat(8,minmax(0,1fr));
    column-gap:32px;
    row-gap:40px;
    margin-top:56px;
  }

  .gs-data-v2 .gs-situation-grid li:nth-child(1){
    grid-column:1 / span 4;
    grid-row:1;
  }

  .gs-data-v2 .gs-situation-grid li:nth-child(2){
    grid-column:5 / span 4;
    grid-row:1;
    margin-top:40px;
  }

  .gs-data-v2 .gs-situation-grid li:nth-child(3){
    grid-column:2 / span 5;
    grid-row:2;
    margin-top:0;
  }

  .gs-data-v2 .gs-situation-grid li:nth-child(4){
    grid-column:5 / span 4;
    grid-row:3;
    margin-top:16px;
  }

  .gs-data-v2 .gs-data-closing{
    margin-top:88px;
  }
}

@media(max-width:767px){
  .gs-data.gs-data-v2{
    padding:80px 0;
  }

  .gs-data-v2 .gs-data-v2-head{
    margin-bottom:56px;
  }

  .gs-data-v2 .gs-data-v2-head h2{
    font-size:36px;
    line-height:44px;
  }

  .gs-data-v2 .gs-data-flow{
    grid-template-columns:1fr;
    gap:48px;
  }

  .gs-data-v2 .gs-data-flow-survey,
  .gs-data-v2 .gs-data-flow-program,
  .gs-data-v2 .gs-data-flow-reaction{
    grid-column:1;
    grid-row:auto;
    margin-top:0;
  }

  .gs-data-v2 .gs-data-flow-survey::before{
    font-size:60px;
    line-height:68px;
  }

  .gs-data-v2 .gs-data-flow-program p{
    font-size:30px;
    line-height:38px;
  }

  .gs-data-v2 .gs-data-flow-reaction p,
  .gs-data-v2 .gs-data-context{
    font-size:18px;
    line-height:28px;
  }

  .gs-data-v2 .gs-data-context{
    margin:64px 0 0;
  }

  .gs-data-v2 .gs-situation-grid{
    grid-template-columns:1fr;
    gap:40px;
    margin-top:48px;
  }

  .gs-data-v2 .gs-situation-grid li:nth-child(1),
  .gs-data-v2 .gs-situation-grid li:nth-child(2),
  .gs-data-v2 .gs-situation-grid li:nth-child(3),
  .gs-data-v2 .gs-situation-grid li:nth-child(4){
    grid-column:1;
    grid-row:auto;
    margin-top:0;
  }

  .gs-data-v2 .gs-data-closing{
    margin:72px 0 0;
  }

  .gs-data-v2 .gs-data-closing strong{
    font-size:30px;
    line-height:38px;
  }
}