:root {
  --ink: #f2efe8;
  --muted: #b2b4bd;
  --line: rgba(237, 232, 220, .18);
  --paper: #080a10;
  --soft: #10131d;
  --blue: #173f9d;
  --crimson: #8f1f2e;
  --ember: #cf5a32;
  --gold: #b99a62;
  --serif: "Bodoni Moda", "Times New Roman", serif;
  --sans: "Space Grotesk", Arial, sans-serif;
}

html { background: #07090f; }
body {
  color: var(--ink);
  background:
    radial-gradient(circle at 85% 12%, rgba(27,65,154,.16), transparent 30rem),
    radial-gradient(circle at 12% 48%, rgba(132,30,43,.10), transparent 28rem),
    #080a10;
  font-family: var(--sans);
  font-weight: 300;
}
::selection { color: #fff; background: var(--crimson); }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.site-header {
  height: 76px;
  border-color: rgba(255,255,255,.12);
  background: rgba(7,9,15,.82);
  backdrop-filter: blur(18px);
}
.brand {
  font-family: var(--serif);
  font-size: 1.55rem;
  font-weight: 500;
  letter-spacing: -.025em;
}
.site-header nav a,
.inquire-link { font-weight: 500; letter-spacing: .14em; }
.site-header nav a { color: #b9bbc3; }
.site-header nav a:hover { color: #fff; border-color: var(--crimson); }
.language-switch span { color: #8f939e; }
.language-switch a { color: #b8bac2; }
.language-switch a[aria-current="page"] { color: #fff; border-color: var(--crimson); }
.inquire-link { color: #fff; }
.inquire-link span { color: #ca6647; }

.surreal-hero {
  position: relative;
  isolation: isolate;
  min-height: calc(100svh - 76px);
  display: grid;
  grid-template-columns: minmax(19rem,.78fr) minmax(25rem,1.22fr);
  gap: clamp(2rem,7vw,9rem);
  align-items: center;
  overflow: hidden;
  padding: clamp(4rem,8vw,8rem) clamp(1.25rem,5vw,6rem);
}
.surreal-hero::before {
  content: "";
  position: absolute;
  z-index: -3;
  inset: 0;
  background:
    linear-gradient(90deg, #07090f 0 38%, transparent 68%),
    radial-gradient(circle at 70% 44%, rgba(19,66,176,.25), transparent 36%),
    linear-gradient(180deg, #07090f 0, #080a10 100%);
}
.hero-atmosphere {
  position: absolute;
  z-index: -1;
  width: 44rem;
  height: 44rem;
  right: -17rem;
  top: -20rem;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 50%;
  box-shadow: 0 0 0 8rem rgba(25,46,106,.06), 0 0 0 17rem rgba(138,32,48,.025);
}
.surreal-copy { position: relative; z-index: 3; }
.hero-kicker {
  margin: 0 0 2.5rem;
  color: #9a9ca5;
  font-size: .67rem;
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: uppercase;
}
.surreal-copy h1 {
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(5.2rem,9vw,10rem);
  font-weight: 400;
  line-height: .68;
  letter-spacing: -.065em;
}
.surreal-copy h1 span,
.surreal-copy h1 em { display: block; }
.surreal-copy h1 em {
  margin-left: .48em;
  color: #d9d3c8;
  font-weight: 400;
}
.surreal-copy .hero-intro {
  max-width: 29rem;
  margin: 3.4rem 0 2rem;
  color: #b2b3ba;
  font-family: var(--serif);
  font-size: clamp(1.35rem,2vw,1.85rem);
  font-style: italic;
  line-height: 1.35;
  text-transform: none;
}
.hero-link {
  display: inline-flex;
  gap: 2rem;
  align-items: center;
  padding: .9rem 0;
  border-bottom: 1px solid #585c66;
  font-size: .7rem;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.hero-link span { color: #cb6247; }
.surreal-art {
  position: relative;
  z-index: 2;
  justify-self: end;
  width: min(100%,48rem);
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
}
.surreal-art::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 6% -5% -6% 16%;
  border: 1px solid rgba(255,255,255,.10);
  background: linear-gradient(145deg, rgba(24,50,114,.20), rgba(137,29,45,.12));
  transform: rotate(2.5deg);
}
.surreal-art img {
  width: 100%;
  height: min(72svh,52rem);
  object-fit: contain;
  filter: saturate(.92) contrast(1.04);
  box-shadow: 0 2.5rem 6rem rgba(0,0,0,.55);
}
.surreal-art > span {
  position: absolute;
  right: -1rem;
  bottom: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
  padding: .8rem 1rem;
  color: #ded9d0;
  background: rgba(7,9,15,.88);
  text-align: left;
}
.surreal-art b { font-size: .64rem; letter-spacing: .16em; }
.surreal-art i { color: #898c96; font-family: var(--serif); font-size: .9rem; font-weight: 400; }
.hero-note {
  position: absolute;
  right: clamp(1.2rem,3vw,3rem);
  bottom: 2rem;
  display: flex;
  gap: 1.35rem;
  color: #616570;
  font-size: .58rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  writing-mode: vertical-rl;
}

.threshold {
  position: relative;
  min-height: 70svh;
  display: grid;
  grid-template-columns: 1fr minmax(20rem,.78fr);
  gap: clamp(3rem,10vw,12rem);
  align-items: center;
  padding: clamp(5rem,10vw,11rem) clamp(1.25rem,6vw,7rem);
  border-top: 1px solid var(--line);
  background:
    radial-gradient(circle at 76% 54%, rgba(137,31,46,.18), transparent 32rem),
    #0c0e15;
}
.threshold > p {
  position: relative;
  z-index: 2;
  max-width: 11ch;
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(3.2rem,6vw,7rem);
  line-height: .95;
  letter-spacing: -.045em;
}
.threshold > p::before {
  content: "02";
  display: block;
  margin-bottom: 1.5rem;
  color: #8d909a;
  font-family: var(--sans);
  font-size: .65rem;
  letter-spacing: .2em;
}
.threshold button {
  position: relative;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
}
.threshold img {
  width: 100%;
  max-height: 61svh;
  object-fit: contain;
  filter: saturate(.76) brightness(.88) contrast(1.08);
  box-shadow: 0 2rem 5rem rgba(0,0,0,.55);
}

.label {
  color: #868a94;
  font-size: .66rem;
  font-weight: 500;
  letter-spacing: .2em;
}
.works,
.instagram-feature,
.social-feature,
.answers { background: #080a10; }

.instagram-feature {
  position: relative;
  display: grid;
  grid-template-columns: minmax(15rem,.7fr) minmax(0,1.8fr);
  gap: clamp(2rem,5vw,6rem);
  padding: clamp(5rem,9vw,9rem) clamp(1rem,5vw,5rem);
  overflow: hidden;
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 5% 30%, rgba(159,35,50,.22), transparent 24rem),
    radial-gradient(circle at 88% 72%, rgba(12,57,146,.2), transparent 30rem),
    #070910;
}
.instagram-feature::before {
  content: "";
  position: absolute;
  inset: 1.2rem;
  border: 1px solid rgba(255,255,255,.055);
  pointer-events: none;
}
.instagram-intro { position: relative; z-index: 1; align-self: center; }
.instagram-intro h2 {
  margin: .8rem 0 1.5rem;
  color: #eeeae2;
  font-family: var(--serif);
  font-size: clamp(2.8rem,5.5vw,6rem);
  font-weight: 400;
  line-height: .92;
}
.instagram-intro > p:not(.label) { max-width: 30rem; color: #989ba4; line-height: 1.75; }
.instagram-intro .text-link { margin-top: 1.8rem; }
.instagram-showcase {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(16rem,1fr) minmax(13rem,.7fr);
  gap: clamp(1.2rem,2.5vw,2.8rem);
  align-items: center;
}
.instagram-post {
  margin: 0;
  border: 1px solid #2d313b;
  background: #11141c;
  box-shadow: 0 2rem 5rem rgba(0,0,0,.36);
}
.instagram-post iframe {
  display: block;
  width: 100%;
  height: clamp(34rem,52vw,44rem);
  border: 0;
  background: #fff;
}
.instagram-post p {
  margin: 0;
  padding: .9rem 1rem 1rem;
  color: #bbb8b0;
  font-family: var(--serif);
  font-size: 1rem;
}
.instagram-more { border-top: 1px solid #454953; border-bottom: 1px solid #454953; }
.instagram-more > .label { padding: 1.2rem 0 .7rem; }
.instagram-more a {
  display: grid;
  gap: .35rem;
  padding: 1.5rem 0;
  border-top: 1px solid #242832;
  color: #d8d4cc;
}
.instagram-more strong { font-family: var(--serif); font-size: clamp(1.4rem,2.3vw,2.1rem); font-weight: 400; }
.instagram-more span { color: #858993; font-size: .68rem; letter-spacing: .13em; text-transform: uppercase; }
.instagram-more a:hover span { color: #fff; }
.works { border-color: var(--line); }
.section-head h2,
.answers h2,
.contact h2,
.miami-heading h2,
.commissions h2,
.artist-copy h2 {
  color: #eeeae2;
  font-family: var(--serif);
  font-weight: 400;
}
.section-head > p,
.section-intro p { color: #b4b6bf; }
.section-intro { width: min(100%, 30rem); }
.section-intro p { margin: 0 0 1.35rem; }
.category-filters { border-bottom: 1px solid var(--line); padding-bottom: 1.4rem; }
.filter-button {
  border: 0;
  border-radius: 0;
  color: #b0b2bb;
  background: transparent;
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.filter-button:hover,
.filter-button[aria-pressed="true"] { color: #fff; background: transparent; box-shadow: inset 0 -1px var(--crimson); }
.filter-button,
.language-switch a,
.inquire-link,
.site-header nav a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
.gallery { gap: clamp(.8rem,1.6vw,1.8rem); background: transparent; }
.gallery-item { background: transparent; }
.gallery-image {
  border: 1px solid rgba(255,255,255,.08);
  background: #eeeae2;
  box-shadow: 0 1.2rem 3rem rgba(0,0,0,.18);
}
.gallery-image img {
  padding: clamp(.7rem,1.25vw,1.35rem);
  background: #eeeae2;
  object-fit: contain;
}
.gallery-caption { padding-top: .9rem; }
.gallery-caption strong { color: #ddd8cf; font-family: var(--serif); font-weight: 400; }
.gallery-caption span { color: #b2b4bd; }

.miami-context {
  border-color: var(--line);
  color: #d9d6cf;
  background:
    linear-gradient(120deg, rgba(19,48,113,.11), transparent 45%),
    #10131b;
}
.miami-copy .lead,
.cuban-context h3 { color: #ded9cf; font-family: var(--serif); }
.miami-copy > p:not(.lead),
.cuban-context > p:not(.label),
.art-links span { color: #8f929b; }
.art-links { border-color: #555962; }
.art-links a,
.institutions { border-color: var(--line); }
.art-links strong { color: #d9d5cc; font-family: var(--serif); font-weight: 400; }
.art-links a:hover { background: rgba(255,255,255,.025); }
.institutions a { border-color: #797b82; }

.commissions {
  border-color: var(--line);
  background:
    radial-gradient(circle at 13% 18%, rgba(145,32,49,.20), transparent 25rem),
    #07090f;
}
.commissions .lead,
.commission-steps h3 { font-family: var(--serif); }
.commissions-intro > p:not(.label),
.commission-steps p { color: #92959e; }
.commission-steps,
.commission-steps li { border-color: #2c303a; }

.artist {
  color: #d4d1ca;
  background: #11141c;
}
.artist-photo img,
.studio-photo img { filter: saturate(.72) contrast(1.06); }
.artist-copy .lead { color: #e4dfd6; font-family: var(--serif); }
.artist-copy p:not(.lead) { color: #9497a0; }
.artist .text-link { border-color: #777a83; }

.social-feature {
  display: grid;
  grid-template-columns: minmax(16rem,.8fr) minmax(18rem,1.2fr);
  align-items: center;
  gap: clamp(2.5rem,7vw,8rem);
  background:
    linear-gradient(120deg, rgba(18,56,142,.14), transparent 50%),
    #080a10;
}
.studio-video-copy h2 {
  margin: .7rem 0 1.3rem;
  color: #eeeae2;
  font-family: var(--serif);
  font-size: clamp(3rem,6vw,6.5rem);
  font-weight: 400;
  line-height: .92;
}
.studio-video-copy > p { max-width: 34rem; color: #92959e; line-height: 1.75; }
.social-card { border-color: #4b4f59; color: #dcd8d0; font-family: var(--serif); }
.social-card:hover { color: #fff; }
.studio-video { position: relative; width: min(100%,34rem); justify-self: center; }
.studio-video::before {
  content: "";
  position: absolute;
  inset: -1rem 1.2rem 2.2rem -1rem;
  border: 1px solid rgba(202,160,70,.42);
  transform: rotate(-1.7deg);
  pointer-events: none;
}
.studio-video video {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  max-height: 46rem;
  background: #03050a;
  box-shadow: 0 2rem 5rem rgba(0,0,0,.5);
}
.studio-video > a {
  position: relative;
  z-index: 2;
  display: block;
  margin: .9rem 0 0 auto;
  width: max-content;
  color: #d9d4ca;
  font-size: .72rem;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.answers { border-color: var(--line); }
.answer-list { border-color: #4b4f59; }
.answer-list details { border-color: var(--line); }
.answer-list summary { color: #d4d0c8; }
.answer-list summary::after { color: #b34a3d; }
.answer-list p { color: #898d96; }
.contact {
  background:
    radial-gradient(circle at 86% 30%, rgba(19,62,147,.16), transparent 26rem),
    #090b12;
}
.contact > p:not(.label) { color: #92959d; }
.contact-button { border-color: #444852; }
footer { border-color: #242831; background: #07090f; }

.lightbox { background: rgba(5,7,12,.98); }

@media (max-width: 1000px) {
  .surreal-hero { grid-template-columns: .8fr 1.2fr; gap: 2rem; }
  .surreal-copy h1 { font-size: clamp(4.5rem,10vw,7rem); }
  .threshold { grid-template-columns: 1fr 1fr; gap: 3rem; }
}

@media (max-width: 700px) {
  .site-header { height: 68px; }
  .language-switch a,
  .inquire-link { min-width: 44px; justify-content: center; }
  .brand { font-size: 1.1rem; }
  .surreal-hero {
    min-height: auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding: 4.5rem 1rem 5rem;
  }
  .surreal-copy h1 { font-size: clamp(4.8rem,23vw,7rem); }
  .surreal-copy .hero-intro { margin-block: 2.5rem 1.75rem; }
  .surreal-art { width: 88%; margin: 3rem auto 0; }
  .surreal-art img { height: 64svh; }
  .surreal-art > span { right: -.6rem; bottom: 1rem; }
  .hero-note { display: none; }
  .threshold {
    min-height: auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 3rem;
    padding: 5.5rem 1rem;
  }
  .instagram-feature,
  .social-feature { grid-template-columns: 1fr; }
  .instagram-feature { padding: 5rem 1rem; }
  .instagram-showcase { grid-template-columns: 1fr; }
  .instagram-post iframe { height: 39rem; }
  .studio-video { width: min(88vw,31rem); }
  .threshold > p { font-size: clamp(3.4rem,15vw,5.2rem); }
  .threshold button { width: 84%; align-self: end; }
  .gallery { gap: .65rem; }
}

@media (prefers-reduced-motion: reduce) {
  .surreal-art::before { transform: none; }
}

/* Amador signature composition */
.surreal-hero {
  min-height: max(820px, calc(100svh - 76px));
  display: block;
  padding: 0;
  background:
    linear-gradient(90deg, #07090f 0 13%, transparent 13%),
    linear-gradient(128deg, transparent 0 58%, rgba(136,27,43,.20) 58% 76%, transparent 76%),
    radial-gradient(circle at 73% 35%, rgba(18,80,205,.32), transparent 31%),
    #080a11;
}
.surreal-hero::before {
  z-index: 0;
  inset: 8% 4% 7% 11%;
  border: 1px solid rgba(230,225,216,.12);
  background:
    linear-gradient(90deg, transparent 49.8%, rgba(230,225,216,.08) 50%, transparent 50.2%),
    linear-gradient(transparent 49.8%, rgba(230,225,216,.08) 50%, transparent 50.2%);
}
.hero-atmosphere {
  z-index: 0;
  inset: 0;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.hero-atmosphere i {
  position: absolute;
  display: block;
  border-radius: 50%;
  pointer-events: none;
}
.hero-atmosphere i:nth-child(1) {
  width: min(44vw, 42rem);
  height: min(44vw, 42rem);
  right: 17%;
  top: 8%;
  border: 1px solid rgba(232,226,214,.13);
  box-shadow: 0 0 0 2.4rem rgba(19,67,170,.055), 0 0 0 8rem rgba(19,67,170,.025);
}
.hero-atmosphere i:nth-child(2) {
  width: 15rem;
  height: 15rem;
  right: -4rem;
  bottom: 8%;
  background: #9b2935;
  filter: blur(.2px);
  opacity: .72;
}
.hero-atmosphere i:nth-child(3) {
  width: 8.5rem;
  height: 8.5rem;
  left: 37%;
  bottom: 4%;
  border: 1.5rem solid #c6a354;
  opacity: .78;
}
.vertical-signature {
  position: absolute;
  z-index: 6;
  left: 2.4rem;
  bottom: 2.5rem;
  margin: 0;
  color: #696d77;
  font-size: .62rem;
  font-weight: 500;
  letter-spacing: .24em;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}
.surreal-copy {
  position: absolute;
  z-index: 8;
  left: clamp(1.2rem,5vw,6rem);
  top: 12%;
  width: min(46vw,48rem);
  pointer-events: none;
}
.surreal-copy > * { pointer-events: auto; }
.hero-kicker {
  display: inline-block;
  margin: 0 0 2.2rem 1.25rem;
  padding: .55rem .75rem;
  color: #0b0d13;
  background: #d1ad55;
  font-size: .66rem;
  letter-spacing: .18em;
}
.surreal-copy h1 {
  color: #f0ede5;
  font-size: clamp(6.3rem,11.6vw,13.5rem);
  line-height: .62;
  text-shadow: 0 1rem 4rem rgba(0,0,0,.55);
}
.surreal-copy h1 span { transform: translateX(-.02em); }
.surreal-copy h1 em {
  margin: .18em 0 0 .42em;
  color: #d9d3c8;
  -webkit-text-stroke: 0;
  text-stroke: 0;
}
.surreal-copy .hero-intro {
  width: min(29rem,80%);
  margin: 4.4rem 0 1.8rem 1.4rem;
  color: #d2cec5;
  font-size: clamp(1.3rem,1.8vw,1.75rem);
  text-wrap: balance;
}
.hero-link {
  position: relative;
  z-index: 20;
  margin-left: 1.4rem;
  padding-right: 2.4rem;
}
.artist-presence {
  position: absolute;
  z-index: 12;
  right: clamp(1.2rem,3.2vw,3.8rem);
  top: 5.8rem;
  width: clamp(10.5rem,12.5vw,14rem);
  margin: 0;
  padding: .45rem;
  color: #10121a;
  background: #e9e4da;
  box-shadow: 0 1.5rem 4rem rgba(0,0,0,.42);
  transform: rotate(2.5deg);
}
.artist-presence img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: 69% 35%;
  filter: saturate(.72) contrast(1.06);
}
.artist-presence figcaption {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  align-items: end;
  padding: .55rem .15rem .1rem;
  font-size: .56rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.artist-presence figcaption span { color: #6b6b69; }
.artist-presence figcaption b { font-weight: 600; text-align: right; }
.dream-collage {
  position: absolute;
  z-index: 4;
  inset: 7% 2.5% 5% 26%;
}
.dream-collage::before {
  content: "";
  position: absolute;
  inset: 8% 6% 4% 18%;
  border-radius: 50% 46% 44% 55% / 42% 56% 44% 58%;
  background: linear-gradient(145deg, #123c92 8%, #0a1740 53%, #651b2b 100%);
  filter: saturate(1.15);
  transform: rotate(-7deg);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12), 0 3rem 8rem rgba(0,0,0,.55);
}
.collage-art {
  position: absolute;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
  transition: transform .45s ease, filter .45s ease;
}
.collage-art:hover { z-index: 10; filter: brightness(1.08); }
.collage-art img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #f5f2eb;
  box-shadow: 0 2.5rem 6rem rgba(0,0,0,.6);
}
.collage-art-main {
  z-index: 5;
  width: min(34vw,34rem);
  height: 76%;
  right: 17%;
  top: 4%;
  transform: rotate(-1.5deg);
}
.collage-art-main:hover { transform: rotate(0) translateY(-.7rem); }
.collage-art-left {
  z-index: 3;
  width: min(24vw,25rem);
  height: 39%;
  left: 7%;
  bottom: 5%;
  transform: rotate(-7deg);
}
.collage-art-left:hover { transform: rotate(-3deg) translateY(-.7rem); }
.collage-art-right {
  z-index: 6;
  width: min(27vw,28rem);
  height: 34%;
  right: 0;
  bottom: 3%;
  transform: rotate(4.5deg);
}
.collage-art-right:hover { transform: rotate(1deg) translateY(-.7rem); }
.collage-art-main > span {
  position: absolute;
  right: -1.2rem;
  bottom: 2.3rem;
  display: flex;
  flex-direction: column;
  padding: .8rem 1rem;
  color: #eee9de;
  background: #741f31;
  text-align: left;
}
.collage-art-main b { font-size: .66rem; letter-spacing: .16em; }
.collage-art-main i { font-family: var(--serif); font-size: .92rem; }
.hero-note {
  z-index: 9;
  right: 1.25rem;
  bottom: 31%;
  color: #9a9ca4;
}

.threshold {
  min-height: 920px;
  display: block;
  overflow: hidden;
  padding: 0;
  background:
    linear-gradient(90deg, #151826 0 42%, #e7e0d1 42% 100%);
}
.threshold::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 8% 5% 8% 5%;
  border: 1px solid rgba(83,57,48,.22);
  pointer-events: none;
}
.threshold-type {
  position: absolute;
  z-index: 5;
  left: clamp(1.25rem,5vw,6rem);
  top: 12%;
  width: min(49rem,51vw);
}
.threshold-index {
  margin: 0 0 5rem;
  color: #858996;
  font-size: .65rem;
  letter-spacing: .19em;
  text-transform: uppercase;
}
.threshold-line {
  margin: 0;
  color: #f0ece4;
  font-family: var(--serif);
  font-size: clamp(4.4rem,7.4vw,9rem);
  line-height: .75;
  letter-spacing: -.055em;
}
.threshold-line span,
.threshold-line em { display: block; }
.threshold-line em {
  margin-left: .48em;
  color: transparent;
  font-weight: 400;
  -webkit-text-stroke: 1px rgba(240,236,228,.66);
}
.threshold-line-alt {
  margin: 1.05em 0 0 1.5em;
  color: #741e2d;
  font-size: clamp(3.2rem,5.6vw,6.4rem);
}
.threshold-line-alt em {
  color: #1a1c24;
  -webkit-text-stroke: 0;
}
.threshold-violin,
.threshold-miami {
  position: absolute;
  z-index: 3;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
}
.threshold-violin {
  width: min(31vw,31rem);
  height: 72%;
  right: 7%;
  top: 11%;
  transform: rotate(2.4deg);
}
.threshold-miami {
  width: min(22vw,22rem);
  height: 43%;
  left: 36%;
  bottom: 5%;
  transform: rotate(-4.5deg);
}
.threshold-violin img,
.threshold-miami img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #f6f2e9;
  box-shadow: 0 2.5rem 6rem rgba(0,0,0,.32);
}
.threshold-violin span,
.threshold-miami span {
  position: absolute;
  display: block;
  padding: .6rem .75rem;
  color: #ebe6db;
  background: #11141e;
  font-size: .62rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  white-space: nowrap;
}
.threshold-violin span { right: -1.5rem; bottom: 3rem; }
.threshold-miami span { left: -2rem; bottom: 1.2rem; background: #8b2332; }
.threshold-orbit {
  position: absolute;
  z-index: 1;
  width: 29rem;
  height: 29rem;
  right: 25%;
  top: 28%;
  border: 1px solid rgba(116,30,45,.35);
  border-radius: 50%;
  box-shadow: 0 0 0 4rem rgba(116,30,45,.04), 0 0 0 10rem rgba(21,24,38,.03);
}

/* Complete archive */
.archive-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at 82% 8%, rgba(24,67,164,.22), transparent 28rem),
    radial-gradient(circle at 8% 24%, rgba(137,31,46,.14), transparent 24rem),
    #080a10;
}
.archive-hero {
  min-height: 58vh;
  display: flex;
  flex-direction: column;
  justify-content: end;
  padding: clamp(7rem,13vw,13rem) clamp(1.25rem,5vw,6rem) clamp(4rem,7vw,7rem);
  border-bottom: 1px solid var(--line);
}
.archive-hero h1 {
  max-width: 10ch;
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(4.8rem,11vw,11rem);
  font-weight: 400;
  line-height: .82;
  letter-spacing: -.06em;
}
.archive-hero > p:last-child {
  max-width: 42rem;
  margin: 2.5rem 0 0;
  color: #9b9ea7;
  font-size: clamp(1.05rem,1.7vw,1.35rem);
}
.archive-page .works { border-top: 0; }

@media (max-width: 1000px) {
  .surreal-hero { min-height: 780px; }
  .surreal-copy { top: 10%; width: 55vw; }
  .surreal-copy h1 { font-size: clamp(5.5rem,13vw,9rem); }
  .dream-collage { left: 22%; }
  .collage-art-main { width: 40vw; right: 10%; }
  .collage-art-left { width: 29vw; left: 3%; }
  .collage-art-right { width: 31vw; }
  .threshold { min-height: 820px; }
  .threshold-type { width: 59vw; }
  .threshold-violin { width: 36vw; right: 3%; }
  .threshold-miami { width: 25vw; left: 35%; }
}

@media (max-width: 700px) {
  .archive-hero {
    min-height: 54vh;
    padding-top: 7rem;
  }
  .archive-hero h1 { font-size: clamp(4.4rem,21vw,6.4rem); }
  .surreal-hero {
    min-height: 1450px;
    display: block;
    padding: 0;
  }
  .surreal-hero::before { inset: 3.5rem .75rem 2rem; }
  .vertical-signature { left: .4rem; bottom: 2rem; }
  .surreal-copy {
    position: relative;
    left: auto;
    top: auto;
    width: auto;
    padding: 4.5rem 1rem 0;
  }
  .hero-kicker { margin: 0 0 1.8rem .4rem; }
  .surreal-copy h1 { font-size: clamp(5.1rem,24vw,7rem); }
  .surreal-copy h1 em { margin-left: .18em; }
  .surreal-copy .hero-intro { width: 76%; margin: 2.5rem 0 1.4rem .4rem; }
  .hero-link { margin-left: .4rem; }
  .artist-presence {
    position: relative;
    right: auto;
    top: auto;
    width: 13rem;
    margin: -2.75rem .75rem 0 auto;
    transform: rotate(2deg);
  }
  .dream-collage { inset: auto .5rem 2rem 1rem; height: 44%; }
  .dream-collage::before { inset: 10% 4% 7% 12%; }
  .collage-art-main { width: 57vw; height: 78%; right: 10%; top: 2%; }
  .collage-art-left { width: 43vw; height: 36%; left: 0; bottom: 2%; }
  .collage-art-right { width: 45vw; height: 31%; right: 0; bottom: 1%; }
  .hero-atmosphere i:nth-child(1) { width: 21rem; height: 21rem; right: -4rem; top: 29%; }
  .hero-atmosphere i:nth-child(2) { width: 8rem; height: 8rem; right: -3rem; }
  .hero-atmosphere i:nth-child(3) { width: 5rem; height: 5rem; left: 20%; border-width: .8rem; }
  .hero-note { display: none; }

  .threshold {
    min-height: 1050px;
    display: block;
    padding: 0;
    background: linear-gradient(180deg, #151826 0 53%, #e7e0d1 53% 100%);
  }
  .threshold-type { left: 1rem; top: 6rem; width: calc(100% - 2rem); }
  .threshold-index { margin-bottom: 2.7rem; }
  .threshold-line { font-size: clamp(3.9rem,17vw,5.4rem); }
  .threshold-line-alt { margin: .9em 0 0 .55em; font-size: clamp(3rem,13vw,4.2rem); }
  .threshold-violin { width: 57vw; height: 46%; right: 3%; top: 50%; }
  .threshold-miami { width: 44vw; height: 30%; left: 4%; bottom: 3%; }
  .threshold-orbit { width: 16rem; height: 16rem; right: 5%; top: 59%; }
  .threshold-violin span { right: -.5rem; bottom: 2rem; }
  .threshold-miami span { left: -.4rem; bottom: 1rem; white-space: normal; }
}