@charset "UTF-8";
@layer reset,common,page,publications,spec,respo,print;
@import url('_reset.css') layer(reset);
@import url('_common.css') layer(common);
@import url('_page-header.css') layer(page.header);
@import url('_page-footer.css') layer(page.footer);
@import url('_publications.css') layer(publications);
@import url('_spec.css') layer(spec);
@import url('_respo.css') layer(respo);
@import url('_print.css') layer(print);

@layer page.hero {

  #hero {

    margin-top: -2em; /* csak felül lehet */

    .inner {
      display: grid;
      padding: 2em 0;
      gap: 0;

      &:has(figure) {
        grid-template-columns: 1fr 1fr;
      }
    }
    .txt {
      padding: 0 var(--gap);
      display: grid;
      gap: 1.6em;
      font-weight: 700;
      align-self: start;
    }

    &.bg-white {
        @container pw-root (width > 58rem) {
            .txt {
              padding-left: 0;
            }
        }
    }

    p {
      max-width: 50em;
    }
    hr {
      margin: -1em -2em 0;
      background: var(--brown-light);
    }
    &:not(:has(figure)) {
      hr {
        width: calc(100% + 4em);
      }
    }
    ul {
      padding-left: 2ex;
      display: grid;
      gap: 1em;

      li {
        list-style-type: disc;
        padding-left: 1ex;
      }
    }
    img {
      height: 100%;
      object-fit: cover;
    }
    &:is(.bg-grys, .bg-grys-light, .bg-grys-pale) {
      color: var(--nmhh-dark);
      hr {
        background: var(--brown-light);
        mix-blend-mode: multiply;
      }
    }
    &:is(.bg-grys, .bg-brown, .bg-brown-light, .bg-grys-light, .bg-grys-pale, .bg-brown-pale) {
      .txt {
        mix-blend-mode: multiply;
      }
    }
  }

}/* / page.hero */













 /* ARTICLE */
