@charset "UTF-8";
.photo {
  border-radius: 8px;
  isolation: isolate;
  outline: 1px solid var(--surface-1);
  outline-offset: -6px;
  overflow: clip;
}

.photo a {
  font-family: var(--font-secondary-heading-stack);
  font-weight: var(--font-secondary-heading-weight);
  font-style: var(--font-secondary-heading-style);
  font-stretch: var(--font-secondary-heading-width);
  font-size: var(--font-size-3);
  line-height: var(--line-height-3);
  align-content: end;
  justify-content: stretch;
  color: var(--surface-1);
  display: grid;
  text-decoration: none;
  text-shadow: 0 0 4px var(--text-1);
  text-transform: uppercase;
  text-wrap: balance;
  z-index: 1;
}
.photo a b, .photo a strong {
  font-weight: var(--font-secondary-heading-bold);
}
.photo a i, .photo a em {
  font-style: var(--font-secondary-heading-italic);
}
@media screen and (prefers-color-scheme: dark) {
  .photo a {
    color: var(--text-1);
    text-shadow: 0 0 4px var(--surface-1);
  }
}

.photo .title-bg {
  padding: 1rlh;
  position: relative;
}
@media screen and (prefers-color-scheme: light) {
  .photo .title-bg::before {
    backdrop-filter: brightness(0.5) saturate(50%) contrast(90%);
    content: "";
    display: block;
    height: 100%;
    mask-image: linear-gradient(transparent, rgb(0, 0, 0) 50%);
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    z-index: -1;
  }
}

.photo img {
  object-fit: cover;
  width: 100%;
}

.landscape {
  aspect-ratio: 3/2;
}

.portrait {
  aspect-ratio: 3/4;
}

.post a {
  font-family: var(--font-secondary-heading-stack);
  font-weight: var(--font-secondary-heading-weight);
  font-style: var(--font-secondary-heading-style);
  font-stretch: var(--font-secondary-heading-width);
  font-size: var(--font-size-2);
  line-height: var(--line-height-2);
  text-wrap: balance;
}
.post a b, .post a strong {
  font-weight: var(--font-secondary-heading-bold);
}
.post a i, .post a em {
  font-style: var(--font-secondary-heading-italic);
}

.post p {
  font-size: var(--font-size--1);
  line-height: var(--line-height--1);
  color: var(--text-2);
}

.post time {
  font-family: var(--font-secondary-stack);
  font-weight: var(--font-secondary-weight);
  font-style: var(--font-secondary-style);
  font-stretch: var(--font-secondary-width);
  font-size: var(--font-size--1);
  line-height: var(--line-height--1);
  color: var(--text-3);
}
.post time b, .post time strong {
  font-weight: var(--font-secondary-bold);
}
.post time i, .post time em {
  font-style: var(--font-secondary-italic);
}

.post time::before {
  content: "―" " ";
}

.tag {
  font-family: var(--font-secondary-stack);
  font-weight: var(--font-secondary-weight);
  font-style: var(--font-secondary-style);
  font-stretch: var(--font-secondary-width);
  border-radius: 4px;
}
.tag b, .tag strong {
  font-weight: var(--font-secondary-bold);
}
.tag i, .tag em {
  font-style: var(--font-secondary-italic);
}

/*# sourceMappingURL=index.css.map */