.page-hero {
  padding: 2.4rem 6vw 2rem;
  background: var(--white);
}

.page-hero .kicker {
  color: var(--alloy);
  margin-bottom: 0.8rem;
  display: block;
}

.page-hero h1 {
  font-size: clamp(2.6rem, 7vw, 6rem);
  max-width: 16ch;
  font-variation-settings: "wdth" 82, "wght" 800;
}

.page-hero.wide h1 {
  max-width: none;
  font-variation-settings: "wdth" 128, "wght" 700;
  font-size: clamp(1.8rem, 4.8vw, 3.6rem);
  line-height: 1.12;
}

.series-block {
  padding: 4.2rem 6vw;
}

.series-block h2 {
  font-family: var(--display);
  font-size: clamp(2rem, 5vw, 4.4rem);
  margin-bottom: 1rem;
}

.series-grid {
  display: grid;
  gap: 1.4rem 2.4rem;
  margin-top: 1.6rem;
}

.series-grid div h3 {
  font-family: var(--mono);
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--alloy);
  margin-bottom: 0.35rem;
}

.s-wide {
  background: var(--ice);
  min-height: 88vh;
}

.s-wide h2 {
  font-variation-settings: "wdth" 140, "wght" 650;
  max-width: none;
}

.s-wide .series-grid {
  grid-template-columns: 1.2fr 0.8fr 1fr;
}

.s-dark {
  background: var(--navy);
  color: var(--white);
  padding: 4rem 18vw 4rem 22vw;
  min-height: 70vh;
}

.s-dark h2 {
  font-variation-settings: "wdth" 72, "wght" 800;
  font-size: clamp(1.8rem, 4vw, 3.2rem);
}

.s-dark .series-grid {
  grid-template-columns: 1fr;
  max-width: 46ch;
}

.s-cyan {
  background: var(--cyan);
  color: var(--navy);
  min-height: 90vh;
  padding: 0;
}

.s-cyan .series-copy {
  padding: 3.5rem 6vw 1.5rem;
}

.s-cyan img {
  width: 100%;
  height: 42vh;
  object-fit: cover;
}

.s-cyan .series-grid {
  grid-template-columns: 1fr 1fr;
  padding: 0 6vw 3.5rem;
}

.s-white {
  background: var(--white);
  min-height: 80vh;
}

.s-white .series-grid {
  grid-template-columns: 1fr;
  max-width: 62ch;
}

.s-white h2 {
  font-variation-settings: "wdth" 100, "wght" 800;
  max-width: 12ch;
}

.s-orange {
  background: var(--orange);
  color: var(--navy);
  min-height: 62vh;
  padding: 4rem 8vw 4rem 10vw;
}

.s-orange h2 {
  font-variation-settings: "wdth" 118, "wght" 800;
}

.s-orange .series-grid {
  grid-template-columns: 1.4fr 0.8fr;
}

.doc-lead {
  padding: 1rem 10vw 3rem 6vw;
  font-size: clamp(1.4rem, 2.6vw, 2.05rem);
  line-height: 1.35;
  max-width: 28ch;
  font-variation-settings: "wdth" 118, "wght" 600;
  font-family: var(--display);
}

.doc-wide {
  width: 100%;
  height: 46vh;
  object-fit: cover;
}

.doc-narrow {
  width: 38%;
  margin: 3.5rem 0 3.5rem 12%;
  font-size: 1.05rem;
}

.doc-open {
  min-height: 40vh;
  background: var(--white);
}

.doc-principles {
  display: grid;
  grid-template-columns: 1.4fr 1fr 0.8fr;
  gap: 1.5rem;
  padding: 2rem 6vw 4rem;
}

.doc-principles article {
  padding: 1.3rem 0;
  border-top: 1px solid var(--alloy);
}

.doc-principles h2 {
  font-family: var(--display);
  font-size: 1.5rem;
  margin-bottom: 0.5rem;
}

.doc-tech {
  background: var(--navy);
  color: var(--white);
  padding: 3.5rem 6vw;
  display: grid;
  grid-template-columns: 0.7fr 1.3fr;
  gap: 2rem;
}

.doc-geo {
  background: var(--ice);
  padding: 4rem 6vw;
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 2rem;
  align-items: center;
}

.doc-geo img {
  width: 100%;
  height: 48vh;
  object-fit: cover;
}

.work-case {
  margin: 0;
}

.wc-fast {
  padding: 0 0 3rem;
}

.wc-fast img {
  width: 100%;
  height: 56vh;
  object-fit: cover;
}

.wc-fast .txt {
  padding: 1.4rem 6vw 0;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 1.2rem;
}

