Bulma Components

<section class="section has-background-white-ter">
  <div class="container">
    <div class="mb-16 columns is-multiline">
      <div class="column is-8-desktop mb-12 mb-0-desktop">
        <h1 class="title is-size-2-mobile is-size-1-tablet" style="letter-spacing: -0.04em;">About us</h1>
        <p class="is-size-5 has-text-dark">
          <span>KW70 Fix is a leading real estate investment firm in the World, headquartered in New York with offices in</span>
          <span></span>
          <span>London, Chicago, Vienna, Rome, Las Vegas.</span>
        </p>
      </div>
      <div class="column is-4-desktop pt-16 has-text-right">
        <a class="button is-ghost px-0" href="#" style="height: 38px;">
          <span class="mr-2">Get to know us</span>
          <svg class="is-rotate-45" width="11" height="11" viewbox="0 0 11 11" fill="none" xmlns="http://www.w3.org/2000/svg">
            <path d="M9.5 1.5L1.5 9.5" stroke="black" stroke-width="1.3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
            <path d="M9.5 8.83571V1.5H2.16429" stroke="black" stroke-width="1.3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
          </svg>
        </a>
      </div>
    </div>
    <div class="columns is-multiline">
      <div class="column is-12 is-7-widescreen mb-20 mb-0-widescreen">
        <div class="has-mw-2xl-widescreen">

<section class="is-relative" x-data="{ mobileNavOpen: false }">
  <nav class="navbar py-2 is-white" role="navigation" aria-label="navigation">
    <div class="navbar-brand">
      <a class="navbar-item" href="#">
        <img class="image" src="asitrastudio-assets/logos/logo-asi.svg" alt="">
      </a>
      <div class="navbar-item ml-auto is-hidden-desktop">
        <button x-on:click="mobileNavOpen = !mobileNavOpen" class="is-inline-flex is-align-items-center is-justify-content-center navbar-menu-open navbar-burger" href="#">
          <svg width="44" height="16" viewbox="0 0 44 16" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="44" height="2" rx="1" fill="black"></rect><rect y="14" width="44" height="2" rx="1" fill="black"></rect></svg>
        </button>
      </div>
    </div>
    <div class="navbar-menu" id="navExample">
      <div class="navbar-end"><a class="navbar-item">About</a><a class="navbar-item">Services</a><a class="navbar-item">Projects</a><a class="navbar-item">Contact us</a></div>
    </div>
    <div class="navbar-item is-hidden-touch">
      <button x-on:click="mobileNavOpen = !mobileNavOpen" class="is-inline-flex is-align-items-center is-justify-content-center navbar-menu-open navbar-burger" href="#">
        <svg width="44" height="16" viewbox="0 0 44 16" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="44" height="2" rx="1" fill="black"></rect><rect y="14" width="44" height="2" rx="1" fill="black"></rect></svg>
      </button>
    </div>
  </nav>
  <div :class="{ 'is-block': mobileNavOpen, 'is-hidden': !mobileNavOpen }" class="is-hidden navbar-side is-fixed is-top-0 is-bottom-0 is-left-0 has-mw-sm" style="width: 75%; z-index: 9999;">
    <div x-on:click="mobileNavOpen = !mobileNavOpen" class="is-fixed is-inset-0 has-background-dark" style="opacity: 75%; z-index: 50;"></div>
    <aside class="menu is-relative is-flex is-flex-direction-column pb-6 px-6 has-background-white" style="width: 100%; height: 100%; z-index: 50; overflow-y: auto;">

