index-main/assets/css/template/_investigation_content.scss

#investigation__content {

    padding-top: calc(var(--spacing) * 4);
 
  

    .section-title-only{
        margin-bottom: 0;
    }


    

    .section-txt{
            max-width: var(--max-w-content);
            margin-inline: auto;

           
    }




      .subsection-txt .insert{
        margin-top: calc(var(--spacing)*2);
        margin-bottom: calc(var(--spacing)*2);
        padding: calc(var(--padding-inner)*2) calc(var(--padding-inner)*1.5);
    }


      .subsection-txt {
        max-width: var(--max-w-content);
    }



    @media #{$small-up}{

          .section-content {
        margin-bottom: calc(var(--spacing)*4);
    }

        .subsection-w-media{
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: var(--padding-body);
        position: relative;


            .media{
                margin-inline: auto;
                max-width: var(--max-w-content);
                min-width: 0;

                position: sticky;
                top: calc(var(--header-h) + var(--spacing));
                align-self: start;

                     @media #{$medium-up}{
                padding-left: var(--padding-inner);
                padding-right: var(--padding-inner);
                }
            }

        }

          .subsection-txt {
            min-height: calc(100vh - var(--header-h));
            padding-left: var(--padding-inner);
            padding-right: var(--padding-inner);
            padding-bottom: calc(var(--spacing)*6);
          }

    }


     @media #{$small}{

          .section-content:not(.section-title-only) {
            padding-bottom: calc(var(--spacing)*1);
        margin-bottom: calc(var(--spacing)*2);
        border-bottom: var(--border-light);
    }

        .section-title-only{
            margin-bottom: calc(var(--spacing)*1.5);
        }
        .media{
            margin-bottom: calc(var(--spacing)*2);
         }  
         
         h3{
                margin-top: calc(var(--spacing)*3);
             margin-bottom: calc(var(--spacing)*1.5);
             font-size: 1.35em;
         }

         h4{
            margin-top: calc(var(--spacing)*3);
            margin-bottom: calc(var(--spacing)*1);
             font-size: 1em; 
         }

        h4, h5{
             margin-top: calc(var(--spacing)*3);
            margin-bottom: calc(var(--spacing)*1);
         }

         .subsection-txt  .insert{
             margin-top: calc(var(--spacing)*1.5);
         }
        }
    


  
    .subsection-w-hscroll{
        position: relative;
        margin-bottom: calc(var(--spacing)*4);

        .horizontal-scroll{
            height: 100vh;
            width: 100vw;
            overflow: hidden;
            display: flex;
            align-items: center;
        }

        .horizontal-scroll-wrapper{
            display: flex;
            flex-wrap: nowrap;
            will-change: transform;
        }

        .horizontal-scroll-slide{
            flex-shrink: 0;
            width: 90vw;
            max-width: 700px;
            padding: 0 calc(var(--spacing) * 1);

            figure, img{
                width: 100%;
            }
        }

        .horizontal-scroll-pagination{
            position: fixed;
            bottom: calc(var(--spacing) * 2);
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            gap: 8px;
            z-index: 10;
        }

    }



  


    .insert--inner > :last-child{
           margin-bottom: 0px;
    }
    .insert--inner > :first-child,
    .subsection-txt > :first-child,
    .section-content > :first-child{
            margin-top: 0px;
        }
}

.investigation__content:target {
    padding-top: calc(var(--header-h)*2 + var(--spacing)) !important;
}


.media{

    video{
        width: 100%;
    }

    figure{
        height: auto;
    }


}