/* Slightly smaller font for Marketing line */
.c-home_line[data-module-timeline="homeTitleThree"] {
  font-size: 0.85em !important;
}

/* Force title + desc to single line, allow visible overflow */
.c-projects_list_item_title,
.c-projects_list_item_header_inner .o-layout_item p.u-text-big {
  white-space: nowrap;
  overflow: visible;
}

/* Push the year/date 100px to the right so it doesn't crowd the description */
.c-projects_list_item_header_inner time.u-text-big {
  margin-left: 100px !important;
}

/* Align the project tags row under the (shifted) year column */
.c-projects_list_item_container .c-projects_list_item_description {
  margin-left: 100px !important;
}

/* Widen the projects list container so title sits further left + year further right.
   Applies only inside projects accordion rows (header + list header). */
.c-projects_list .c-projects_list_item_header_inner.o-container,
.c-projects_list .c-projects_list_item_container.o-container,
.c-projects_list_header .o-container {
  max-width: 100% !important;
  padding-left: 40px !important;
  padding-right: 40px !important;
}

/* Lock slider to 16:10 box + reserve a strip at the bottom for the pagination dots */
.c-projects_list_item_images_slider {
  position: relative !important;
  aspect-ratio: 16 / 10 !important;
  background: var(--brown, #674825) !important;
  overflow: hidden;
  padding-bottom: 36px !important;
  box-sizing: content-box !important;
}
.c-projects_list_item_images_slider .swiper {
  height: 100% !important;
}
.c-projects_list_item_images_slider .swiper-wrapper,
.c-projects_list_item_images_slider .swiper-slide {
  height: 100% !important;
}
.c-projects_list_item_images_slider .swiper-slide picture,
.c-projects_list_item_images_slider .swiper-slide img,
.c-projects_list_item_images_slider .swiper-slide video {
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  background: var(--brown, #674825);
  display: block;
}
/* Pin pagination inside the reserved bottom strip — always BELOW the image, never over it */
.c-projects_list_item_images_slider .swiper-pagination {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 10px !important;
  text-align: center !important;
  height: 16px !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Swiper pagination dots — auto-contrast via mix-blend-mode */
.c-projects_list_item_images_slider .swiper-pagination {
  mix-blend-mode: difference;
  z-index: 5;
}
.c-projects_list_item_images_slider .swiper-pagination-bullet {
  background: #ffffff !important;
  opacity: 0.55 !important;
  width: 10px;
  height: 10px;
  border: none;
}
.c-projects_list_item_images_slider .swiper-pagination-bullet-active {
  background: #ffffff !important;
  opacity: 1 !important;
}

/* Click shield (overlay injected by /vendor/click-shield.js for 2s on load) */
#click-shield {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: transparent;
  pointer-events: auto;
}

/* Speed up the "Hello," loader fade-out — 1.2s + 0.6s delay → ~0.5s */
.c-loading,
.c-loading::before {
  transition-duration: 0.5s !important;
  transition-delay: 0s !important;
}

/* Footer reveal animations sometimes don't trigger — force visible */
.c-footer .u-anim {
  opacity: 1 !important;
  transform: none !important;
}

/* Hide projects not yet ready */
#project-george-fox,
#project-pro-esports,
#project-ottr,
#project-daily-dose,
#project-realm,
#project-metafy {
  display: none !important;
}

/* Push Content sup 150px to the right */
.c-home_line_sup:has([data-module-timeline="homeLabelThree"]) {
  transform: translateX(150px) !important;
}

/* "Work" rail — hide vertical separator border between tiles.
   The 4 tiles each host their own Rail JS instance and the letter math doesn't
   land on tile boundaries → visible seam. We can't display:none the extras
   (rail init throws "Ratio is Infinity" on zero-width tracks). Hiding the
   border is the safest mask — small horizontal letter drift remains but no
   crisp vertical line cuts across the type. */
#realisations.c-tagline .c-tagline_item {
  border-right: none !important;
}

/* Footer contacts — 2 columns: email+location | Twitter+LinkedIn (150px apart) */
.c-footer_list {
  display: grid;
  grid-template-columns: max-content max-content;
  column-gap: 150px;
  row-gap: 0;
  align-items: start;
}
.c-footer_list > li:nth-child(1) { grid-column: 1; grid-row: 1; }
.c-footer_list > li:nth-child(2) { grid-column: 1; grid-row: 2; }
.c-footer_list > li:nth-child(3) { grid-column: 2; grid-row: 1; }
.c-footer_list > li:nth-child(4) { grid-column: 2; grid-row: 2; }

/* Top-right nav — 3 buttons (You / Work / Get in touch) evenly spaced.
   Targets the desktop nav half (2nd o-layout_item, u-none@to-medium). */
.c-menu > .o-layout > .o-layout_item:nth-child(2) > .o-layout > .o-layout_item {
  width: 33.3333% !important;
}

/* Make spaces in split-char nav labels visible — "Get in touch" had no gaps */
.c-menu_link_label .char-wrap {
  white-space: pre !important;
}