<section class="is-relative is-clipped" x-data="{ open: true }" :class="{ 'is-hidden': !open }">
  <div class="px-8 pt-10 pb-9 is-fixed is-bottom-0 is-right-0 has-background-dark is-fullwidth" style="z-index: 50; border-radius: 40px 40px 0px 0px; width: 100%;">
    <div class="is-absolute is-top-0 is-right-0 mt-8 mr-5 mr-12-widescreen">
      <button x-on:click.prevent="open = false" class="button p-0 is-light has-background-dark">
        <svg width="15" height="16" viewbox="0 0 15 16" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M7.5 6.45616L7.42929 6.38545L1.96352 0.919676C1.96351 0.919673 1.96351 0.919669 1.96351 0.919666C1.75876 0.714984 1.4811 0.6 1.19159 0.6C0.902079 0.6 0.624425 0.71498 0.419676 0.919655C0.419669 0.919662 0.419662 0.919669 0.419655 0.919676M7.5 6.45616L0.419655 0.919676M7.5 6.45616L7.57071 6.38545M7.5 6.45616L7.57071 6.38545M0.419655 0.919676C0.21498 1.12442 0.1 1.40208 0.1 1.69159C0.1 1.9811 0.214984 2.25876 0.419666 2.46351M0.419655 0.919676L0.419666 2.46351M0.419666 2.46351C0.419669 2.46351 0.419673 2.46351 0.419676 2.46352M0.419666 2.46351L0.419676 2.46352M0.419676 2.46352L5.88545 7.92929M0.419676 2.46352L5.88545 7.92929M7.57071 6.38545L13.0365 0.919676C13.0365 0.919673 13.0365 0.919669 13.0365 0.919666C13.2412 0.714984 13.5189 0.6 13.8084 0.6C14.0979 0.6 14.3756 0.71498 14.5803 0.919655C14.785 1.12441 14.9 1.40207 14.9 1.69159C14.9 1.9811 14.785 2.25876 14.5803 2.46351C14.5803 2.46351 14.5803 2.46351 14.5803 2.46352L9.11455 7.92929L9.04384 8L9.11455 8.07071L14.5803 13.5365C14.5803 13.5365 14.5803 13.5365 14.5803 13.5365M7.57071 6.38545L14.5803 13.5365M5.95616 8L5.88545 8.07071L0.419676 13.5365C0.419673 13.5365 0.419669 13.5365 0.419666 13.5365C0.214984 13.7412 0.1 14.0189 0.1 14.3084C0.1 14.5979 0.21498 14.8756 0.419655 15.0803C0.624405 15.285 0.902069 15.4 1.19159 15.4C1.4811 15.4 1.75876 15.285 1.96351 15.0803C1.96351 15.0803 1.96351 15.0803 1.96352 15.0803L7.42929 9.61455L7.5 9.54384L7.57071 9.61455L13.0365 15.0803C13.0365 15.0803 13.0365 15.0803 13.0365 15.0803C13.2412 15.285 13.5189 15.4 13.8084 15.4C14.0979 15.4 14.3756 15.285 14.5803 15.0803C14.5803 15.0803 14.5803 15.0803 14.5803 15.0803M5.95616 8L14.5803 15.0803M5.95616 8L5.88545 7.92929M5.95616 8L5.88545 7.92929M14.5803 15.0803C14.785 14.8756 14.9 14.5979 14.9 14.3084C14.9 14.0189 14.785 13.7412 14.5803 13.5365M14.5803 15.0803L14.5803 13.5365" fill="#222222" stroke="white" stroke-width="1"></path>
        </svg>
      </button>
    </div>
    <div class="section py-0">
      <div class="container">
        <div class="columns is-multiline is-vcentered">
          <div class="column is-1-tablet is-align-self-flex-start">
            <svg width="28" height="28" viewbox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
              <path d="M11.082 12.8334C12.0485 12.8334 12.832 12.0499 12.832 11.0834C12.832 10.1169 12.0485 9.33337 11.082 9.33337C10.1155 9.33337 9.33203 10.1169 9.33203 11.0834C9.33203 12.0499 10.1155 12.8334 11.082 12.8334Z" fill="white"></path>
              <path d="M21.582 3.5C22.5485 3.5 23.332 2.7165 23.332 1.75C23.332 0.783502 22.5485 0 21.582 0C20.6155 0 19.832 0.783502 19.832 1.75C19.832 2.7165 20.6155 3.5 21.582 3.5Z" fill="white"></path>
              <path d="M25.082 9.33337C26.0485 9.33337 26.832 8.54987 26.832 7.58337C26.832 6.61688 26.0485 5.83337 25.082 5.83337C24.1155 5.83337 23.332 6.61688 23.332 7.58337C23.332 8.54987 24.1155 9.33337 25.082 9.33337Z" fill="white"></path>
              <path d="M11.082 18.6666C12.0485 18.6666 12.832 17.8831 12.832 16.9166C12.832 15.9501 12.0485 15.1666 11.082 15.1666C10.1155 15.1666 9.33203 15.9501 9.33203 16.9166C9.33203 17.8831 10.1155 18.6666 11.082 18.6666Z" fill="white"></path>
              <path d="M16.918 18.6666C17.8845 18.6666 18.668 17.8831 18.668 16.9166C18.668 15.9501 17.8845 15.1666 16.918 15.1666C15.9515 15.1666 15.168 15.9501 15.168 16.9166C15.168 17.8831 15.9515 18.6666 16.918 18.6666Z" fill="white"></path>
              <path d="M27.9335 12.663C27.9076 12.3933 27.7887 12.141 27.5971 11.9494C27.4055 11.7578 27.1532 11.6389 26.8835 11.613C24.1881 11.3533 21.667 10.1641 19.7523 8.24923C17.8377 6.33436 16.6487 3.8131 16.3893 1.11767C16.3635 0.84795 16.2445 0.595643 16.053 0.40405C15.8614 0.212457 15.6091 0.0935253 15.3393 0.0676667C14.8972 0.0245 14.4515 0 14 0C11.2311 0 8.52431 0.821086 6.22202 2.35943C3.91973 3.89777 2.12532 6.08427 1.06569 8.64243C0.006066 11.2006 -0.271181 14.0155 0.269012 16.7313C0.809205 19.447 2.14258 21.9416 4.10051 23.8995C6.05845 25.8574 8.55301 27.1908 11.2687 27.731C13.9845 28.2712 16.7994 27.9939 19.3576 26.9343C21.9157 25.8747 24.1022 24.0803 25.6406 21.778C27.1789 19.4757 28 16.7689 28 14C28 13.5485 27.9755 13.1028 27.9335 12.663ZM14 25.6667C10.9058 25.6667 7.93835 24.4375 5.75043 22.2496C3.5625 20.0617 2.33334 17.0942 2.33334 14C2.33334 10.9058 3.5625 7.93835 5.75043 5.75042C7.93835 3.5625 10.9058 2.33333 14 2.33333H14.1983C14.6841 5.19838 16.049 7.84141 18.1038 9.89622C20.1586 11.951 22.8016 13.3159 25.6667 13.8017C25.6667 13.8682 25.6667 13.9335 25.6667 14C25.6633 17.0932 24.433 20.0586 22.2458 22.2458C20.0586 24.433 17.0932 25.6633 14 25.6667Z" fill="white"></path>
            </svg>
          </div>
          <div class="column is-7-tablet is-8-desktop">
            <h4 class="has-text-white mb-4 is-size-5" style="letter-spacing: -0.01em;">Cookie Consent</h4>

