{{- $home := .Site.Params.home -}}
{{- $hero := .Site.Params.hero -}}
{{- $techMain := $home.tech -}}
{{- $techReverse := $home.techReverse -}}
{{- $variant := $home.techVariant | default "wide" -}}

{{ with $techMain }}
  <div class="space-y-5 animate-fade-up">
    <div class="space-y-2">
      <h3 class="heading-section text-base">
        {{ default "What I Work With" $hero.techMarqueeLabel }}
      </h3>

      <div class="tech-strip {{ if eq $variant "compact" }}tech-strip--compact{{ else }}tech-strip--wide{{ end }}">
        <!-- primary row (always rendered) -->
        <div class="tech-strip-track tech-strip-track--primary">
          {{ range . }}
            <div class="tech-strip-item">
              {{ with .icon }}
                <i class="{{ . }} tech-icon"></i>
              {{ end }}
              <span class="font-medium">{{ .label }}</span>
            </div>
          {{ end }}
          {{ range . }}
            <div class="tech-strip-item" aria-hidden="true">
              {{ with .icon }}
                <i class="{{ . }} tech-icon"></i>
              {{ end }}
              <span class="font-medium">{{ .label }}</span>
            </div>
          {{ end }}
        </div>

        <!-- secondary row, reverse (only if techReverse is defined) -->
        {{ with $techReverse }}
          <div class="tech-strip-track tech-strip-track--secondary">
            {{ range . }}
              <div class="tech-strip-item">
                {{ with .icon }}
                  <i class="{{ . }} tech-icon"></i>
                {{ end }}
                <span class="font-medium">{{ .label }}</span>
              </div>
            {{ end }}
            {{ range . }}
              <div class="tech-strip-item" aria-hidden="true">
                {{ with .icon }}
                  <i class="{{ . }} tech-icon"></i>
                {{ end }}
                <span class="font-medium">{{ .label }}</span>
              </div>
            {{ end }}
          </div>
        {{ end }}
      </div>
    </div>
  </div>
{{ end }}
