.studio-page {
  --studio-gutter: clamp(20px, 5vw, 72px);
  background: var(--black, #060606);
}

.studio-hero {
  padding-block: clamp(56px, 10vw, 132px) clamp(48px, 8vw, 96px);
  border-bottom: 1px solid var(--hr-border);
}

.studio-hero__grid,
.studio-request__grid {
  width: min(1180px, calc(100% - var(--studio-gutter) * 2));
  margin-inline: auto;
}

.studio-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(300px, .78fr);
  gap: clamp(36px, 8vw, 112px);
  align-items: end;
}

.studio-hero__copy { align-items: start; }
.studio-hero__copy h1 { margin: 0; max-width: 8ch; line-height: .9; }
.studio-hero__copy h1 em { color: var(--red); font-style: normal; }
.studio-hero__copy .hr-subtitle { max-width: 560px; }

.studio-hero__visual { margin: 0; padding: 0; overflow: hidden; background: #111; }
.studio-hero__visual img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; filter: saturate(.78) contrast(1.05); }
.studio-hero__visual figcaption { display: flex; padding: 14px 16px; color: var(--hr-muted); font: 11px/1.4 var(--font-mono); }

.studio-services { padding-block: clamp(56px, 9vw, 110px); }
.studio-section-heading { display: grid; gap: 12px; max-width: 700px; }
.studio-section-heading h2 { margin: 0; }
.studio-section-heading p { margin: 0; }
.studio-services__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.studio-service-card { min-width: 0; min-height: 320px; padding: 18px; display: flex; flex-direction: column; gap: 18px; background: linear-gradient(150deg, rgba(255,255,255,.045), rgba(255,255,255,.012)); }
.studio-service-card__index { color: var(--red); font: 12px/1 var(--font-mono); }
.studio-service-card__body { display: grid; gap: 10px; flex: 1; }
.studio-service-card__body .hr-eyebrow { margin: 0; }
.studio-service-card h3 { margin: 0; font: 700 clamp(15px, 1.5vw, 19px)/1.1 var(--font-display); text-transform: uppercase; }
.studio-service-card p:not(.hr-eyebrow) { margin: 0; color: var(--hr-muted); font: 12px/1.55 var(--font-mono); }
.studio-service-card__price { color: var(--white); font: 700 20px/1.1 var(--font-display); }
.studio-service-card__price small { display: block; margin-top: 5px; color: var(--hr-muted); font: 10px/1.2 var(--font-mono); }
.studio-service-card .hr-btn { width: 100%; min-height: 42px; }

.studio-request { padding-block: clamp(56px, 9vw, 110px); background: linear-gradient(120deg, rgba(219,1,0,.09), transparent 48%); border-block: 1px solid var(--hr-border); }
.studio-request__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(320px, .72fr); gap: clamp(32px, 8vw, 110px); align-items: start; }
.studio-request__intro h2 { margin: 0; }
.studio-request__intro .hr-subtitle { max-width: 480px; }
.studio-request__steps { display: grid; gap: 14px; padding: 0; margin: 14px 0 0; list-style: none; }
.studio-request__steps li { display: grid; grid-template-columns: minmax(92px, auto) 1fr; gap: 10px; align-items: baseline; padding-top: 10px; border-top: 1px solid var(--hr-border); }
.studio-request__steps strong { font: 700 11px var(--font-display); text-transform: uppercase; }
.studio-request__steps small { color: var(--hr-muted); font: 11px var(--font-mono); }
.studio-request__form { display: grid; gap: 16px; padding: clamp(20px, 4vw, 34px); }
.studio-form__top { display: flex; justify-content: space-between; gap: 16px; align-items: end; padding-bottom: 8px; border-bottom: 1px solid var(--hr-border); }
.studio-form__top p { margin: 0; }
.studio-form__price { color: var(--teal); font: 700 clamp(14px, 2vw, 20px)/1.2 var(--font-display); text-align: right; }
.studio-form__hint { margin: -4px 0 0; color: var(--hr-muted); font: 10px/1.5 var(--font-mono); }
.studio-request__result { display: grid; gap: 10px; padding: 14px; border: 1px solid rgba(0,219,62,.45); background: rgba(0,219,62,.06); }
.studio-request__result strong { color: var(--green); font: 700 13px var(--font-display); text-transform: uppercase; }
.studio-request__result p { margin: 0; color: var(--hr-muted); font: 11px/1.5 var(--font-mono); }
.studio-request__result .hr-btn { width: 100%; }

.studio-note { padding-block: clamp(34px, 6vw, 72px); }
.studio-note__inner { width: min(1180px, calc(100% - var(--studio-gutter) * 2)); margin-inline: auto; padding: clamp(22px, 4vw, 40px); display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1fr); gap: 28px; align-items: center; background: rgba(255,255,255,.025); }
.studio-note__inner h2 { margin: 0; }
.studio-note__inner > p { margin: 0; color: var(--hr-muted); font: 12px/1.7 var(--font-mono); }

@media (max-width: 1050px) {
  .studio-services__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .studio-hero__grid,
  .studio-request__grid,
  .studio-note__inner { grid-template-columns: 1fr; }
  .studio-hero__visual { max-width: 560px; }
  .studio-services__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .studio-request__grid { gap: 42px; }
  .studio-form__top { align-items: start; flex-direction: column; }
  .studio-form__price { text-align: left; }
}

@media (max-width: 480px) {
  .studio-services__grid { grid-template-columns: 1fr; }
  .studio-service-card { min-height: 0; }
  .studio-request__steps li { grid-template-columns: 1fr; }
  .studio-request__steps small { grid-column: 1; }
}