<section class="section has-background-white-ter" x-data="{ toggle: false }">
  <div class="container">
    <div class="has-mw-lg has-mw-2xl-widescreen mx-auto mb-20 has-text-centered">
      <h1 class="title mb-12 is-size-2 is-size-1-widescreen" style="letter-spacing: -0.04em;">Premium Membership</h1>
      <div class="is-flex-tablet is-align-items-center is-justify-content-center">
        <span class="is-block-mobile is-size-6" :class="{ 'has-text-dark': !toggle, 'has-text-grey': toggle }">Billed monthly</span>
        <div class="my-4-mobile mx-4-tablet is-inline-flex has-background-dark" style="padding: 2px; border-radius: 999px;">
            <button x-on:click="toggle = !toggle" class="button p-0" :class="{ 'is-light has-background-transparent': toggle, 'is-white': !toggle }" style="width: 26px; height: 26px; border-radius: 999px;"></button>
            <button x-on:click="toggle = !toggle" class="button p-0" :class="{ 'is-light has-background-transparent': !toggle, 'is-white': toggle }" style="width: 26px; height: 26px; border-radius: 999px;"></button>
        </div>
        <div class="is-block-mobile is-inline-flex-tablet is-align-items-center">
          <span class="mr-3 is-inline-block is-size-6" :class="{ 'has-text-dark': toggle, 'has-text-grey': !toggle }">Billed yearly</span>
          <span class="tag is-light is-size-7 px-3 py-1 is-inline-block has-text-dark">20% SAVE</span>
        </div>
      </div>
    </div>
    <div class="box p-0 has-mw-lg has-mw-3xl-desktop has-mw-5xl-widescreen mx-auto is-clipped">
      <div class="columns is-multiline">
        <div class="column is-12 is-6-desktop">
          <div class="px-8 pt-10 pb-24 is-covered" style=" height: 100%">
            <div class="has-mw-sm mx-auto px-6 px-0-widescreen has-text-centered">
              <span class="mb-2 is-block is-size-6 has-text-weight-medium has-text-dark">Starter plan</span>
              <h3 class="mb-4 is-size-2 has-text-dark" style="letter-spacing: -0.04em;">Free</h3>
              <span class="is-block has-text-grey mb-4">Switch to annual plan to save 15%</span>

<section class="section has-background-white-ter">
  <div class="container">
    <div class="columns is-multiline is-vcentered">
      <div class="column is-12-tablet is-5-desktop mb-20 mb-0-desktop">
        <div class="has-mw-lg">
          <span class="tag is-light mb-4 has-text-dark">Meet</span>
          <h2 class="title mb-10 is-size-2" style="letter-spacing: -0.02em;">Meet our partners</h2>
          <a class="button is-ghost px-0" href="#" style="height: 38px;">
            <span class="mr-3">I will become a sponsor</span>
            <svg class="is-rotate-45" width="10" height="11" viewbox="0 0 10 11" fill="none" xmlns="http://www.w3.org/2000/svg">
              <path d="M9 1.5L1 9.5" stroke="black" stroke-width="1.3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
              <path d="M9 8.83571V1.5H1.66429" stroke="black" stroke-width="1.3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
            </svg>
          </a>
        </div>
      </div>
      <div class="column is-12-tablet is-7-desktop">
        <div class="has-mw-xl-desktop ml-auto-desktop">
          <div class="columns is-mobile is-multiline">
            <div class="column is-4-tablet is-6-mobile">
              <div class="is-flex p-6-mobile p-8-tablet has-background-white is-justify-content-center is-align-items-center" style="border-radius: 20px; height: 114px">
                <img class="image is-block mx-auto" src="asitrastudio-assets/logo-clouds/netflix-medium.png" alt="">
              </div>
            </div>

