#section__content{


      h1, h2, h3 {
        &::before{
            content: attr(data-counter);
        }
    }

    h4, h5, h6{
        &::before{
            content: attr(data-counter) ". ";
        }
    }

    h1, h2, h3 {
        break-inside: avoid;
        break-after: avoid;

        /* hack for avoiding break-after */
        margin-bottom: calc(var(--baseline)*-3);
        &::after{
            content: '';
            display: block;
            height: calc(var(--baseline)*3);
            // background-color: rgba(255, 255, 0, 0.595);
        }
    }

     h4, h5, h6 {
        break-inside: avoid;
        break-after: avoid;

        /* hack for avoiding break-after */
        margin-bottom: calc(var(--baseline)*-2);
        &::after{
            content: '';
            display: block;
            height: calc(var(--baseline)*2);
            // background-color: rgba(255, 255, 0, 0.595);
        }
    }


    h1 + ol + p,
    h2 + ol + p,
    h3 + ol + p,
    h4 + ol + p,
    h5 + ol + p,
    h6 + ol + p{
        text-indent: 0;
    }

    h1{
        font-family: var(--font-title);
        text-transform: uppercase;
        font-weight: var(--w-title);

        font-size: 1.4rem;
        line-height: calc(var(--baseline)*1.4);
        text-align: center;
        position: relative;
        margin-top: calc(var(--baseline)*3 - 3px);
        padding-bottom: calc(var(--baseline)*1);
        padding-left: 1ch;
        padding-right: 1ch;
        &::before{
            display: block;
            font-size: 1rem;
            
        }
    }

    h1:first-of-type{
        margin-top: 3px!important;
    }


    

    h2{
        font-family: var(--font-title);
        text-transform: uppercase;
         font-weight: var(--w-title);

        font-size: 1.2rem;
        line-height: calc(var(--baseline)*1.2);

        text-align: right;
        padding-left: 3ch;
        position: relative;
        margin-top: calc(var(--baseline)*1 + 9px);
        padding-bottom: calc(var(--baseline)*1);
        &::before{
            position: absolute;
            left: 0;
        }
    }

    h3{
        font-family: var(--font-sans);
         font-weight: var(--w-title);
        font-size: 1rem;
        line-height: calc(var(--baseline)*1);

        text-align: right;
        padding-left: 3ch;
        position: relative;
        margin-top: calc(var(--baseline)*1 + 9px);
        padding-bottom: calc(var(--baseline)*1);
        &::before{
            // font-family: 'Helixotrope 4';
            // font-size: var(--font-size);
            // font-weight: bold;
            position: absolute;
            left: 0;
        }
    }

    h4{
        font-family:  var(--font-sans);
         font-weight: var(--w-title);
        font-size: 0.8rem;
        line-height: calc(var(--baseline)*1);

        text-align: right;
        padding-left: 3ch;
        position: relative;
         margin-top: calc(var(--baseline)*0.5);
        padding: calc(var(--baseline)*0.5);
      
    }


    h5{
        font-family:  var(--font-sans);
         font-weight: var(--w-title);
        font-size: 0.7rem;
        line-height: calc(var(--baseline)*1);
        position: relative;
        margin-top: calc(var(--baseline)*0.75);
        padding-bottom: calc(var(--baseline)*0.25);
       
    }

    

}

[data-id="section__content"][data-split-from] > :first-child {
        margin-top: 0;
}