Blueprint contact

1<footer className="bg-[#2152ff] bg-[linear-gradient(to_right,rgb(255_255_255/0.07)_1px,transparent_1px),linear-gradient(to_bottom,rgb(255_255_255/0.07)_1px,transparent_1px)] bg-size-[40px_40px] text-white">2  <div className="mx-auto max-w-6xl px-5 pt-16 pb-8 sm:px-8 sm:pt-24">3    <div className="flex items-center justify-between font-mono text-[11px] tracking-[0.14em] text-white/65 uppercase">4      <span>Sheet 05 / 05</span>5      <span>Contact</span>6    </div>78    <div className="relative mt-10 sm:mt-14">9      <p className="max-w-md text-lg leading-relaxed text-white/85 sm:text-xl">Two projects a year start from a blank sheet. The next opening is in spring.</p>10      <a11        href="mailto:hello@example.com"12        className="mt-8 block w-fit text-[38px] leading-none font-medium tracking-[-0.025em] text-transparent transition-colors duration-300 ease-out [-webkit-text-stroke:1px_white] hover:text-white sm:text-[84px] sm:[-webkit-text-stroke:1.5px_white] lg:text-[124px]"13      >14        hello@example.com15      </a>16      <div className="mt-5 flex items-center gap-3 font-mono text-[10px] tracking-[0.14em] text-white/70" aria-hidden="true">17        <span className="h-2.5 w-px bg-white/70"></span>18        <span className="h-px flex-1 bg-white/45"></span>19        <span>Replies within two days</span>20        <span className="h-px flex-1 bg-white/45"></span>21        <span className="h-2.5 w-px bg-white/70"></span>22      </div>23      <span className="absolute top-0 right-0 hidden -rotate-6 border-2 border-white px-4 py-3 text-center font-mono text-[12px] leading-relaxed tracking-[0.2em] uppercase md:block">24        Booking25        <br />26        Q2 202727      </span>28    </div>2930    <div className="mt-20 grid gap-6 border-t border-white/35 pt-6 font-mono text-[11px] tracking-[0.14em] uppercase sm:grid-cols-3">31      <p className="leading-relaxed">32        Nora Vidal33        <br />34        <span className="text-white/65">Design engineer, Lisbon</span>35      </p>36      <div className="flex gap-6 sm:justify-center">37        <a href="#" className="underline-offset-4 transition-colors duration-150 hover:underline">Read.cv</a>38        <a href="#" className="underline-offset-4 transition-colors duration-150 hover:underline">GitHub</a>39        <a href="#" className="underline-offset-4 transition-colors duration-150 hover:underline">LinkedIn</a>40      </div>41      <p className="text-white/65 sm:text-right">© 2027 · Drawn, then built</p>42    </div>43  </div>44</footer>