<section class="section has-background-white-ter">
  <div class="container">
    <div class="has-mw-lg has-mw-none-desktop mx-auto">
      <div class="mb-20 mb-32-desktop columns is-multiline is-vcentered">
        <div class="column is-6">
          <h1 class="title is-size-2-mobile is-size-1-tablet mb-12" style="letter-spacing: -0.04em;">FAQ</h1>
        </div>
        <div class="column is-6 has-text-right">
          <a class="button is-outlined is-dark is-rounded" href="#">
            <span class="mr-2">Go to all questions</span>
            <svg class="is-rotate-45" width="10" height="11" viewbox="0 0 10 11" fill="none" xmlns="http://www.w3.org/2000/svg">
              <path d="M9 1.5L1 9.5" stroke="currentColor" stroke-width="1.3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
              <path d="M9 8.83571V1.5H1.66429" stroke="currentColor" stroke-width="1.3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
            </svg>
          </a>
        </div>
      </div>
      <div class="columns is-multiline">
        <div class="column is-12 is-4-desktop mb-6 mb-0-desktop">
          <div class="box px-6 px-10-tablet py-12 is-covered" style=" height: 100%">
            <h4 class="mb-8 is-size-5-mobile is-size-4-tablet has-text-dark">What if my business partner doesn&apos;t appear in search results when I try to add them as?</h4>
            <a class="button is-ghost px-0" href="#" style="height: 38px;">
              <span class="mr-2">Learn more</span>
              <svg class="is-rotate-45" width="11" height="11" viewbox="0 0 11 11" fill="none" xmlns="http://www.w3.org/2000/svg">

<section class="py-36 is-relative has-background-dark is-clipped">
  <img class="is-absolute is-top-0 is-left-0" style="object-fit: cover; width: 100%; height: 100%" src="asitrastudio-assets/cta/bg-cta-room.png" alt="">
  <div class="section py-0">
    <div class="container is-relative">
      <div class="has-mw-xl-desktop has-mw-3xl-widescreen mx-auto has-text-centered">
        <h1 class="title is-size-3-mobile is-size-1-tablet has-text-white mb-14" style="letter-spacing: -0.04em;">
          <span>Share your travels with</span>
          <span class="is-inline-block" style="line-height: 1; border-bottom: 3px solid white;">friends &amp; family</span>
        </h1>
        <a class="button is-white is-rounded" href="#">
          <span class="mr-2">Get consulation</span>
          <svg class="is-rotate-45" width="10" height="11" viewbox="0 0 10 11" fill="none" xmlns="http://www.w3.org/2000/svg">
            <path d="M9 1.5L1 9.5" stroke="black" stroke-width="1.3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
            <path d="M9 8.83571V1.5H1.66429" stroke="black" stroke-width="1.3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
          </svg>
        </a>
      </div>
    </div>
  </div>
</section>

<section class="section has-background-white-ter" style="overflow: hidden;">
  <div>
    <div class="container">
      <h1 class="title is-size-2-mobile is-size-1-tablet mb-20" style="letter-spacing: -0.04em;">Services</h1>
    </div>
    <div class="container is-fluid px-5">
      <div class="has-mw-lg has-mw-none-desktop mx-auto">
        <div class="columns is-multiline">
          <div class="column is-12 is-4-desktop p-0">
            <a class="button is-flex is-align-items-end is-justify-content-start pt-32 pt-52-tablet pt-80-desktop pb-10 pl-10 has-text-left has-text-weight-normal is-relative has-background-white" href="#" style="border-radius: 30px; height: 100%; white-space: normal;">
              <span class="my-8 px-7 is-absolute is-top-0 is-right-0 has-text-grey">01</span>
              <div>
                <span class="tag is-dark mb-4">Interior</span>
                <div class="has-mw-xs has-mw-md-mobile">
                  <span class="mb-6 is-block is-size-4 has-text-dark">De-risking your project</span>
                  <p class="mb-0 has-text-dark">We follow the RIBA Plan of Work 2020 to ensure an orderly framework and project clarity from the outset. First, we conduct feasibility studies and a project review.</p>
                </div>
              </div>
            </a>
          </div>
          <div class="column is-12 is-4-desktop p-0">
            <a class="button is-flex is-align-items-end is-justify-content-start pt-32 pt-52-tablet pt-80-desktop pb-10 pl-10 has-text-left has-text-weight-normal is-relative is-clipped is-covered" href="#" style="border-radius: 30px; height: 100%; white-space: normal;">
              <img class="is-absolute is-top-0 is-left-0 image is-fullwidth is-covered" style="object-fit: cover; height: 100%" src="asitrastudio-assets/services/photo-03.png" alt="">
              <span class="my-8 px-7 is-absolute is-top-0 is-right-0 has-text-white">02</span>