@layer page.article {

  @keyframes grid-expand {
      from {
        grid-template-rows: 0fr;
      }

      to {
        grid-template-rows: 1fr;
      }
    }

    .pw-article {

      --bleed: 1.5em;
      overflow: initial; /*sticy végütt*/

      &:not(:has(aside)) .inner{
        grid-template-columns: auto;
      }

      article {
        container: article / inline-size;
        width: 100%;
        max-width: 50em;
        justify-self: center;
        display: grid;
        align-content: baseline;
        gap: 1.5em;
        hyphens: auto;
        position: relative;

        hgroup, h1, h2 {
          hyphens: none;
        }

        ul, ol {
          padding-left: 2em;
          li {padding-left: 1ex;}
        }
        ul li {list-style-type: disc;}
        ul li ul li{list-style-type: square;}
        ul li ul li ul li {list-style-type: circle;}
        ol li {list-style-type: decimal;}
        ol.roman li {list-style-type: lower-roman;}
        ol.roman-caps li {list-style-type: upper-roman;}
        ol.alpha li {list-style-type: lower-alpha;}
        ol.alpha-caps li {list-style-type: upper-alpha;}

        .table-of-contents ol li, ol.toc-like li {list-style-type: none;}
        .numbered-toc ol, ol.toc-like, ol.toc-like ol {
          counter-reset: toc-num;

          li::before {
              content: counters(toc-num, ".") ". ";
              counter-increment: toc-num;
              margin-right: 1ex;
            }

        }

        b, strong {
          font-weight: 700;
        }
        i, em {
            font-style: italic;
        }

        dt {font-weight: 700;}
        dd {padding: 0 0 calc(var(--phi) * 1em) var(--gap);}

        a:not(.pw-buttonlike-link a, .pw-article-cat, .lang, .pw-card a, .doc, .table-of-contents a) {
        color: inherit;
        text-decoration: underline;
        text-decoration-color: var(--brown-contrast);
        text-decoration-thickness: 2px;
        text-underline-offset: 0.2em;

        &:hover {
          background: var(--brown-pale);
          transition: .3s;
        }
       }
        a[href^="http"]:not(.pw-card a, .pw-buttonlike-link a, a[data-tooltip])::after {
            content: "";
            width: 1em;
            height: 1em;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' stroke-width='2.1' fill='none' stroke='%23393d47' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 12 8-8m-7 0h7v7m-1 5v2a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V7c0-1.1.9-2 2-2h2'/%3E%3C/svg%3E");
            display: inline-block;
            margin-left: .25ex;
        }



        .pw-address {

          border: 1px solid var(--grys);
          padding: 1em;
          text-align: center;
          margin: 0 4cqw;
          line-height: 2;

          .icon {
            width: 1.5em;
            height: 1.5em;
            vertical-align: middle;
            margin-right: 1ex;
            color: var(--grys-dark);
          }

        }

        h2:not(dialog h2) {

          border-bottom: 1px solid var(--brown-light);
          color: var(--nmhh-dark);

          @container pw-root (width > 75rem) {
              margin: 0 calc(-1 * var(--bleed));
              padding: 0 var(--bleed);
          }

          a {
            text-decoration: none !important;
            background: #0000 !important;

            &:hover{
              color: var(--brown-contrast);
            }
          }
        }
        .pw-box-header{
          border: 0;
          margin-bottom: 1em;
          }

          .pw-box .pw-buttonlike-link {
              margin-top: 1.5em;
          }

      }/* /article */

      & > .pw-buttonlike-link {
          margin-top: 1.5em;
      }

      .program {

        display: grid;
        grid-template-columns: auto 1fr;
        gap: 0 1em;

        dt {
          grid-column: span 2;
          display: grid;
          grid-template-columns: subgrid;

          &:not(:first-of-type) {
            margin-top: 1em;
          }
        }
        dd {
          grid-column: 2;
          padding: 0;
        }
        time {
          letter-spacing: 2%;
        }
      }

      .accordion {

        margin: 1em 0;

        header {margin: 1em 1.5em 0;}

         .accordion-title {
          font-size: calc(var(--phi)*1em);
         }

         .accordion-lead {
          font-weight: 500;
          margin : 1em 0;
         }

        details {
            background: var(--header-bg);
            position: relative;
            border-bottom: 1px solid var(--brown-light);
            padding: 1em min(1em,1vw) 1em 1.5em;
            display: grid;
            gap: 0;
            transition: .5s;
          }

        summary {
            cursor: pointer;
            list-style: none;
            padding: 0 0 .1em 0;
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-weight: 666;
            &::marker {display: none;}

            &:hover {
              text-decoration: underline;
              text-decoration-color: var(--grys);
              text-decoration-thickness: 2px;
              text-underline-offset: 4px;

              &::after {
                border-color: var(--brown-contrast);
              }
            }

            &::after {
              content: "";
              width: 8px;
              min-width: 8px;
              height: 8px;
              background: #0000;
              border: solid var(--grys);
              border-width: 0 3px 3px 0;
              transition: .5s;
              transform: rotate(45deg);
              margin: .5em;
            }

            h2 {
              font: inherit;
              border: 0;
              margin: inherit;
              padding: inherit;
              font-weight: 700;
            }
          }

        .expander {
          display: grid;
          overflow: hidden;
          grid-template-rows: 0fr;
          transition: 0.666s;
        }

        .content {
          min-height: 0;
        }


          /*OPEN*/

            details[open] {

                background: #fff;
                gap: 1em;

              .expander {
                grid-template-rows: 1fr;
                animation: grid-expand 0.666s 0s 1 normal forwards;
              }

              summary {

                &::after {
                    transform: rotate(-135deg);
                  }
              }
            }

      }/* /ACCORDION */





      aside {

        display: grid;
        gap: 2em;
        align-self: start;

        &:has(nav:only-child) {
          position: sticky;
          top: var(--header-height);
          z-index: 1;

          &:has([aria-expanded="true"]) {
              z-index: 2;
          }
        }


        h2 {
          border-bottom: 1px solid var(--brown-light);
          margin: 0 0 1em 0;
          padding: 2px 10px;
          font-family: inherit;
          font-size: 1.125em;
        }

        nav {
          header {
            position: relative;
          }
          .toggler {
            background: #0000;
            border: 0;
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
            text-align: right;
            color: inherit;
            padding: 1ex 1em;
            border: 1px outset var(--header-bg);

            .icon {
              height: 100%;
              aspect-ratio: 1;
            }

            display: none;
          }
          .toglee[aria-expanded="true"] {
            transform: none !important;
          }

        }
      }

      .pw-buttonlike-link a {
        margin: 0;
        hyphens: none;
      }

      .pw-box {
        display: flex;
        flex-direction: column;
      }
      .pw-box-header {
        padding: 0;
        margin: 0;
        border: 0;

        h2 {
          color: var(--nmhh-dark);
        }
      }
    } /* / .pw-article */


    .author {
      flex: 1;
      display: flex;
      align-items: center;
      gap: 1ex;
      font-weight: 600;
      min-height: 100%;

      .icon {
        width: 1.5em;
        height: 1.5em;
        min-width: 1.5em;
      }
    }

    .pw-article-table {
      overflow-x: auto;
      container: article-table / inline-size;
      font-size: var(--rem);
    }
    figcaption {
        font-size: var(--rem);
    }

    .pw-article-kiemelt {
      padding: 1em 1.5em;
      border-left: 4px solid var(--brown-contrast);

      &.dark {
        border-color: var(--nmhh-dark);
      }
    }



    /* öreg cuccok */
    .publication-block {

      padding: 1em 1.5em;
      background: var(--header-bg);
      color: oklch(from var(--nmhh-dark) calc(l - .04) c h);
      border-left: 4px solid var(--grys-light);

      .header {
        font-size: 1.31em;
        margin-bottom: .69em;
      }
      &.lead {
        background: #fff;
        color: var(--nmhh-dark);
        padding: 0;
        border: 0;
      }
      &.line {
        background: var(--brown-pale);
        color: oklch(from var(--nmhh-dark) calc(l - .06) c h);
        border-left: 4px solid var(--brown-contrast);
      }
      &.textlike {
        background: #fff;
      }
      &.dark {
        background: var(--nmhh-dark);
        color: #fff;
      border-color: oklch(from var(--nmhh-dark) calc(l - .12) c h);
    }
    }




    blockquote.publication-block {

      background: var(--grys-pale);
      border: 0;
      padding: 3em;
      position: relative;
      color: oklch(from var(--nmhh-dark) calc(l - .07) c h);

      p+p {
        margin-top: 1em;
      }

      .header {
        margin-top: -.5em;
      }

      &::before,
      &::after {
        font: 900 9em Georgia, Times, 'Times New Roman', serif;
        line-height: 1;
        color: #fff;
        position: absolute;
      }

      &::before {
        left: 0;
        bottom: 0;
      }

      &::after {
        right: 0;
        top: -18px;
      }

    figcaption {
      padding: 1em 3em 0;
      text-align: right;
    }

    cite {
      font-size: .809rem;
      font-weight: 400;
      text-align: right;
      display: block;
      margin-top: 1em;
    }
    }

        .publication-list {
          display: grid;
          gap: 1em;
          padding: 0 !important;
        }

        .publication-list li {
          position: relative;
          padding-left: 3.5rem !important;
          list-style-type: none !important;
        }

        .publication-list li:before {
          position: absolute;
          left: 0;
          top: 0;
          bottom: 0;
          font-weight: 700;
          content: "";
          background: var(--grys-light);
          color: var(--nmhh-dark);
          width: 2.5rem;
          border-radius: 3px;
          align-content: center;
          text-align: center;
          mix-blend-mode: difference;
        }

        ol.publication-list {
          counter-reset: list-num 0;
        }

        ol.publication-list li {
          counter-increment: list-num 1;
        }

        ol.publication-list li::before {
          content: counter(list-num);
        }

        ol.publication-list.roman li::before {
          content: counter(list-num, lower-roman);
        }
        ol.publication-list.roman-caps li::before {
          content: counter(list-num, upper-roman);
        }
        ol.publication-list.alpha li::before {
          content: counter(list-num, lower-alpha);
        }
        ol.publication-list.alpha-caps li::before {
          content: counter(list-num, upper-alpha);
        }

        .dark ol.publication-list li::before {
          ccolor: #fff;
        }



    .publication-leftimage, .publication-pictures {
      display: grid;
      gap: 1.5em;
    }
    .publication-leftimage {
      grid-template-columns: 1fr 1.5fr;

      figure {
          display: flex;
          flex-direction: column;
      }

      img {
          width: 100%;
          height: 100%;
          object-fit: cover;
        }

      p + p {margin-top: 1.5em;}

      @container article (width < 40rem) {
          grid-template-columns: 1fr;
        }
    }
    .publication-pictures {
      grid-template-columns: repeat(auto-fit, minmax(19em, 1fr));
      padding: 1.5em 0;

      img {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    }
    /* / öreg cuccok */


    .pw-article-box {
      &.wide {
        margin: 0 max(calc(-1 * var(--bleed)) , calc(-.5 * (100cqw - var(--inner-width))) );
      }
      &.indented {padding-left: 5em;}
      &.twocols {
          @container article (width > 30rem) {
              columns: 2;
              column-gap: var(--gap);
              column-fill: balance;

              li, p, h2, h3, h4 {
                break-inside: avoid;
              }
          }
      }
    }
    .pw-article-header, .pw-article-footer {
      display: grid;
      gap: 1.5em;
    }
    .pw-article-header {

      margin-bottom: 1em;

      .title {
       display: flex;
       gap: 1em;
       align-items: start;
       justify-content: space-between;
      }
      [aria-roledescription="subtitle"] {
        margin-bottom: 0;
      }
      .icons {
        display: flex;
        gap: .5em;
        margin-top: 2px;
      }
       .bottom {
         /*padding-left: 1.8em;*/
         /*align-items: baseline;*/
         align-items: start;
         justify-content: end;
         gap: 1ex;
          }
      .place, .date {
        position: relative;
        flex: 1 50%;
        .icon {
          position: absolute;
          width: 1.5em;
          aspect-ratio: 1;
          left: -2em;
          color: var(--grys-mid);
        }
      }


      @container article (width > 30rem) {
        &.over {
            hgroup {position: relative;}
            .title {
            position: absolute;
            bottom: 1ex;
            left: 1ex;
            width: calc(100% - 2ex);
            padding: 1ex 1em;
            color: #fff;
            background: rgb(from var(--nmhh-dark) r g b / 0.666);
            backdrop-filter: blur(24px);

            h2 {
                color: inherit;
            }

            .lang, .lang::before {
                background: #fff;
                color: var(--nmhh-dark);
                &:hover {
                color: var(--brown-contrast);
                box-shadow: 0 0 0 2px var(--brown);
                }
            }
            }
        }
      }

      @container article (width < 50rem) {
        .bottom {
          padding-left: 2em;
        }
      }

    }/* / .pw-article-header */


    .pw-article-icon {
        width: 2.5em;
        aspect-ratio: .9;
        display: grid;
        align-items: center;
        justify-items: center;
        background: var(--nmhh-dark);
        color: #fff;
        border-radius: .5em;

         svg {
          width: 1.6em;
         }

         &.lang {
          color: #fff;
          text-decoration: none;
          text-transform: uppercase;
          font-weight: 700;
          letter-spacing: 2%;
          position: relative;

          &::before {
            content: '';
            position: absolute;
            width: 1ex;
            height: 1ex;
            background: var(--nmhh-dark);
            clip-path: polygon(0 0, 0% 100%, 100% 0);
            bottom: -1ex;
            left: 50%;
          }

          &:hover {
            background: var(--brown-contrast);
            &::before {
              background: var(--brown-contrast);
              transition: .3s;
            }
          }
         }
        }
    .pw-article-footer {
      margin-top: 3em;
      .top {gap: 1em;}
      hr {
        width: 100%;
        background: var(--grys-light);
      }
    }
    .top, .bottom {
      display: flex;
      justify-content: space-between;
    }
    .top {
      align-items: center;
    }
    .pw-article-cats {
        display: flex;
        flex-wrap: wrap;
        gap: 1ex;
      }
    .pw-article-date {
      color: var(--grys-dark);
    }
    .pw-article-cat {
      font-size: 0.8125em;
      font-weight: 500;
      background: var(--brown-contrast);
      color: #fff;
      letter-spacing: 1%;
      display: inline-block;
      padding: .8ex 1em 1ex;
      white-space: nowrap;

      &:hover {
        background: var(--nmhh-dark);
        transition: .3s;
      }

      &.light {
        background: #fff;
        color: var(--brown-contrast);
        border: 1px solid currentColor;
        white-space: wrap;

        /*flex-grow: 1;*/
        max-width: 34em;
        display: grid;
        justify-content: center;
        align-content: center;

        &:hover {
          color: var(--nmhh-dark);
          transition: .3s;
        }
      }
    }
    .pw-quote {

      background: var(--grys-pale);
      padding: 1.5em;
      border-radius: 4px;
      position: relative;

      blockquote {

        padding: 0 3em;

        p+p {margin-top: 1em;}

        &::before, &::after {
          font: 900 6em Georgia, Times, 'Times New Roman', serif;
          line-height: 1;
          color: #fff;
          position: absolute;
        }
        &::before {
          left: 8px;
          bottom: 8px;
        }
        &::after {
          right: 8px;
          top: 0;
        }
      }
      figcaption {
        padding: 1em 3em 0;
        text-align: right;
            }
    }

    .pw-image {

      position: relative;
      color: var(--grys-dark);
      display: grid;
      gap: .5em;

      img {
        width: 100%;
      }

      a:hover .pw-image-icon {
        color: var(--nmhh-dark);
        transition: .3s;
        box-shadow: 0 0 0 4px #0004;
      }
    }
    .pw-image-icon {
      position: absolute;
      background: #fff;
      box-shadow: 0 0 0 4px #0001;
      font-weight: 500;
      top: 1em;
      right: 1em;
      border-radius: 2px;
      display: flex;
      gap: 1ex;
      height: 3em;
      padding: 8px;
      align-items: center;


      .num {
        font-size: 1.25em;
      }

      .icon {
        width: 2em;
      }
    }


    .pw-article-buttons {
      display: flex;
      gap: 8px;

      button {
        background: #0000;
        border: none;
        width: 2em;
        height: 2em;
        border-radius: 3px;
        display: grid;
        align-items: center;
        justify-items: center;
        color: var(--grys-dark);

        .icon {
          width: 24px;
        }

        &:not(.done):hover {
          background: var(--brown-contrast);
          color: #fff;
          transition: .3s;
        }
      }
    }
    .done-message {
      position: absolute;
      background: #261;
      color: #fff;
      font-size: .75em;
      white-space: nowrap;
      top: 32px;
      padding: 2px 6px;
      border-radius: 2px;
      pointer-events: none;
      opacity: 0;
      transition: .666s;

      .done & {
        opacity: 1;
      }
    }
    .done .icon{
      color: #261;
    }









/* TABLE */

.mobile-table-head {

  border-bottom: 1px solid var(--grys);
  border-top: 1em solid #fff;
  margin: -1em -1ex 1em;
  padding: 1ex;

  display: none;
}
table {
  background: var(--header-bg);
  width: 100%;

  caption {
    font-weight: 700;
    margin-bottom: 1em;
    text-align: left;
  }

  ul,
  ol {
    padding-left: 1em;

    li {
      padding-left: 0;
      margin-bottom: 1em;
    }

    ::marker {
      color: var(--brown);
    }
  }
}

.table-zoom {
  background: #0000;
  color: var(--grys-dark);
  border: 0;
  width: 1.5em;
  height: 1.5em;
  float: left;
  margin-right: 1ex;

  &:hover {
    color: var(--brown-contrast);
  }
}

td,
th {
  vertical-align: top;
  line-height: 1.31;
  padding: 1ex;
  border: 1px solid #fff;
  font-size: var(--rem);
}

thead {
  background: var(--nmhh-dark);
  color: #fff;
  border-bottom: 4px solid #fff;
}

tbody {
  tr:hover {
    background: color-mix(in srgb, var(--brown-pale) 66%, #fff);
    box-shadow: inset 0 -2px 0 var(--brown);
  }
}

#articlemenu {

  ul {
    background: #fff;
  }

  &:has([aria-expanded="true"]) {
    h2 {
      background: #fff;
      border-color: #fff;
      transition: .3s;
    }
    .toggler {
      border-color:#fff4;
    }
  }

  a {
    --hover-color: var(--header-bg);
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .6em;
    font-weight: 700;
    font-size: .9375em;
    letter-spacing: .5%;
    color: var(--grys-dark);
    border-bottom: 1px solid var(--grys-pale);

      .icon {
          min-width: 1.5em;
          width: 1.5em;
          aspect-ratio: 1;
          color: var(--grys-mid);
          mix-blend-mode: multiply;
          transition: .6s;
        }

    &:hover {
      background: var(--hover-color);
      transition: .3s;

       .icon {
        margin-right: -.6em;
        margin-left: .6em;
       }
    }
  }
  li ul li a {
    --hover-color: var(--brown-pale);
    color: var(--brown-contrast);
    border-color: var(--brown-light);
  }
  a[aria-current] {
    color: var(--nmhh-dark);
    border-color: var(--nmhh-dark);
    pointer-events: none;
    position: relative;

    &::before {
      content: '';
      position: absolute;
      width: 12px;
      aspect-ratio: 1;
      background: var(--nmhh-dark);
      clip-path: polygon(100% 0%, 100% 100%, 30% 50%);
      border-radius: 2px;
      margin-left: -24px;
    }
  }
}


.float-image-container {
    p+p {
        margin-top: 1.5em;
    }
}


#toc {

  ol {
     background: var(--nmhh-dark);
     color: #fff;
     padding: 1em;
     display: grid;
     gap: 1em;

    @container pw-root (width < 58rem) {
      background: var(--nmhh-dark);
    }

     ol {
      background: #0000;
     }
  }

  a {
    color: inherit;
    display: flex;
    align-items: center;

    &:hover {
      background: var(--brown-contrast);
      box-shadow:0 0 0 1em var(--brown-contrast);
      transition: .3s;
    }

    ol ol &:hover {
      box-shadow:
        -1.2em 0 0 1em var(--brown-contrast),
        1.2em 0 0 1em var(--brown-contrast);
    }

    .toc-item:has(.toc-submenu-toggler) & {
      padding-right: 1em;
    }
  }

  a[aria-current] {
    color: var(--brown-light);
    pointer-events: none;
    position: relative;

    &::before {
      content: '';
      position: absolute;
      width: 14px;
      aspect-ratio: 1;
      background: var(--nmhh-dark);
      clip-path: polygon(100% 0%, 100% 100%, 30% 50%);
      margin-left: -2em;
    }

    ol ol & {
      &::before {
        margin-left: -3.1em;
      }
    }
  }

  .toc-item {
    position: relative;
  }
    .toc-submenu-toggler {

      position: absolute;
      right: -.5em;
      top: 0;
      color: var(--grys-light);
      background: #0004;
      border: 0;
      aspect-ratio: 1;
      padding: 0;
      width: 1.5em;
      height: 1.5em;
      border-radius: 33%;

      .icon {
        width: 1.5em;
        height: 1.5em;
        color: currentColor;
        transition: .666s;

        [aria-expanded="true"] > & {
          transform: rotateX(180deg);
        }
      }

      &[aria-expanded="false"] + ol {
        display: none;
      }
    }
}
@container pw-root (width > 58rem) {

  aside:has(nav:only-child) #toc #toc-container {
      background: linear-gradient(90deg, #0000, #0000 1em, var(--nmhh-dark) 1em);
      max-height: calc(100cqh - 6em);
      overflow-y: auto; /*CHROME*/
      margin: 0 -1em;
      padding: 1em 1em 1em 2em;
      scrollbar-width: thin;
      scrollbar-color: var(--grys-pale) var(--nmhh-dark);
    }

  #toc:has(#toc-container[aria-expanded="true"]) {
       h2 {
         background: var(--nmhh-dark);
         border-color: var(--nmhh-dark);
         transition: .3s;
         color: #fff;
       }

       .toggler {
         border-color: var(--nmhh-dark);
         color: #fff;
       }
     }
}










