<style>
  .bg-slate { background-color: #373f49; }
  .bg-ash { background-color: #f7f4ef; }
  .bg-bone { background-color: #fcfbf8; }

  .eyebrow {
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-size: 0.78rem;
    color: #8b7d6d;
    font-weight: 600;
  }

  .eyebrow-light {
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-size: 0.78rem;
    color: rgba(255,255,255,0.72);
    font-weight: 600;
  }

  .section-reading {
    font-size: 1.05rem;
    line-height: 1.9;
  }

  .hero-reading {
    font-size: 1.1rem;
    line-height: 1.9;
    max-width: 820px;
    color: rgba(255,255,255,0.88);
  }

  .quiet-rule {
    width: 72px;
    height: 1px;
    background: rgba(255,255,255,0.18);
    margin: 1.5rem 0;
  }

  .quiet-rule-dark {
    width: 72px;
    height: 1px;
    background: rgba(55,63,73,0.18);
    margin: 1.25rem 0;
  }

  .soft-card {
    background: #fff;
    border-radius: 1.15rem;
    box-shadow: 0 0.75rem 2rem rgba(0,0,0,0.05);
  }

  .portrait-wrap img {
    border-radius: 1rem;
    box-shadow: 0 0.75rem 2rem rgba(0,0,0,0.08);
  }

  /* STATIC HERO IMAGE */
  .hero-static-image {
    position: relative;
    background-image: url('$apphome/theme/images/bg-5.jpeg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    overflow: hidden;
  }

  .hero-static-image::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
      to bottom,
      rgba(28, 33, 39, 0.5),
      rgba(33, 39, 46, 0.44)
    );
    z-index: 1;
  }

  .hero-static-image > .container {
    position: relative;
    z-index: 2;
  }
</style>

<!-- HERO -->
<section class="py-5 hero-static-image text-white">
  <div class="container">
    <p class="eyebrow-light mb-3">About</p>

    <h1 class="display-5 fw-semibold mb-4">
      Navigating the Abyss
    </h1>

    <div class="quiet-rule"></div>

    <p class="hero-reading mb-0">
      Within a single life, we often live many.
      <br><br>
      The moments where one life ends and another begins tend to define us.
      <br><br>
      This work begins in those moments — when something breaks open, when what once held no longer does, and when we are brought into contact with something deeper than we know how to name.
    </p>
  </div>
</section>
<!-- THE CROSSING -->
<section class="py-5 bg-bone">
  <div class="container">
    <div class="row justify-content-center">
      <div class="col-lg-8">

        <p class="eyebrow mb-2">The crossing</p>
        <h2 class="fw-semibold mb-4">A life does not change all at once.
        </h2>

        <div class="quiet-rule-dark"></div>

        <div class="section-reading">
          <p>
            I began my career as a naval officer and engineer, working in integrated systems. I chose that path out of a desire to understand how the world is built, and to experience it directly.
          </p>

          <p>
            From the outside, it was successful. From the inside, something was increasingly off. A sense of misalignment grew slowly, then insistently — not dramatic at first, but undeniable over time.
          </p>

          <p>
            After 18 years, I left.
          </p>

          <p>
            That decision did not resolve anything. It initiated something.
          </p>

          <p>
            What followed was not clarity, but a long period of uncertainty, instability, and descent into what I can only describe as the unknown. If I had understood the scale of it at the beginning, I may not have stepped forward.
          </p>

          <p class="mb-0">
            But that is often how this kind of work begins — not with certainty, but with willingness.
          </p>
        </div>

      </div>
    </div>
  </div>
</section>

<!-- PORTRAIT -->
<section class="py-4 bg-bone">
  <div class="container">
    <div class="row align-items-center justify-content-center g-4">
      
      <div class="col-md-5 col-lg-4 portrait-wrap">
        <img 
          src="/skyinside/theme/images/brekke.jpeg" 
          class="img-fluid"
          alt="Brekke Beyer"
        >
      </div>

      <div class="col-md-7 col-lg-5">
        <p class="eyebrow mb-2">The work is lived</p>
        <p class="section-reading mb-0">
          This work does not come from theory alone. It comes from lived experience, prolonged uncertainty, and sustained engagement with what cannot be resolved quickly.
        </p>
      </div>

    </div>
  </div>
</section>

<!-- THE ABYSS -->
<section class="py-5 bg-white border-top">
  <div class="container">
    <div class="row justify-content-center">
      <div class="col-lg-8">

        <p class="eyebrow mb-2">The Abyss</p>
        <h2 class="fw-semibold mb-4">Not something we seek, but something we enter.</h2>

        <div class="quiet-rule-dark"></div>

        <div class="section-reading">
          <p>
            The Abyss is not just difficulty, grief, or uncertainty. It is the lived experience of encountering what we do not understand — within ourselves and within life — and no longer being able to avoid it.
          </p>

          <p>
            It is where the structures we relied on begin to fall away, and where our usual ways of making sense no longer hold.
          </p>

          <p>
            Crossing the Abyss means becoming conscious of what has been operating unconsciously. It means learning how to relate to the forces, patterns, and intelligences that shape our thoughts, emotions, and actions.
          </p>

          <p class="mb-0">
            We do not cross it once. We learn how to navigate it.
          </p>
        </div>

      </div>
    </div>
  </div>
</section>

<!-- SPIRIT / WILL -->
<section class="py-5 bg-ash border-top">
  <div class="container">
    <div class="row justify-content-center">
      <div class="col-lg-8">

        <p class="eyebrow mb-2">What is at stake</p>
        <h2 class="fw-semibold mb-4">Attention, will, and sovereignty.</h2>

        <div class="quiet-rule-dark"></div>

        <div class="section-reading">
          <p>
            Much of what directs our lives operates outside of our awareness. We act, react, choose, and repeat patterns without fully understanding what is moving us.
          </p>

          <p>
            This work is concerned with changing that.
          </p>

          <p>
            Spirit, as I use the term, refers to the living intelligence within experience — the forces that move through thought, feeling, environment, and relationship.
          </p>

          <p>
            Becoming aware of this is not about adopting a belief system. It is about participation.
          </p>

          <p class="mb-0">
            As awareness develops, so does responsibility. And with that responsibility comes the possibility of sovereignty — the capacity to choose consciously, rather than be unconsciously driven.
          </p>
        </div>

      </div>
    </div>
  </div>
</section>

<!-- HOW THE WORK HAPPENS -->
<section class="py-5 bg-white border-top">
  <div class="container">
    <div class="row justify-content-center">
      <div class="col-lg-8">

        <p class="eyebrow mb-2">How the work happens</p>
        <h2 class="fw-semibold mb-4">Working with what we cannot see directly.</h2>

        <div class="quiet-rule-dark"></div>

        <div class="section-reading">
          <p>
            The unconscious contains the patterns, memories, influences, and dynamics that shape our experience. It is not empty — it is active.
          </p>

          <p>
            In shamanic practice, we work directly with this layer of reality, often through relationship with helping spirits — intelligences that are not bound by the same limitations we are.
          </p>

          <p>
            These are not authorities that override our will. They are sources of clarity, perspective, and support.
          </p>

          <p class="mb-0">
            The aim is not to be told what to do, but to learn how to see clearly enough to choose.
          </p>
        </div>

      </div>
    </div>
  </div>
</section>

<!-- CONTEXT -->
<section class="py-5 bg-bone border-top">
  <div class="container">
    <div class="row justify-content-center">
      <div class="col-lg-8">

        <p class="eyebrow mb-2">Context</p>
        <h2 class="fw-semibold mb-4">A life lived in motion.</h2>

        <div class="quiet-rule-dark"></div>

        <div class="section-reading">
          <p>
            My work is remote. My husband and I live aboard a 42-foot ocean-going sailboat, moving between places and working from wherever we anchor.
          </p>

          <p>
            It is a life that appears romantic from the outside, but in practice demands constant adjustment, problem-solving, and presence.
          </p>

          <p class="mb-0">
            That is part of why I live this way. It keeps the work grounded, real, and continuously tested against the conditions of actual life.
          </p>
        </div>

      </div>
    </div>
  </div>
</section>

<!-- ROOTS -->
<section class="py-5 bg-white border-top">
  <div class="container">
    <div class="row justify-content-center">
      <div class="col-lg-8">

        <p class="eyebrow mb-2">Roots</p>
        <h2 class="fw-semibold mb-4">Where this work is rooted.</h2>

        <div class="quiet-rule-dark"></div>

        <div class="section-reading">
          <p>
            My work draws from multiple lineages, both human and spiritual.
          </p>

          <p>
            Core shamanism, as developed by Michael Harner, provides an important foundation — particularly in its emphasis that access to helping spirits is available to all, and that direct experience is primary.
          </p>

          <p class="mb-0">
            Over time, the work has also been shaped by lived experience, direct practice, and the necessity of learning through what life itself requires.
          </p>
        </div>

      </div>
    </div>
  </div>
</section>

<!-- CTA -->
<section class="py-5 bg-slate text-white border-top">
  <div class="container text-center">
    <p class="eyebrow-light mb-2">Next</p>
    <h2 class="fw-semibold mb-4">If this resonates, there are a few ways forward.</h2>
    <p class="text-soft mx-auto mb-4" style="max-width: 700px;">
      You can begin with the writing, learn more about the work, or explore the forms it takes in practice.
    </p>

    <div class="d-flex justify-content-center gap-3 flex-wrap">
      <a href="/skyinside/views/blog/" class="btn btn-light btn-lg">Read the Writings</a>
      <a href="/skyinside/services.html" class="btn btn-outline-light btn-lg">Explore Offerings</a>
    </div>
  </div>
</section>