<section class="section has-background-dark">
  <div class="container">
    <div class="columns is-multiline">
      <div class="column is-12 is-6-widescreen is-7-fullhd mb-20 mb-0-widescreen">
        <div class="has-mw-xl mx-auto mx-0-fullhd">
          <span class="has-text-white is-size-7 is-block mb-4 has-text-weight-medium">Lorem Ipsum</span>
          <div class="has-mw-sm has-mw-md-tablet mb-12">
            <h1 class="title has-text-white is-size-2 is-size-1-tablet" style="letter-spacing: -0.04em;">Sign up for free weekly newsletter</h1>
          </div>
          <div>
            <div class="field is-flex-tablet is-justify-content-center">
              <div class="control is-fullwidth mr-0-mobile mr-3 mb-2 mb-0-tablet">
                <input class="input has-background-dark has-text-white" type="email" placeholder="Enter your email" style="border-color: #646464;">
              </div>
              <div class="control">
                <button class="button is-white is-fullwidth is-rounded" type="submit">Sign Up</button>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="column is-12 is-6-widescreen is-5-fullhd">
        <div class="columns is-multiline is-covered has-mw-xl mx-auto mx-0-fullhd" style=" height: 100%">
          <div class="column is-6">

<section class="section has-background-white-ter">
  <div class="container">
    <h1 class="title is-size-2-mobile is-size-1-tablet mb-20" style="letter-spacing: -0.04em;">Get started quickly</h1>
    <div class="columns is-multiline">
      <div class="column is-6">
        <div class="px-8 pt-16 pb-0 has-mw-md mx-auto has-mw-none-desktop is-flex has-background-dark is-flex-direction-column is-covered" style="border-radius: 40px; height: 100%">
          <div class="has-mw-sm mx-auto mb-auto has-text-centered">
            <span class="has-text-white mb-5 is-block">Apartament</span>
            <h3 class="has-text-white mb-6 is-size-3" style="letter-spacing: -0.02em;">Althhorpe Street Leamigton Spa</h3>
            <p class="mb-10 has-text-grey-light">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
            <a class="button is-outlined is-rounded is-light" href="#">
              <span class="mr-2">Get consulation</span>
              <svg class="is-rotate-45" width="10" height="11" viewbox="0 0 10 11" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M9 1.5L1 9.5" stroke="currentColor" stroke-width="1.3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
                <path d="M9 8.83571V1.5H1.66429" stroke="currentColor" stroke-width="1.3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
              </svg>
            </a>
          </div>
          <img class="mx-auto mt-20 is-block image mx-auto" src="asitrastudio-assets/features/frame-half1.png" alt="">
        </div>
      </div>
      <div class="column is-6">
        <div class="px-8 pt-16 pb-0 has-mw-md mx-auto has-mw-none-desktop is-flex has-background-dark is-flex-direction-column is-covered" style="border-radius: 40px; height: 100%">
          <div class="has-mw-sm mx-auto mb-auto has-text-centered">

<section class="section has-background-dark">
  <div class="container">
    <a class="mb-24 is-inline-block" href="#">
      <img src="asitrastudio-assets/logos/logo-asitra-white.svg" alt="">
    </a>
    <div class="has-mw-md mx-auto has-text-centered">
      <form action="">
        <h3 class="mb-10 is-size-4 has-text-weight-medium has-text-white" style="letter-spacing: -0.02em;">Sign up to asitrastudio</h3>
        <div class="mb-10">
          <input class="input mb-4 is-light has-text-white mb-4" type="text" placeholder="Full name" style="border-color: #494949;">
          <input class="input mb-4 is-light has-text-white mb-4" type="email" placeholder="E-mail" style="border-color: #494949;">
          <div class="mb-10 is-relative">
            <input class="input is-light has-text-white" type="password" placeholder="Password" style="border-color: #494949;">
            <button class="button is-light has-background-dark p-0 mt-5 mr-8 is-absolute is-top-0 is-right-0" style="height: auto;">
              <svg width="20" height="20" viewbox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M12.1095 7.89167L7.89283 12.1083C7.33367 11.5492 7.01953 10.7908 7.01953 10C7.01953 9.60845 7.09665 9.22073 7.24649 8.85898C7.39634 8.49723 7.61596 8.16854 7.89283 7.89167C8.1697 7.6148 8.49839 7.39518 8.86014 7.24533C9.22189 7.09549 9.60961 7.01837 10.0012 7.01837C10.7919 7.01837 11.5503 7.33251 12.1095 7.89167Z" stroke="white" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"></path>
                <path d="M14.8518 4.80834C13.3935 3.70834 11.7268 3.10834 10.0018 3.10834C7.06016 3.10834 4.31849 4.84167 2.41016 7.84167C1.66016 9.01667 1.66016 10.9917 2.41016 12.1667C3.06849 13.2 3.83516 14.0917 4.66849 14.8083M7.01849 16.275C7.96849 16.675 8.97682 16.8917 10.0018 16.8917C12.9435 16.8917 15.6852 15.1583 17.5935 12.1583C18.3435 10.9833 18.3435 9.00834 17.5935 7.83334C17.3185 7.4 17.0185 6.99167 16.7102 6.60834" stroke="white" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"></path>
                <path d="M12.9263 10.5833C12.8134 11.1646 12.5294 11.699 12.1106 12.1177C11.6919 12.5364 11.1576 12.8204 10.5763 12.9333M7.89297 12.1083L1.66797 18.3333M18.3346 1.66667L12.1096 7.89167" stroke="white" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"></path>
              </svg>
            </button>
          </div>
          <button class="button is-dark has-background-black-ter is-rounded is-fullwidth" type="submit">Sign up</button>
        </div>
        <div class="mb-6 is-flex is-align-items-center">

