/* Keep the full device composition in view at each Services breakpoint. */
.studio-site .studio-split .services-hero-photo {
  display: grid;
  place-items: center;
  background: var(--band);
}

.studio-site .studio-split .services-hero-photo::after { content: none; }

.studio-site .studio-split .services-hero-photo img {
  position: static;
  width: 100%;
  height: auto;
  max-height: clamp(20rem, 34vw, 32rem);
  aspect-ratio: auto;
  object-fit: contain;
}

@media (min-width: 901px) {
  .studio-site .studio-photo-intro.studio-split {
    grid-template-columns: minmax(0, .53fr) minmax(0, .47fr);
  }

  .studio-site .studio-photo-intro.studio-split h1 {
    font-size: clamp(3.4rem, 6.55vw, 7.75rem);
    line-height: .99;
  }

  .studio-site .studio-photo-intro .studio-split-description {
    font-size: clamp(1rem, 1.52vw, 1.4rem);
    max-width: 43ch;
  }
}

.studio-photo-intro .intro-actions .action { min-block-size: 44px; }

.website-package-list .price-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto auto 1fr auto;
  gap: .4rem .6rem;
  padding: clamp(.75rem, 1.6vw, 1.15rem);
}
.website-package-list .price-row > h3 { align-self: center; }
.website-package-list .price-row > strong {
  align-self: center;
  font-size: clamp(1.55rem, 2.55vw, 2.45rem);
}
.website-package-list .price-row > p { grid-column: 1 / -1; margin: 0; }
.website-package-list .price-row > .tile-meta { grid-column: 1 / -1; margin-top: .12rem; }
.package-example {
  grid-column: 1 / -1;
  align-self: stretch;
  min-height: 6rem;
  display: grid;
  grid-template-columns: clamp(5.25rem, 25%, 9rem) minmax(0, 1fr);
  background: var(--band);
  border: 1px solid var(--rule);
}
.package-example:hover, .package-example:focus-visible { border-color: var(--accent); }
.package-example-art {
  position: relative;
  display: block;
  background: var(--panel);
  border-inline-end: 1px solid var(--detail-rule);
}
.package-example-art img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: .25rem;
  object-fit: contain;
}
.package-example-copy { display: grid; align-content: center; gap: .19rem; padding: .45rem .68rem; }
.package-example-name { font: 400 clamp(1.27rem, 2.05vw, 1.74rem)/1.04 var(--display); }
.package-example-description { color: var(--muted); font-size: .79rem; line-height: 1.32; }
.package-example-link { color: var(--accent); font-size: .74rem; font-weight: 650; }
.package-example:is(:hover, :focus-visible) .package-example-link { text-decoration: underline; text-underline-offset: .17em; }
.package-browse { margin-top: .75rem; }
@media (min-width: 761px) {
  .website-package-list .price-row { grid-row: span 4; grid-template-rows: subgrid; padding-block: 0; }
  .website-package-list .price-row > :is(h3,strong) { margin-block-start: .85rem; }
  .website-package-list .price-row > .tile-meta { margin-block-end: .75rem; }
}
@media (max-width: 760px) {
  .website-package-list { grid-template-columns: minmax(0, 1fr); }
  .website-package-list .price-row:nth-child(even) { border-inline-start: 0; }
  .website-package-list .price-row + .price-row { border-block-start: 1px solid var(--rule); }
  .website-package-list .price-row h3 { font-size: .95rem; }
}