@media screen and (max-width: 624px) {

.desktop-menu li {
	font-size: 1em;
}



/* =========================
   Index
========================= */

.site-intro {
	grid-template-columns: 1fr;
	height: fit-content;
	position: unset;
}





.button-home  {
  display: none;
}














/* =========================
   PROFILE
========================= */

section.profile {
  grid-template-columns: 1fr;
  grid-gap: 20px;
}

section.profile-intro {
  grid-template-columns: 1fr;
  grid-gap: 10px;
}

.a,
.b,
.c,
.d {
  grid-column: 1 / 1;
}

.b {
  flex-direction: column;
  grid-gap: 10px;
}

.call-to-action {
  grid-template-columns: 1fr;
  padding-top: 20px;
  padding-bottom: 20px;
}










/* =========================
   PROJECTS
========================= */

.projects {
  grid-template-columns: 1fr;
  grid-gap: var(--padding);
}

.box-double {
  flex-direction: column;
  gap: 20px;
}

.boxmedium,
.boxbig {
  grid-column: span 1;
}

.dossier {
  display: none;
}

.dossier-link {
  display: none !important;
}

.projects-info {
  bottom: 0;
  width: 100%;
  grid-template-columns: 1fr;
  grid-auto-rows: auto !important;
  grid-gap: 10px;
  height: fit-content;
  grid-template-areas:
    "headline"
    "keywords"
    "description";
}





/* =========================
   AITYDE
========================= */


.aityde {
  display: none;
}


.aityde-cta {
  padding-top: 8vh;
}















/* =========================
   MEDIA / VISUAL
========================= */

.video-background {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

img,
video {
  border-radius: 10px;
}


/* =========================
   TYPOGRAPHY / UI
========================= */

.letter {
  font-size: 70vw !important;
}

.letters {
  font-size: 22vw !important;
}

.name-intro h1 {
  font-size: 14vw;
}

.desktop-menu a {
  font-size: 1em;
}


/* =========================
   NAVIGATION
========================= */

#projectNavWrapper {
  display: none;
}

#projectNav {
  flex-direction: row;
  align-items: center;
  width: 100%;
  height: auto;
}

#projectNav a:hover {
  transform: none;
  margin: 0 !important;
}


/* =========================
   LAYOUT CLEANUP
========================= */

.avatar,
.circle-wrapper,
.button-darkmode,
.grid-icon,
.grid,
#clock,
.contentOutside {
  display: none !important;
}

.button-contact-wrapper {
  margin-left: auto;
}

.sticky {
  position: unset !important;
}

.site-intro,
.footer-intro,
.menu-intro {
  position: unset;
}

.intro-button {
  height: 20vh;
}

.fill-height {
  height: auto !important;
  top: unset;
  bottom: 0 !important;
}


/* =========================
   BLOG (if used)
========================= */

section.blog,
section.blogSingle,
section.blogContent {
  grid-template-columns: 1fr;
}

.related {
  grid-template-columns: 1fr;
}

.wp-block-columns {
  flex-wrap: wrap;
  gap: 20px;
}


/* =========================
   CLOCK (scaled)
========================= */

.clock {
  width: 34vw;
  height: 34vw;
}

.clock:before {
  width: 2vw;
  height: 2vw;
}

.clock .hour,
.hr {
  width: 14vw;
  height: 14vw;
}

.clock .min,
.mn {
  width: 17vw;
  height: 17vw;
}

.clock .sec,
.sc {
  width: 21vw;
  height: 21vw;
}

.hr:before {
  width: 0.6vw;
  height: 6vw;
}

.mn:before {
  width: 0.4vw;
  height: 8vw;
}

.sc:before {
  width: 0.4vw;
  height: 13vw;
}








h1{
    font-family: 'Sporting Grotesque_Regular';
    font-size: 3vh;
    font-weight: bold;
    line-height: 125%;
    margin: 0 0 0 0;
}

h2{
    font-family: 'Sporting Grotesque_Regular';
    font-size: 5vw;
    font-weight: normal;
    line-height: 140%;
    margin: 0 0 0 0;
}

h3{
    font-weight: normal;
    font-size: 1.2em;
    line-height: 1.3em;
    margin-bottom: -2vh;

}

h4 {
    font-weight: normal;
    font-size: 1.1em;
    line-height: 1.3em;
    margin-bottom: 0vh;
}


p {
    font-size: 1.1em;
    line-height: 1.3em;
    font-weight: normal;
    margin: 0 0 0 0
}

small {
    font-size: 0.8em;
}

.menu-items li {
    font-size: 1.1em;
    line-height: 1.3em;
    font-weight: normal;
    margin: 0 0 0 0
}



}