/*--
  © 2026 Nereus Games – http://nereus.games/
  ❤︎ Sharing is caring. Please share & reuse as you see fit.
  */


/* mobile img     34rem / 680px
   desktop img    40rem / 800px */

main#makirama {
  body:has(&) {
    background:                 url('/assets/makirama/wallpaper.png') center / auto repeat fixed;
    }
  display:                      flex;
  flex-flow:                    column nowrap;
  align-items:                  center;
  font-family:                  var(--mr-body);
  font-weight:                  300;
  & #title p {
    background:                 var(--white);
    color:                      #571d0c;
    font-weight:                600;
    margin-top:                 -1rem;
    padding:                    1rem 2rem;
    @media (min-width: 840px) {
      font-size:                1.3rem;
      padding:                  1rem 3.5rem 2rem;
      }
    }
  & > :first-child {
    margin-top:                 2rem;
    }
  & section {
    width:                      var(--section-width);
    &:not(:first-of-type) {
      background:               var(--white);
      margin:                   0;
      }
    & img, & p {
      text-align:               center;
      width:                    var(--section-width);
      &.caption {
        font-size:              .6rem;
        margin-top:             0;
        }
      }
    }
  & b, & strong, & .caption {
    font-weight:                600;
    }
  & h2, & h3, & h4, & h5, & h6 {
    font-family:                var(--mr-titling);
    font-weight:                900;
    }
  & #newsletter p:first-child {
    margin:                     1rem auto 0;
    width:                      100%;
    max-width:                  min(80%, 26rem);
    font-weight:                600;
    }
  & #newsletter button {
    font-weight:                600;
    }
  & .mobile {
    @media (min-width: 840px) {
      display:                  none;
      }
    }
  & .desktop {
    @media (max-width: 840px) {
      display:                  none;
      }
    @media (min-width: 840px) {
      margin:                   0 -3rem;
      width:                    40rem;
      }
    }
  }