/* ============================================
   Who We Are — Hero
   ============================================ */
.whowearehero-container{
  position: relative;
  background: #09181F;
  color: #FFFFFF;
  padding: 110px 0 80px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-family: inherit;
}
.whowearehero-container::before{
  content:""; position:absolute; inset:0;
  background-image: radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 28px 28px;
  mask-image: radial-gradient(ellipse at 50% 50%, #000 40%, transparent 85%);
  -webkit-mask-image: radial-gradient(ellipse at 50% 50%, #000 40%, transparent 85%);
  pointer-events:none;
}
.wwa-hero__arc{
  position:absolute;
  right: -18vw; bottom: -30vw;
  width: 80vw; height: 80vw;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.08);
  pointer-events:none;
  z-index:1;
}
.wwa-hero__arc::before{
  content:""; position:absolute; inset: 6vw;
  border-radius:50%;
  border-right:2px solid var(--secondary);
  border-bottom:2px solid var(--secondary);
  transform: rotate(-12deg);
  opacity:.55;
}
.wwa-hero__arc::after{
  content:""; position:absolute; inset: 18vw;
  border-radius:50%;
  border: 1px dashed rgba(255,255,255,.08);
}

.whowearehero-container .container{
  position:relative; z-index:2;
}
.wwa-hero__inner{
  display:grid;
  grid-template-columns: 1fr auto;
  gap: 40px;
  align-items: end;
}

.wwa-hero__eyebrow{
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11px; letter-spacing: .28em; text-transform: uppercase;
  color: #FFFFFF;
  margin-bottom: 28px;
  opacity: 0; transform: translateY(24px);
  animation: wwaRise 1.1s cubic-bezier(.2,.7,.2,1) .05s forwards;
}
.wwa-hero__dot{
  display:inline-block; width:7px; height:7px; border-radius:50%;
  background: var(--secondary); margin-right:10px; vertical-align:middle;
  box-shadow: 0 0 0 4px rgba(255,255,255,.12);
  animation: wwaPulse 2.2s ease-in-out infinite;
}
@keyframes wwaPulse{
  0%,100%{box-shadow: 0 0 0 4px rgba(255,255,255,.12)}
  50%    {box-shadow: 0 0 0 8px rgba(255,255,255,0)}
}

.wwa-hero__title{
  font-size: clamp(48px, 9vw, 140px);
  line-height:.96;
  letter-spacing:-.035em;
  font-weight: 600;
  margin: 0;
  color: #FFFFFF;
}
.wwa-hero__title .line{display:block; overflow:hidden}
.wwa-hero__title .line > span{
  display:inline-block;
  opacity:0; transform: translateY(110%);
  animation: wwaSlideUp 1.1s cubic-bezier(.2,.7,.2,1) forwards;
}
.wwa-hero__title .line:nth-child(1) > span{ animation-delay: .18s }
.wwa-hero__title .line:nth-child(2) > span{ animation-delay: .34s }
.wwa-hero__title .line:nth-child(3) > span{ animation-delay: .52s }
.wwa-hero__title .line:nth-child(4) > span{ animation-delay: .72s }

.wwa-hero__title em{
  font-style:normal;
  color: var(--secondary);
  position:relative;
}
.wwa-hero__title em::before{
  content:""; position:absolute; left:0; right:0; bottom:-.08em;
  height:.08em; background: var(--secondary); opacity:.35;
  transform: scaleX(0); transform-origin:left;
  animation: wwaStretch 1.6s .95s cubic-bezier(.2,.7,.2,1) forwards;
}
@keyframes wwaStretch{ to{transform:scaleX(1)} }
@keyframes wwaRise{ to{opacity:1; transform:none} }
@keyframes wwaSlideUp{ to{opacity:1; transform:none} }

.wwa-hero__aside{
  text-align:right;
  color: #FFFFFF;
  font-size: 14px; line-height:1.55;
  max-width: 320px;
  opacity:0; transform: translateY(24px);
  animation: wwaRise 1.1s cubic-bezier(.2,.7,.2,1) .9s forwards;
}
.wwa-hero__rule{
  width:60px; height:1px; background: var(--secondary);
  margin: 0 0 14px auto;
}

@media (max-width: 960px){
  .whowearehero-container{ padding: 90px 0 70px }
  .wwa-hero__inner{ grid-template-columns: 1fr }
  .wwa-hero__aside{ text-align:left }
  .wwa-hero__rule{ margin-left:0 }
}