#registration-form {

  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1em;
  margin: 1em 0;

  .full {
    grid-column: span 2;
  }

  .tajekoztato {
    display: grid;
    gap: 1em;
  }

  input:not([type="checkbox"]), textarea {
    width: 100%;
  }

  button[type="submit"] {
    grid-column: 2
  }
}


/* Tender timeline */
#tender-timeline {
  position: relative;
  list-style-type: none;
  padding: 0;
  list-style-type: none;
  counter-reset: i 0;
}

#tender-timeline>li {
  padding-left: 64px;
  list-style-type: none;
  font-family: "Arsenal", sans-serif;
  font-weight: 700;
  font-size: 1.2em;
}

#tender-timeline>li::before {
  font-family: "Arsenal", sans-serif;
  font-size: 29.666px;
  font-weight: 700;
  background: var(--brown-contrast);
  border: 2px solid #fff;
  border-radius: 49%;
  color: #fff;
  content: counter(i, decimal);
  counter-increment: i;
  height: 48px;
  width:48px;
  margin-left: -68px;
  margin-top: -10px;
  position: absolute;
  text-align: center;
  line-height: 46px
}

#tender-timeline>li>ul {
  list-style-type: none;
  padding: 16px 0;
  margin-top: 0;
  margin-bottom: 32px;
  position: relative;
  font-family: "Inter", sans-serif;
  font-size: var(--rem);
  font-weight: 400;
}

