/* ------- Fonts ------- */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,400;0,600;1,400;1,600&display=swap');


.ibm-plex-mono-regular {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 400;
  font-style: normal;
}

.ibm-plex-mono-semibold {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 600;
  font-style: normal;
}

.ibm-plex-mono-regular-italic {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 400;
  font-style: italic;
}

.ibm-plex-mono-semibold-italic {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 600;
  font-style: italic;
}



/* ------- Core ------- */
::selection { color:#fff; background:#ff0000; }
html { scroll-behavior:smooth; }
body { background:#fff; color:#000; font-family: "IBM Plex Mono", monospace; font-weight: 400; transition: background-color 0.3s ease, color 0.3s ease; padding: 10px;  }
img { width:100%; }
video { width:100%; overflow:hidden; border:0; }
.clear { clear:both; }
a { text-decoration:underline; color:inherit; cursor:pointer; }
a:hover { text-decoration:underline; }
.active { text-decoration:underline; }

/*hr { border: 0.5px solid #ff0000; margin:60px 0; }*/
hr { height:0px; border-top:1px solid black; margin:30px 0; }

h1, h2, p, span { font-size: 0.75rem; line-height: 150%; letter-spacing: -0.025rem; font-weight: 300; }
b { font-weight: 600; }

.work {
    margin-top: 5px;
    display: flex;
    align-items: flex-start;
    gap: 0;
    flex-wrap: wrap;
    overflow: visible;
}

.work img,
.work video {
    display: block;
    /*width: calc(100% / 7);*/
    height: auto;
    position: relative;
    z-index: 1;
    transition: transform 0.1s ease, z-index 0s;
    transform-origin: center center;
    margin-right: 0.5%;
}
.work_normal { width: calc(100% * 1 / 8); }
.work_large { width: calc(100% * 1 / 8); }
/*
.work img:hover, .work video:hover { transform: scale(1.5); z-index: 999; }
.work img:first-child, .work video:first-child { transform-origin: left center; }
*/
.work_10 { width:10%; }
.work_15 { width:15%; }
.work_20 { width:20%; }
.work_30 { width:30%; }
.work_40 { width:40%; }


.hidden_text, .read_less { display: none; }
.read_block.open .hidden_text { display: block; }
.read_block.open .read_less { display: inline; }

.read_more { display:inline-block; }
.read_less {  }

.read_block.open .read_more { display: none; }
.text_title { width: calc(100% * 2 / 7); display:inline-block; }
.text_cta { display:inline-block; }

.profile_section { display: flex; align-items: flex-start; gap: 20px; }
.profile_img { width: calc(100% / 7); height: auto; display: block; }
.profile_copy { width: 85%; }

.marquee { width: 99%; overflow: hidden; white-space: nowrap; }
.marquee_inner { display: flex; width: max-content; animation: marquee 60s linear infinite; }
.marquee_group { display: flex; gap: 20px; padding-right: 10px; }
.marquee_group span { display: inline-block; }

@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }




/* ------- Responsive ------- */
@media only screen and (min-width : 769px)  and (max-width : 900px) {
  /*body { background:pink; }*/

  h1, h2, p, span { font-size: 0.85rem; }

  .text_title { width: 50%; }
}

@media only screen and (min-width : 1px)  and (max-width : 768px) {
  /*body { background:yellow; }*/

  h1, h2, p, span { font-size: 1rem; letter-spacing: -0.025rem; }

  .work img,
  .work video { margin-bottom: 0.5%; }

  .work_10 { width:49%; }
  .work_15 { width:49%; }
  .work_20 { width:49%; }
  .work_30 { width:49%; }
  .work_40 { width:49%; }

  .profile_img { display:none; }
  .profile_copy { width: 100%; }
}