<section class="is-relative is-clipped">
  <div class="is-fixed is-bottom-0 is-left-0 is-fullwidth pt-8 pb-10" style="z-index: 50;">
    <div class="is-flex px-6 is-justify-content-center">
      <div class="py-8 px-10 has-background-dark is-rounded">
        <p class="has-text-white">Your settings have been saved</p>
      </div>
    </div>
  </div>
</section>

<section class="section has-background-white-ter" style="overflow: hidden;" x-data="{ showContent: false }">
  <div class="container">
    <div class="mb-20 columns is-multiline is-vcentered">
      <div class="column is-12 is-7-widescreen mb-8 mb-0-widescreen">
        <h1 class="title is-size-2-mobile is-size-1-tablet mb-8" style="letter-spacing: -0.04em;">Open Position</h1>
      </div>
      <div class="column is-12 is-5-widescreen has-text-right"><a x-on:click.prevent="showContent=true" :class="{ 'is-hidden': showContent }" class="button is-outlined is-dark is-rounded" href="#">View all open position</a></div>
    </div>
    <div class="columns is-multiline">
      <div class="column is-6-tablet is-4-widescreen">
        <a class="is-relative box p-10" style="height: 100%;">
          <div class="mb-4">
            <span class="tag is-light mr-3 has-text-dark">Full Time</span>
            <span class="tag is-light has-text-dark">Remote</span>
          </div>
          <div class="has-mw-xs">
            <h4 class="mb-20 is-size-4 has-text-dark">Product Manager, Instagram Camera</h4>
          </div>
          <span class="is-rotate-45 is-absolute is-bottom-0 is-left-0 m-10">
            <svg width="25" height="25" viewbox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg">
              <path d="M23 2L2 23" stroke="black" stroke-width="3.4125" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
              <path d="M23 21.2563V2H3.74375" stroke="black" stroke-width="3.4125" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
            </svg>
          </span>

<section class="section has-background-white-ter" x-data="{ showContent: false }">
  <div class="container">
    <div class="has-mw-3xl mx-auto mb-20 has-text-centered">
      <h1 class="title is-relative is-inline-block is-size-2 is-size-1-desktop" style="letter-spacing: -0.04em;">
        <span>Selected projects</span>
        <span class="is-absolute is-top-0 is-right-0 -mt-5 -mr-2 is-block is-size-4 has-text-grey has-text-weight-medium">(21)</span>
      </h1>
    </div>
    <div class="-mb-20 columns is-multiline">
      <div class="column is-12 is-6-desktop mb-20">
        <a class="is-block" href="#">
          <img class="mb-8 is-block image is-fullwidth" src="asitrastudio-assets/projects/photo-one-four2.png" alt="" style="border-radius: 40px;">
          <div>
            <div class="is-flex is-align-items-center">
              <span class="is-size-7 has-text-grey">Apartament</span>
              <span class="mx-4 mb-2 is-inline-block">
                <svg width="3" height="3" viewbox="0 0 3 3" fill="none" xmlns="http://www.w3.org/2000/svg">
                  <path d="M0.896 1.772C0.896 1.632 0.924 1.50133 0.98 1.38C1.036 1.25867 1.11067 1.15133 1.204 1.058C1.30667 0.955333 1.41867 0.876 1.54 0.82C1.67067 0.764 1.806 0.736 1.946 0.736C2.086 0.736 2.21667 0.764 2.338 0.82C2.46867 0.876 2.58067 0.955333 2.674 1.058C2.77667 1.15133 2.856 1.25867 2.912 1.38C2.968 1.50133 2.996 1.632 2.996 1.772C2.996 2.052 2.89333 2.29933 2.688 2.514C2.48267 2.72867 2.23533 2.836 1.946 2.836C1.65667 2.836 1.40933 2.72867 1.204 2.514C0.998667 2.29933 0.896 2.052 0.896 1.772Z" fill="#A5A5A5"></path>
                </svg>
              </span>
              <span class="is-size-7 has-text-grey">Girona, Spain</span>
            </div>
            <h3 class="mb-6 is-size-3">Althhorpe Street Leamigton Spa</h3>
            <p class="has-mw-xl has-text-grey">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters,</p>

