*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
font-family:'Fira Sans Condensed', sans-serif;
color:#2f3a36;
background:#fff;
}

h1{
  font-size: 32px;
}
h2{
  font-size: 38px;
  color: #717975
}
h3{
  font-size: 28px;
  color: #9cbf88;
}

strong {
  color: #80b68a;
}

.container{
width:100%;
max-width:1200px;
margin:0 8%;
padding:0 24px;
}

.header{
background:#fff;
border-bottom:1px solid #eee;
position:sticky;
top:0;
z-index:10;
}

.header__logo{
  background: url('../assets/desktop/images/nortem-capital_logo.png') center/contain no-repeat;
  width: 200px;
  height: 200px;
  background-size: 100%;
}

.header__content{
display:flex;
justify-content:space-between;
align-items:center;
height:80px;
}

.header__nav{
display:flex;
gap:24px;
align-items:center;
white-space: nowrap;
}

.header__nav a{
text-decoration:none;
color:#2f3a36;
font-weight:600;
}

.hero{
background:url("../assets/desktop/images/nortem_hero_background.png") center/cover no-repeat;
color:#fff;
}

.hero__content{
align-content: center;
max-width:640px;
height: 570px;
}

.hero h1{
font-size:32px;
margin-bottom:16px;
}

.hero p{
font-size:20px;
margin-bottom:24px;
}

.numbers{
background:#f3f7f2;
padding:60px 0;
}

.numbers__grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:40px;
text-align:center;
}

.numbers__item strong{
font-size:32px;
color:#80b68a;
}

.about{
  background: url('../assets/desktop/images/nortem_about_background.png') center/cover no-repeat;
  height: 300px;
  width: 100%;
  align-content: center;
}

.about__text{
  max-width: 650px;
  place-self: center;
  color: #fff;
}

.about__text h1 {
  font-weight: 400;
}

.solutions {
  padding: 100px 0;
}

.solutions__text {
  text-align: center;
  margin-bottom: 80px;
}

.solutions__text h2 {
  font-size: 42px;
  color: #6e7c76;
  margin-bottom: 10px;
}

.solutions__text h3 {
  font-size: 26px;
  color: #8bb174;
  font-weight: 500;
}

.solutions__grid {
    max-width: 1200px;
    margin-left: 20%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

.solution__card {
display: flex;
    align-items: flex-start;
    max-width: 400px;
    gap: 10px;
    flex-direction: column;
}

.solution__card_gif {
    background-image: url('../assets/desktop/gifs/green_gif.gif');
    background-size: contain;
    background-position: left;
    background-repeat: no-repeat;
    width: 40px;
    height: 40px;
    position: absolute;
    margin-left: -5%;
}

.solution__card_text {
  font-size: 32px;
}

.solution__icon {
  width: 14px;
  height: 14px;
  background: #1ea85a;
  border-radius: 50%;
  margin-top: 8px;
  flex-shrink: 0;
}

.solution__content h3 {
  color: #8bb174;
  font-size: 26px;
  margin-bottom: 10px;
}

.solution__content p {
  color: #6e7c76;
  font-size: 18px;
  line-height: 1.6;
}



.services{
padding:100px 0;
background:#fafafa;
}

.section-header{
text-align:center;
margin-bottom:60px;
}

.services__grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:24px;
}

.service-card{
background:#fff;
padding:32px;
border-radius:16px;
box-shadow:0 10px 30px rgba(0,0,0,0.05);
}

.cta{
  padding: 100px 0;
    min-height: 500px;
    color: #fff;
    background: url('../assets/desktop/images/nortem_footer_background.png') center / cover no-repeat;
}

.cta__content {
  max-width: 570px;
  margin-left: 15%;
  display: flex;
  gap: 15px;
  flex-direction: column;
}

.contact{
padding:100px 0;
}

.contact__grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:40px;
}

.contact__form{
display:flex;
flex-direction:column;
gap:16px;
}

.contact__form input,
.contact__form textarea{
padding:14px;
border:1px solid #ddd;
border-radius:8px;
font-size:16px;
}

.btn{
display:inline-block;
width: 50%;
text-align: center;
padding:14px 24px;
border-radius:8px;
text-decoration:none;
font-weight:600;
}

.btn--primary{
background:#fff;
color:#80b68a;
}

.footer{
padding:40px 0;
text-align:center;
background:rgb(34,53,47);
color:#fff;
}

@media (max-width:900px){
.services__grid{
grid-template-columns:1fr;
}

.numbers__grid{
grid-template-columns:1fr;
}

.contact__grid{
grid-template-columns:1fr;
}

.hero h1{
font-size:36px;
}
}



@media (max-width: 1024px) {
  .solutions__grid {
    grid-template-columns: 1fr;
    gap: 50px;
  }

  .solutions__text h2 {
    font-size: 28px;
  }

  .solutions__text h3 {
    font-size: 18px;
  }

  .solution__content h3 {
    font-size: 20px;
  }

  .solution__content p {
    font-size: 16px;
  }
}