/* The inquiry form and the sub-pages. Loaded only where it is used, so the
   landing page does not carry it. */

.dmy-start { display: grid; gap: var(--sc-8); grid-template-columns: 1fr; align-items: start; }
@media (min-width: 62rem) { .dmy-start { grid-template-columns: 1fr 26rem; gap: var(--sc-10); } }

.dmy-form { display: flex; flex-direction: column; gap: var(--sc-4); }
.dmy-form__hp { position: absolute; left: -9999px; }
.dmy-form__note { color: var(--sc-ink-soft); font-size: var(--sc-t-xs); margin-top: var(--sc-2); }

.dmy-field { display: flex; flex-direction: column; gap: var(--sc-2); }
.dmy-field label {
  font-size: var(--sc-t-xs); font-weight: 600;
  letter-spacing: var(--sc-track-wide); text-transform: uppercase;
  color: var(--sc-ink-soft);
}
.dmy-field input,
.dmy-field select,
.dmy-field textarea {
  width: 100%;
  font: inherit; font-size: var(--sc-t-base);
  color: var(--sc-ink);
  background: #FBFAF7;
  border: 1px solid var(--dmy-hair);
  border-radius: var(--sc-r-sm);
  padding: 0.7rem 0.85rem;
  transition: border-color var(--sc-d-fast) var(--sc-ease-out), background var(--sc-d-fast) linear;
}
.dmy-field textarea { resize: vertical; min-height: 7rem; line-height: 1.55; }
.dmy-field input:hover,
.dmy-field select:hover,
.dmy-field textarea:hover { border-color: color-mix(in oklab, var(--sc-ink) 28%, transparent); }
.dmy-field input:focus-visible,
.dmy-field select:focus-visible,
.dmy-field textarea:focus-visible { background: #fff; border-color: var(--sc-accent); }
.dmy-field input::placeholder, .dmy-field textarea::placeholder { color: color-mix(in oklab, var(--sc-ink) 38%, transparent); }
.dmy-field input:disabled, .dmy-field textarea:disabled { opacity: 0.55; cursor: not-allowed; }

.dmy-form .dmy-cta { align-self: start; margin-top: var(--sc-2); }

/* ------------------------------------------------------- case study page -- */
.dmy-case__head { max-width: 46rem; }
.dmy-case__lede { font-size: var(--sc-t-lg); line-height: 1.42; margin-top: var(--sc-5); text-wrap: pretty; }
.dmy-case__grid { display: grid; gap: var(--sc-7) var(--sc-8); grid-template-columns: 1fr; margin-top: var(--sc-8); }
@media (min-width: 62rem) { .dmy-case__grid { grid-template-columns: 1fr 20rem; } }
.dmy-case__body h2 {
  font-family: var(--sc-font-display); font-weight: 400;
  font-size: var(--sc-t-xl); letter-spacing: var(--sc-track-snug); line-height: 1.1;
  /* More space above a heading than below it: the gap belongs to the boundary
     between sections, not to the heading-and-body pair. */
  margin-block: var(--sc-8) var(--sc-4);
}
.dmy-case__body h2:first-child { margin-block-start: 0; }
.dmy-case__body p { max-width: var(--sc-measure); text-wrap: pretty; }
.dmy-case__body p + p { margin-top: var(--sc-4); }
.dmy-case__body ul { margin: var(--sc-4) 0 0; padding-left: 1.1rem; max-width: var(--sc-measure); }
.dmy-case__body li { margin-bottom: var(--sc-2); }
.dmy-case__aside { position: sticky; top: var(--sc-6); align-self: start; }
.dmy-case__shots { display: grid; gap: var(--sc-5); margin-top: var(--sc-8); }
@media (min-width: 48rem) { .dmy-case__shots { grid-template-columns: 1fr 1fr; } }
.dmy-case__shots figure:first-child { grid-column: 1 / -1; }

.dmy-back {
  display: inline-block; font-size: var(--sc-t-xs);
  letter-spacing: 0.06em; text-transform: uppercase; font-weight: 600;
  color: var(--sc-ink-soft); text-decoration: none; margin-bottom: var(--sc-5);
}
.dmy-back:hover { color: var(--sc-ink); }

.dmy-note {
  border-left: 1px solid var(--sc-accent);
  padding: var(--sc-1) 0 var(--sc-1) var(--sc-4);
  margin-top: var(--sc-6);
  color: var(--sc-ink-soft);
  font-size: var(--sc-t-sm);
  max-width: 48ch;
}

/* ------------------------------------------------------------- thanks ----- */
.dmy-thanks { min-height: 68vh; display: flex; align-items: center; }