#tender-timeline>li>ul li {
  padding: .5em 0;
  line-height: 1.31;
  list-style-type: none;
}
#tender-timeline>li>ul li a {
  text-decoration-color: #0000;
  color: var(--brown-contrast);

  &:hover {
    text-decoration-color: var(--brown);
    color: var(--nmhh-dark);
    background: none;
  }
}

#tender-timeline>li>ul::before {
  position: absolute;
  content: '';
  width: 0;
  border-left: 2px dashed var(--brown-light);
  height: calc(100% + 64px);
  left: -43px;
  top: -24px;
  z-index: -1;
}

#tender-timeline>li>ul::after {
  content: ">";
  font-weight: 999;
  font-size: 32px;
  font-family: "Arsenal", sans-serif;
  position: absolute;
  transform: rotate(90deg);
  color: var(--brown);
  left: -48px;
  bottom: -44px;
  width: 1rem;
  text-align: center;
  font-weight: 300;
}

#tender-timeline>li sub {
  font-family: "Inter", sans-serif;
  font-size: .75em;
  font-weight: 400;
  color: var(--grys-dark);
  display: block;
  position: relative;
  top: 0;
}

#tender-timeline>li.childless {
  color: #666;
  margin: 0 0 2.5rem;
}

#tender-timeline>li.childless sub {
  color: #666;
}

