/*──────────────────────────  HERO  ─────────────────────────────*/
.hero{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap: 3rem;
  max-width:var(--maxw);
  margin:auto;
  padding-block: 4rem;
}
.hero__text{
  flex:1 1 320px;
  max-width:480px;
}
.hero__text h1 {
  font-size:clamp(2.5rem, 5vw, 3.5rem); /* Updated font size */
  font-weight: 700; /* Added font-weight for bold */
  margin-bottom:1rem;
}
.hero__text h1 span {
  color: var(--c-primary);
  transition: color var(--transition);
}
.hero__text p{
  margin-bottom:2rem;
  font-size:1.1rem;
  color:var(--c-text-secondary);
  transition: color var(--transition);
}
.hero__img{
  flex:1 1 320px;
  max-width:550px;
}