.wc-comp {
  background: var(--navy);
  color: var(--white);
  padding: 3.5rem 22vw 3.5rem 18vw;
}

.wc-comp h2 {
  font-variation-settings: "wdth" 74, "wght" 800;
  font-size: clamp(1.8rem, 4vw, 3rem);
  margin-bottom: 1rem;
}

.wc-min {
  min-height: 70vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.2rem;
  padding: 3rem 6vw;
}

.wc-min img {
  width: min(36vw, 380px);
}

.wc-dense {
  background: var(--carbon);
  color: var(--white);
  padding: 0;
}

.wc-dense img {
  width: 100%;
  height: 32vh;
  object-fit: cover;
}

.wc-dense .txt {
  padding: 2rem 8vw 3rem;
  columns: 2;
  gap: 2rem;
}

.wc-dense h2 {
  columns: 1;
  font-size: 2.4rem;
  margin-bottom: 1rem;
}

.wc-image {
  position: relative;
}

.wc-image img {
  width: 100%;
  height: 62vh;
  object-fit: cover;
}

.wc-image .overlay {
  position: absolute;
  left: 6vw;
  bottom: 8%;
  max-width: 36ch;
  color: var(--white);
}

.contact-open {
  padding: 2rem 6vw 3rem;
}

.contact-open h1 {
  font-size: clamp(2.4rem, 6vw, 5.2rem);
  font-variation-settings: "wdth" 90, "wght" 800;
  max-width: 14ch;
}

.contact-meta {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  padding: 0 6vw 1.2rem;
}

.contact-rule {
  height: 1px;
  background: var(--alloy);
  margin: 0 4vw 2.8rem;
}

.form-surface {
  padding: 0 6vw 5rem;
}

.form-surface h2 {
  font-family: var(--display);
  font-size: 1.8rem;
  margin-bottom: 1.6rem;
  font-variation-settings: "wdth" 110, "wght" 800;
}

.field {
  margin-bottom: 1.6rem;
}

.field label {
  display: block;
  font-family: var(--mono);
  font-size: 0.66rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--carbon);
  margin-bottom: 0.45rem;
}

.field input,
.field textarea,
.field select {
  width: 100%;
  border: 0;
  border-bottom: 1.5px solid var(--alloy);
  background: transparent;
  border-radius: 0;
  padding: 0.55rem 0 0.7rem;
  color: var(--navy);
}

.field input:focus,
.field textarea:focus,
.field select:focus {
  outline: none;
  border-bottom-color: var(--cyan);
}

.field.is-focus {
  position: relative;
}

.field.is-focus::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 6px;
  height: 6px;
  background: var(--orange);
}

.field.is-error input,
.field.is-error textarea {
  border-bottom-color: var(--oxide);
}

.field .err {
  display: none;
  color: var(--oxide);
  font-size: 0.82rem;
  margin-top: 0.35rem;
}

.field.is-error .err {
  display: block;
}

.field-name { width: 40%; }
.field-email { width: 55%; margin-left: 8%; }
.field-service { width: 48%; }
.field-message { width: 90%; }

.form-row {
  display: flex;
  align-items: flex-end;
  gap: 0;
  flex-wrap: wrap;
}

.form-success {
  display: none;
  background: var(--green);
  color: var(--white);
  padding: 1rem 1.2rem;
  margin-bottom: 1.2rem;
}

.form-success.is-on {
  display: block;
}

.privacy {
  padding: 3rem 6vw 5rem;
  max-width: 68ch;
}

.privacy h1 {
  font-size: 2.6rem;
  margin-bottom: 1rem;
}

.privacy h2 {
  margin: 1.6rem 0 0.5rem;
  font-size: 1.3rem;
}

@media (max-width: 900px) {
  .s-wide .series-grid,
  .s-cyan .series-grid,
  .s-orange .series-grid,
  .doc-principles,
  .doc-tech,
  .doc-geo,
  .wc-fast .txt,
  .contact-meta {
    grid-template-columns: 1fr;
  }

  .s-dark,
  .wc-comp,
  .doc-narrow {
    width: auto;
    padding-left: 1.2rem;
    padding-right: 1.2rem;
    margin-left: 0;
  }

  .field-name,
  .field-email,
  .field-service,
  .field-message {
    width: 100%;
    margin-left: 0;
  }

  .wc-dense .txt {
    columns: 1;
  }
}

@media (max-width: 760px) {
  .page-hero,
  .series-block,
  .contact-open,
  .form-surface {
    padding-left: 1.1rem;
    padding-right: 1.1rem;
  }
}