#tender-timeline>li.childless::before {
  color: #666;
  background: #fff;
  border-color: #A0A0A0;
}

#tender-timeline>li:last-child>ul::before,
#tender-timeline>li:last-child>ul::after {
  display: none;
}

.tendertitle {
  margin: 1em 0 0;
  padding: 0;
  border: none;
  font-family: "Arsenal", sans-serif;
  font-weight: 900;
  font-size: 1.5rem;
  color: var(--brown-contrast);
}




/*PERSON CARD*/
.pw-card.person {
  background: var(--header-bg);
  border: 1px solid;
  border-color: #0000 #0000 var(--brown-light) #0000;
  text-align: center;
  position: relative;

  &:not(:has(a)) {
    padding: 1em 1.5em;
    display: grid;
    gap: 1em;
  }

  &:has(a) {

    &:has(:hover) {
      border-color: var(--brown-light);
      background: color-mix(in srgb, #fff 12%, var(--header-bg));
      transition: .3s;
    }

    a {
      padding: 1em 1.5em;
      display: grid;
      gap: 1em;
      color: var(--nmhh-dark);

      img {
        image-rendering: auto;
        filter: blur(0.2px);
        transform: scale(.99999);
      }


      &:hover {

        img {
          transform: scale(1.1);
          transition: ease-in-out .666s;
        }
        .icon {
          right: 0;
          color: var(--brown-contrast);
        }
        .name, .title {
          color: var(--brown-contrast);
          transition: .3s;
        }
      }
    }
  }


  figure {
    width: 100%;
    aspect-ratio: 1;
    border-radius: 50%;
    overflow: hidden;
    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
      image-rendering: optimizeQuality;
      transform: translateZ(0);
      transition: ease-out .3s;
    }
  }
  .txt {
    mix-blend-mode: multiply;
  }
  .name {
    font-weight: 700;
    line-height: 1.31;
  }
  .title, .organization {
    font-size: .875em;
    color: var(--grys-dark);
  }
  .organization {
    margin-top: -.5ex;
  }
  .icon {
    width: 1.25em;
    height: 1.25em;
    transform: rotate(-90deg);
    position: absolute;
    right: .5em;
    bottom: .5em;
    transition: .3s;
  }
}