<section class="section has-background-white-ter">
  <div class="container">
    <div class="columns is-multiline">
      <div class="column is-12 is-5-desktop mb-16 mb-0-desktop">
        <div class="has-mw-lg mx-auto mx-0-desktop">
          <h1 class="title is-size-2-mobile is-size-1-tablet mb-20" style="letter-spacing: -0.04em;">Let&grave;s talk</h1>
          <div class="mb-10 is-flex-tablet">
            <div class="is-flex is-justify-content-center is-align-items-center" style="border: 1px solid #CACACA; border-radius: 15.5px; width: 52px; height: 52px;">
              <svg width="24" height="24" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M8.5 19H8C4 19 2 18 2 13V8C2 4 4 2 8 2H16C20 2 22 4 22 8V13C22 17 20 19 16 19H15.5C15.19 19 14.89 19.15 14.7 19.4L13.2 21.4C12.54 22.28 11.46 22.28 10.8 21.4L9.3 19.4C9.14 19.18 8.77 19 8.5 19Z" stroke="black" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
                <path d="M15.9945 11H16.0035" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
                <path d="M11.9945 11H12.0035" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
                <path d="M7.99451 11H8.00349" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
              </svg>
            </div>
            <div class="mt-6 mt-0-tablet ml-6-tablet">
              <span class="mb-5 is-block is-size-6 has-text-weight-medium has-text-dark">Chat to us</span>
              <p class="mb-1 is-size-6 has-text-grey">Lorem Ipsum is simply dummy text of the</p>
              <span class="is-size-6 has-text-weight-medium has-background-white has-text-dark">contact@asitrastudio.co</span>
            </div>
          </div>
          <div class="mb-10 is-flex-tablet">
            <div class="is-flex is-justify-content-center is-align-items-center" style="border: 1px solid #CACACA; border-radius: 15.5px; width: 52px; height: 52px;">
              <svg width="24" height="24" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">

<section class="section has-background-white-ter">
  <div class="container">
    <div class="mb-20 columns is-mobile is-multiline">
      <div class="column is-12-mobile is-12-tablet is-4-widescreen mb-12 mb-0-widescreen">
        <a class="is-inline-block" href="#">
          <img class="image is-fullwidth" style="height: 21px;" src="asitrastudio-assets/logos/logo-asi.svg" alt="">
        </a>
      </div>
      <div class="column is-6-mobile is-3-tablet is-2-widescreen">
        <h5 class="mb-4 is-size-7 has-text-weight-medium has-text-grey">About</h5>
        <ul>
          <li class="mb-2"><a class="is-size-6 is-inline-block" href="#">Contact</a></li>
          <li class="mb-2"><a class="is-size-6 is-inline-block" href="#">Blog</a></li>
          <li class="mb-2"><a class="is-size-6 is-inline-block" href="#">Our Storry</a></li>
          <li>
            <a class="is-size-6 is-inline-block" href="#">
              <span class="mr-2">Careers</span>
              <span class="tag is-primary has-text-white px-2 py-1 is-uppercase" style="font-size: 12px;">Hiring</span>
            </a>
          </li>
        </ul>
      </div>
      <div class="column is-6-mobile is-3-tablet is-2-widescreen">
        <h5 class="mb-4 is-size-7 has-text-weight-medium has-text-grey">Company</h5>

<section class="section has-background-white-ter">
  <div class="container">
    <div class="has-mw-lg has-mw-none-desktop mx-auto">
      <h1 class="title is-size-2-mobile is-size-1-tablet mb-12" style="letter-spacing: -0.04em;">FAQ</h1>
      <div class="mb-20 columns is-multiline">
        <div class="column is-6">
          <div class="box px-6 px-12-tablet py-12" x-data="{ accordion: false }">
            <div class="is-flex">
              <div class="has-mw-sm">
                <span class="mb-3 is-block has-text-grey has-text-weight-medium">Question #1</span>
                <h4 class="title is-size-5">What if my business partner doesn&apos;t appear in search results when I try to add them as?</h4>
              </div>
              <div class="ml-auto is-align-self-center">
                <button x-on:click="accordion = !accordion" class="button p-0 is-rounded is-dark ml-4 is-flex-shrink-0" :class="{ 'is-outlined': !accordion }" style="width: 48px; height: 48px;">
                    <span :class="{ 'is-rotate-180': accordion, 'is-rotate-0': !accordion }" class="is-inline-block">
                        <svg width="18" height="18" viewbox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
                          <path d="M13.459 10.4893L9.21179 14.7365L4.9646 10.4893" stroke="currentColor" stroke-width="1.04955" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
                          <path d="M9.21094 2.84152L9.21094 14.6175" stroke="currentColor" stroke-width="1.04955" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
                        </svg>
                    </span>
                  </button>
              </div>
            </div>
            <div x-ref="container" :style="`transition: all 0.5s ease-in-out; ${accordion ? 'max-height: ' + $refs.container.scrollHeight + 'px' : 'max-height: 0px'}`" class="is-clipped">

