/* Preserve Timber's layouts, headers, colours and page movement. */
.loader .ab-art-letter {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  margin: 0; padding: 0 .1em 0 0;
  font-family: Arial, Helvetica, sans-serif;
  font-size: clamp(190px, 32vw, 360px);
  font-weight: 900; letter-spacing: -.1em; line-height: 1.15;
  text-transform: none;
  color: #1b1c1a;
  background-size: cover; background-position: center;
}
.loader .ab-art-letter.has-art {
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.loader.ab-art-ready #loaderSvg { display: none; }
.ab-project-dialog:not([open]) { display: none; }
.ab-project-dialog[open] {
  display: block;
  position: fixed; inset: 0;
  width: 100%; max-width: none;
  height: 100%; height: 100dvh; max-height: none;
  margin: 0; padding: 22px;
  border: 0; background: #fff; color: #171717;
  overflow-y: auto; overscroll-behavior: contain;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px; line-height: 1.6;
  z-index: 99999;
}
.ab-project-dialog::backdrop { background: #fff; }
.ab-project-dialog .ab-dialog-close {
  display: block; margin: 0 0 24px auto;
  min-width: 80px; min-height: 44px;
  padding: 10px 0 10px 16px;
  background: transparent; color: #171717;
  border: 0; border-radius: 0;
  font: 700 14px/1.3 Arial, Helvetica, sans-serif;
  text-transform: none; cursor: pointer;
}
.ab-dialog-content { max-width: 680px; margin-inline: auto; }
.ab-project-dialog h2 { font: 700 32px/1.05 Arial, Helvetica, sans-serif; letter-spacing: -.03em; margin: 0 0 24px; }
.ab-project-dialog h3 { font: 700 23px/1.2 Arial, Helvetica, sans-serif; margin: 28px 0 12px; }
.ab-project-dialog h4 { font: 700 18px/1.25 Arial, Helvetica, sans-serif; margin: 22px 0 10px; }
.ab-project-dialog p { margin: 0 0 18px; }
.ab-project-dialog a { text-decoration: underline; text-underline-offset: 3px; }
.ab-project-dialog img,.ab-project-dialog video,.ab-project-dialog iframe { max-width: 100%; }
.ab-mobile-intro button:focus-visible,.ab-project-dialog :focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }

/* Phone-only changes. 740px is Timber's own small-screen breakpoint. */
@media screen and (max-width: 739px) {
  .single-jetpack-portfolio .portfolio--filmstrip > .portfolio__item--text.ab-compact-copy {
    box-sizing: border-box;
    width: 68vw !important; min-width: 0; max-width: 320px;
    column-count: 1; column-width: auto;
    padding: 16px 18px 20px 20px;
    font-family: Arial, Helvetica, sans-serif;
  }
  .ab-compact-copy .ab-mobile-intro { width: 100%; }
  .single-jetpack-portfolio .entry-content .ab-mobile-intro h2 {
    font: 700 clamp(27px, 7.2vw, 34px)/1.02 Arial, Helvetica, sans-serif !important;
    letter-spacing: -.04em; margin: 0 0 18px !important;
    overflow-wrap: anywhere;
  }
  .single-jetpack-portfolio .entry-content .ab-mobile-intro p.ab-mobile-lead {
    font: 400 14px/1.5 Arial, Helvetica, sans-serif !important;
    margin: 0 0 18px !important;
    display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .ab-mobile-lead strong { font-weight: 700; }
  .ab-mobile-intro .ab-read-project {
    display: inline-block; min-height: 44px;
    margin: 0 0 20px; padding: 10px 0;
    border: 0; border-bottom: 1px solid #171717; border-radius: 0;
    background: transparent; color: #171717;
    font: 700 13px/1.3 Arial, Helvetica, sans-serif;
    text-transform: none; letter-spacing: 0; cursor: pointer;
  }
  .single-jetpack-portfolio .entry-content .ab-mobile-intro .ab-swipe-cue {
    font: 700 11px/1.4 Arial, Helvetica, sans-serif !important;
    margin: 0 !important; color: #555;
  }
  .project-slide__content h1,.site-sidebar__text,
  .page-template-default .entry-title,.page-no-featured-image .entry-title {
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: -.025em;
  }
  .project-slide__content h1 { font-size: clamp(32px, 9vw, 46px); line-height: 1.03; }
  .page-template-default .entry-title,.page-no-featured-image .entry-title { font-size: clamp(34px, 10vw, 48px); line-height: 1.08; }
  .main-navigation { font-family: Arial, Helvetica, sans-serif !important; font-weight: 700; }
  .page-template-default .entry-content p { font-size: 16px; line-height: 1.6 !important; }
}