/* MULTIDOC */

.multidoc {
  background: var(--header-bg);
  padding: 1em;
  border-bottom: 2px solid var(--brown);

  .docs {
    display: flex;
    flex-wrap: wrap;
    gap: 1ex;
    margin-top: 1em;
  }
  .desc {
    margin-top: .5em;
  }

  header a {

    color: var(--nmhh-dark);
    transition: .3s;

      .icon {
          width: 1.25em;
          height: 1.25em;
          vertical-align: text-bottom;
          margin: 0 1ex 0 0;
          transition: .5s;

          &:has(use[href="#chevron"]) {
              transform: rotate(-90deg);
            }
        }

    &:hover {
      color: var(--brown-contrast);
      .icon {
        margin: 0 0 0 1ex;
      }
    }

  }

}

.table-of-contents {
  a {
    color: inherit;

    &:hover {
      text-decoration: underline;
      text-decoration-thickness: 2px;
      text-decoration-color: var(--grys);
    }
  }

  &>ol {
    background: var(--header-bg);
    padding: 1em !important;
    margin: 1em 0;
  }

  li {
    margin: .618em 0;
    &::before {
      color: var(--brown-contrast);
      font-weight: 500;
      font-size: .875em;
    }
  }

  &.dark {
    background: var(--nmhh-dark);
    color: #fff;
    ol {
      background: #0000;
      mix-blend-mode: screen;
    }
    header {
      text-align: center;
      margin: 1em;
      font-size: 1.125em;
      font-weight: 700;
    }
    h2 {
      color: #fff;
      margin: 0;
      padding: 1ex 1em;
    }
  }

}