<section class="section has-background-white-ter">
  <div class="container">
    <span class="tag is-light mb-4 has-text-grey-dark">About us</span>
    <div class="mb-20 columns is-multiline">
      <div class="column is-5-widescreen">
        <h2 class="has-mw-xl title is-size-3" style="letter-spacing: -0.02em;">KW70 Fix looks for markets and locations that have strong fundamental drivers.</h2>
      </div>
      <div class="column is-7-widescreen">
        <div class="has-mw-xl ml-auto-desktop">
          <p class="is-size-6 has-text-dark">
            <span>Headquartered in New York with offices in London, Chicago, Barcelona, Vienna, Rome, Las Vegas.</span>
            <span>KW70 Fix initiative seeks out regions and markets with robust underlying catalysts, and income growth, better quality of life and a business-friendly environment. In those carefully selected markets and locations, we bring the physical built environment that can transform communities.</span>
          </p>
        </div>
      </div>
    </div>
    <div>
      <ul>
        <li class="mb-8 pb-4 is-flex-tablet is-justify-content-space-between is-align-items-end has-text-dark" style="border-bottom: 1.5px solid #000000;">
          <span class="is-block">It is a long established</span>
          <span class="is-size-4">
            <span>20+ m</span>
            <sup class="ml-n2">2</sup>
          </span>

<section class="section has-background-light">
  <div class="container">
    <div class="has-mw-md has-mw-none-desktop has-mw-lg-tablet mx-auto">
      <div class="columns is-multiline is-vcentered">
        <div class="column is-12-tablet is-6-desktop is-7-widescreen mb-20 mb-0-desktop">
          <div class="has-mw-2xl">
            <span class="is-block mb-4 is-size-7 has-text-weight-medium has-text-dark">Lorem Ipsum</span>
            <h1 class="has-mw-xl title mb-12 is-size-2" style="letter-spacing: -0.02em;">Keep up with our contant</h1>
            <div class="-mx-6 columns is-multiline">
              <div class="column is-12 is-6-widescreen pt-0 pb-4 px-6">
                <div class="is-flex is-align-items-center mb-4">
                  <svg width="21" height="22" viewbox="0 0 21 22" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <rect y="0.5" width="21" height="21" rx="10.5" fill="black"></rect>
                    <path d="M15.7676 8.13463C15.4582 7.82482 14.9558 7.82501 14.646 8.13463L9.59787 13.183L7.35419 10.9393C7.04438 10.6295 6.54217 10.6295 6.23236 10.9393C5.92255 11.2491 5.92255 11.7513 6.23236 12.0611L9.03684 14.8656C9.19165 15.0204 9.39464 15.098 9.59765 15.098C9.80067 15.098 10.0039 15.0206 10.1587 14.8656L15.7676 9.25644C16.0775 8.94684 16.0775 8.44443 15.7676 8.13463Z" fill="white"></path>
                  </svg>
                  <span class="ml-4 has-text-dark">Core engagement survey</span>
                </div>
                <div class="is-flex is-align-items-center">
                  <svg width="21" height="22" viewbox="0 0 21 22" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <rect y="0.5" width="21" height="21" rx="10.5" fill="black"></rect>
                    <path d="M15.7676 8.13463C15.4582 7.82482 14.9558 7.82501 14.646 8.13463L9.59787 13.183L7.35419 10.9393C7.04438 10.6295 6.54217 10.6295 6.23236 10.9393C5.92255 11.2491 5.92255 11.7513 6.23236 12.0611L9.03684 14.8656C9.19165 15.0204 9.39464 15.098 9.59765 15.098C9.80067 15.098 10.0039 15.0206 10.1587 14.8656L15.7676 9.25644C16.0775 8.94684 16.0775 8.44443 15.7676 8.13463Z" fill="white"></path>
                  </svg>
                  <span class="ml-4 has-text-dark">Custom topic-based assessments</span>
                </div>

<section class="section has-background-white-ter">
  <div class="container">
    <h1 class="title mb-20 is-size-3-mobile is-size-2-desktop" style="letter-spacing: -0.02em;">Get started quickly</h1>
    <div class="columns is-multiline">
      <div class="column is-6 mb-8 mb-0-desktop">
        <div class="has-mw-md has-mw-none-desktop mx-auto px-8 pt-16 is-flex has-background-white is-flex-direction-column is-covered" style="border-radius: 40px; height: 100%">
          <div class="has-mw-sm mx-auto mb-auto has-text-centered">
            <span class="tag is-light mb-5 has-text-dark">Apartament</span>
            <h3 class="mb-6 title is-size-3" style="letter-spacing: -0.02em;">Althhorpe Street Leamigton Spa</h3>
            <p class="mb-10 has-text-grey">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
            <a class="button is-outlined is-dark is-rounded" href="#">
              <span class="mr-2">Get consulation</span>
              <svg class="is-rotate-45" width="10" height="11" viewbox="0 0 10 11" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M9 1.5L1 9.5" stroke="currentColor" stroke-width="1.3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
                <path d="M9 8.83571V1.5H1.66429" stroke="currentColor" stroke-width="1.3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
              </svg>
            </a>
          </div>
          <img class="mx-auto mt-20 is-block image mx-auto" src="asitrastudio-assets/features/frame-half1.png" alt="">
        </div>
      </div>
      <div class="column is-6">
        <div class="has-mw-md has-mw-none-desktop mx-auto px-8 pt-16 is-flex has-background-white is-flex-direction-column is-covered" style="border-radius: 40px; height: 100%">
          <div class="has-mw-sm mx-auto mb-auto has-text-centered">