.gallerytrigger_container img {width: 100%;}





}/* /ARTICLE LAYER */






/*temp

.pw-section .inner {
  outline: 1px solid #f0f;
  background: linear-gradient(90deg,

        #0000 0,
        #0000 calc((100% - 3 * var(--gap)) / 4),

        #f0f1 calc((100% - 3 * var(--gap)) / 4),
        #f0f1 calc((100% - 3 * var(--gap)) / 4 + var(--gap)),

        #0000 calc((100% - 3 * var(--gap)) / 4 + var(--gap)),
        #0000 calc(2 * (100% - 3 * var(--gap)) / 4 + var(--gap)),

        #f0f1 calc(2 * (100% - 3 * var(--gap)) / 4 + var(--gap)),
        #f0f1 calc(2 * (100% - 3 * var(--gap)) / 4 + 2 * var(--gap)),

        #0000 calc(2 * (100% - 3 * var(--gap)) / 4 + 2 * var(--gap)),
        #0000 calc(3 * (100% - 3 * var(--gap)) / 4 + 2 * var(--gap)),

        #f0f1 calc(3 * (100% - 3 * var(--gap)) / 4 + 2 * var(--gap)),
        #f0f1 calc(3 * (100% - 3 * var(--gap)) / 4 + 3 * var(--gap)),

        #0000 calc(3 * (100% - 3 * var(--gap)) / 4 + 3 * var(--gap)),
        #0000 100%),

        repeating-linear-gradient(90deg,
        #ff01 0,
        #ff01 calc((100% - 11 * var(--gap)) / 12),
        #0000 calc((100% - 11 * var(--gap)) / 12),
        #0000 calc((100% - 11 * var(--gap)) / 12 + var(--gap))
        );
}