/* Brand landing page: an editorial shell around the existing product market. */
.landing-page {
  --brand-blue: #0e5f82;
  --brand-cyan: #009ed0;
  --brand-ink: #0f172a;
  --brand-muted: #4d6378;
  --brand-line: #d9e7f5;
  background: #fff;
}

.brand-container {
  width: min(1120px, calc(100% - 48px));
  margin: 0 auto;
}

.brand-eyebrow {
  display: inline-block;
  color: var(--brand-blue);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .1em;
}

.brand-hero {
  position: relative;
  overflow: hidden;
  padding: 76px 0 82px;
  border-bottom: 1px solid var(--brand-line);
  background: linear-gradient(180deg, #edf6ff 0%, #f8fbff 62%, #fff 100%);
}

.brand-hero::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(17, 105, 232, .18), transparent);
}

.brand-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(390px, .96fr);
  gap: 64px;
  align-items: center;
}

.brand-hero-copy {
  min-width: 0;
}

.brand-hero-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 29px;
}

.brand-hero-tags span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 5px 10px;
  border: 1px solid rgba(172, 205, 236, .9);
  border-radius: 4px;
  background: rgba(255, 255, 255, .68);
  color: #375674;
  font-size: 11px;
  line-height: 1.35;
}

.brand-hero-tags svg {
  width: 13px;
  height: 13px;
  color: var(--brand-blue);
}

.brand-hero .hero-title {
  max-width: 640px;
  margin: 13px 0 20px;
  color: var(--brand-ink);
  font-size: 56px;
  font-weight: 650;
  line-height: 1.13;
  letter-spacing: 0;
}

.brand-hero .hero-title span {
  color: var(--brand-ink);
}

.brand-hero-lead {
  max-width: 600px;
  margin-bottom: 28px;
  color: var(--brand-muted);
  font-size: 15px;
  line-height: 1.9;
}

.brand-hero-actions {
  gap: 11px;
}

.brand-hero-actions .button {
  min-height: 46px;
  padding-inline: 18px;
}

.brand-hero-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: 520px;
  margin-top: 36px;
  padding-top: 22px;
  border-top: 1px solid rgba(169, 201, 229, .72);
}

.brand-hero-facts span {
  display: grid;
  gap: 1px;
}

.brand-hero-facts strong {
  color: var(--brand-ink);
  font-size: 21px;
  font-weight: 650;
  line-height: 1.25;
}

.brand-hero-facts small {
  color: var(--brand-muted);
  font-size: 10px;
  line-height: 1.5;
}

.brand-hero-visual {
  min-width: 0;
}

.brand-console {
  overflow: hidden;
  border: 1px solid rgba(164, 201, 235, .92);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 28px 70px rgba(31, 101, 171, .16), 0 2px 8px rgba(31, 101, 171, .05);
}

.brand-console-bar {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  min-height: 38px;
  padding: 0 14px;
  border-bottom: 1px solid #e5eef8;
  background: #f8fbff;
  color: #526b85;
  font-size: 9px;
}

.brand-console-dots {
  display: flex;
  gap: 5px;
}

.brand-console-dots i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #c8d8e9;
}

.brand-console-live {
  justify-self: end;
  color: #16804a;
}

.brand-console-live::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 5px;
  border-radius: 50%;
  background: #20a765;
}

.brand-console-body {
  padding: 22px;
}

.brand-console-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.brand-console-heading div {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.brand-console-heading small {
  color: var(--brand-muted);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .07em;
}

.brand-console-heading strong {
  overflow-wrap: anywhere;
  color: var(--brand-ink);
  font-size: 15px;
  font-weight: 650;
  line-height: 1.45;
}

.brand-console-avatar {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid #b9dafb;
  border-radius: 50%;
  background: #ebf5ff;
  color: var(--brand-blue);
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 700;
}

.brand-console-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 18px 0;
}

.brand-console-metrics span {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 11px 10px;
  border: 1px solid #e1ecf7;
  border-radius: 5px;
  background: #f8fbff;
}

.brand-console-metrics small {
  color: var(--brand-muted);
  font-size: 8px;
  line-height: 1.4;
}

.brand-console-metrics strong {
  color: var(--brand-ink);
  font-size: 18px;
  font-weight: 650;
  line-height: 1.2;
}

.brand-console-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 9px;
  color: #425c75;
  font-size: 9px;
  font-weight: 600;
}

.brand-console-title small {
  color: var(--brand-muted);
  font-size: 8px;
  font-weight: 400;
}

.brand-console-apps {
  display: grid;
  gap: 7px;
}

.brand-console-app {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid #e2ecf6;
  border-radius: 5px;
  background: #fff;
}

.brand-console-app:hover {
  border-color: #bad8f3;
  background: #fbfdff;
}

.brand-console-app-icon {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 5px;
}

.brand-console-app-icon svg {
  width: 15px;
  height: 15px;
}

.brand-console-app > span:nth-child(2) {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.brand-console-app strong {
  overflow: hidden;
  color: #1c3854;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.brand-console-app small {
  color: var(--brand-muted);
  font-size: 8px;
  line-height: 1.4;
}

.brand-console-status {
  color: #167b4a;
  font-size: 8px;
  white-space: nowrap;
}

.brand-console-prompt {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 27px;
  gap: 8px;
  align-items: center;
  margin-top: 13px;
  padding: 8px 8px 8px 11px;
  border: 1px solid #cfe3f7;
  border-radius: 6px;
  background: #f4f9ff;
  color: #55708a;
  font-size: 9px;
}

.brand-console-prompt > span {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.brand-console-prompt svg {
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
}

.brand-console-prompt > span svg {
  color: var(--brand-blue);
}

.brand-console-prompt i {
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  border-radius: 5px;
  background: var(--brand-blue);
  color: #fff;
}

.brand-console-prompt i svg {
  width: 13px;
  height: 13px;
}

.brand-stage-caption {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 11px;
  align-items: center;
  margin: 12px 0 0;
  padding: 12px 14px;
  border: 1px solid rgba(170, 205, 237, .86);
  border-radius: 6px;
  background: rgba(255, 255, 255, .84);
  box-shadow: 0 10px 30px rgba(33, 103, 170, .08);
}

.brand-stage-caption-icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 5px;
  background: #e8f3ff;
  color: var(--brand-blue);
}

.brand-stage-caption-icon svg {
  width: 16px;
  height: 16px;
}

.brand-stage-caption > span:last-child {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.brand-stage-caption strong {
  color: #173453;
  font-size: 10px;
  font-weight: 600;
}

.brand-stage-caption small {
  color: var(--brand-muted);
  font-size: 9px;
  line-height: 1.45;
}

.landing-page .promotion-section {
  padding: 32px 0 0;
  background: #fff;
}

.landing-page .promotion-section .page-container {
  width: min(1120px, calc(100% - 48px));
}

.brand-section {
  padding: 92px 0;
  scroll-margin-top: calc(var(--header-height) + 18px);
}

.brand-section-heading h2 {
  margin: 11px 0 0;
  color: var(--brand-ink);
  font-size: 39px;
  font-weight: 650;
  line-height: 1.25;
  letter-spacing: 0;
}

.brand-section-heading-row {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .62fr);
  gap: 54px;
  align-items: end;
  margin-bottom: 34px;
}

.brand-section-heading-row > p {
  margin: 0 0 4px;
  color: var(--brand-muted);
  font-size: 13px;
  line-height: 1.85;
}

.brand-about {
  padding-top: 78px;
}

.brand-about-grid {
  display: grid;
  grid-template-columns: minmax(300px, .74fr) minmax(0, 1.26fr);
  gap: 64px;
  align-items: start;
}

.brand-portrait-card {
  position: sticky;
  top: calc(var(--header-height) + 24px);
  min-width: 0;
  margin: 0;
  padding: 8px;
  border: 1px solid #d8e5f1;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 20px 54px rgba(29, 91, 150, .1);
}

.brand-portrait-media {
  position: relative;
  overflow: hidden;
  border-radius: 5px;
  background: #d7dbdf;
}

.brand-portrait-media img {
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1.03;
  object-fit: cover;
  object-position: center 40%;
}

.brand-portrait-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  padding: 5px 8px;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 4px;
  background: rgba(10, 35, 66, .72);
  color: #fff;
  font-size: 8px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: .07em;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

.brand-portrait-card figcaption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 15px 10px 11px;
}

.brand-portrait-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.brand-portrait-copy strong {
  color: #173553;
  font-size: 14px;
  font-weight: 650;
}

.brand-portrait-copy small {
  overflow-wrap: anywhere;
  color: var(--brand-muted);
  font-size: 9px;
  line-height: 1.55;
}

.brand-portrait-seal {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 1px solid #b9d9f5;
  border-radius: 50%;
  background: #eff7ff;
  color: var(--brand-blue);
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 700;
}

.brand-portrait-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  padding: 0 8px 8px;
}

.brand-portrait-tags span {
  padding: 4px 7px;
  border-radius: 3px;
  background: #f2f7fc;
  color: var(--brand-muted);
  font-size: 8px;
  line-height: 1.4;
}

.brand-about-content {
  min-width: 0;
}

.brand-about-lead {
  margin: 22px 0 24px;
  color: var(--brand-muted);
  font-size: 14px;
  line-height: 1.9;
}

.brand-founder-card {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 13px 0;
  border-top: 1px solid var(--brand-line);
  border-bottom: 1px solid var(--brand-line);
}

.brand-founder-mark {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid #b8d8f6;
  border-radius: 50%;
  background: #eef7ff;
  color: var(--brand-blue);
  font-size: 14px;
  font-weight: 700;
}

.brand-founder-card > span:last-child {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.brand-founder-card strong {
  color: #203d5c;
  font-size: 12px;
  font-weight: 650;
}

.brand-founder-card small {
  overflow-wrap: anywhere;
  color: var(--brand-muted);
  font-size: 9px;
  line-height: 1.55;
}

.brand-motto {
  margin: 21px 0 0;
  padding: 2px 0 2px 16px;
  border-left: 3px solid var(--brand-blue);
  color: #24518a;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.8;
}

.brand-about-story {
  display: grid;
  gap: 17px;
  padding-top: 28px;
}

.brand-about-story p {
  margin: 0;
  color: #445f7a;
  font-size: 14px;
  line-height: 1.95;
}

.brand-services {
  border-top: 1px solid var(--brand-line);
  border-bottom: 1px solid var(--brand-line);
  background: #fbfdff;
}

.brand-service-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.brand-service-card {
  display: flex;
  min-width: 0;
  min-height: 298px;
  flex-direction: column;
  padding: 25px;
  border: 1px solid #dce9f6;
  border-radius: 8px;
  background: #fff;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.brand-service-card:hover {
  border-color: #b8d6f3;
  box-shadow: 0 18px 42px rgba(34, 105, 176, .09);
  transform: translateY(-2px);
}

.brand-service-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 25px;
}

.brand-service-icon {
  display: grid;
  place-items: center;
  width: 43px;
  height: 43px;
  border: 1px solid #c8e0f5;
  border-radius: 7px;
  background: #eff7ff;
  color: var(--brand-blue);
}

.brand-service-icon svg {
  width: 20px;
  height: 20px;
}

.brand-service-number {
  color: var(--brand-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
}

.brand-service-card h3 {
  margin: 0 0 10px;
  overflow-wrap: anywhere;
  color: #0f172a;
  font-size: 18px;
  font-weight: 650;
  line-height: 1.4;
}

.brand-service-card p {
  margin: 0;
  color: var(--brand-muted);
  font-size: 12px;
  line-height: 1.8;
}

.brand-service-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: auto 0 19px;
  padding-top: 20px;
}

.brand-service-tags span {
  padding: 3px 7px;
  border-radius: 3px;
  background: #f1f7fd;
  color: #5d748b;
  font-size: 9px;
  line-height: 1.4;
}

.brand-service-link {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  align-self: stretch;
  min-height: 34px;
  padding: 8px 0 0;
  border: 0;
  border-top: 1px solid #e6eff8;
  background: transparent;
  color: var(--brand-blue);
  cursor: pointer;
  font-size: 10px;
  font-weight: 600;
  text-align: left;
}

.brand-service-link svg {
  width: 14px;
  height: 14px;
}

.brand-products {
  border-bottom: 1px solid var(--brand-line);
  background: #f5f9fe;
}

.brand-inline-link {
  display: inline-flex;
  align-items: center;
  justify-self: end;
  gap: 6px;
  margin-bottom: 4px;
  color: var(--brand-blue);
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

.brand-inline-link:hover {
  color: #0a58bf;
}

.brand-inline-link svg {
  width: 14px;
  height: 14px;
}

.brand-app-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 17px;
}

.brand-app-card {
  display: flex;
  min-width: 0;
  min-height: 236px;
  flex-direction: column;
  padding: 21px;
  border: 1px solid #d8e6f3;
  border-radius: 8px;
  background: #fff;
  color: var(--brand-ink);
  box-shadow: none;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.brand-app-card:hover {
  border-color: #afd1f0;
  box-shadow: 0 18px 40px rgba(34, 105, 176, .09);
  transform: translateY(-2px);
}

.brand-app-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.brand-app-icon {
  display: grid;
  place-items: center;
  width: 43px;
  height: 43px;
  border: 1px solid #cae1f5;
  border-radius: 7px;
  background: #f0f8ff;
  color: var(--brand-blue);
}

.brand-app-icon svg {
  width: 20px;
  height: 20px;
}

.brand-app-status {
  max-width: 74px;
  padding: 3px 7px;
  border-radius: 3px;
  background: #eef6ff;
  color: #2869a8;
  font-size: 9px;
  line-height: 1.4;
  text-align: right;
}

.brand-app-status.is-online {
  background: #eaf8f0;
  color: #167b4a;
}

.brand-app-copy {
  display: grid;
  gap: 5px;
  min-width: 0;
  margin: 18px 0 17px;
}

.brand-app-copy small {
  color: var(--brand-muted);
  font-size: 9px;
  line-height: 1.5;
}

.brand-app-copy strong {
  overflow-wrap: anywhere;
  color: #183652;
  font-size: 17px;
  font-weight: 650;
  line-height: 1.4;
}

.brand-app-copy > span {
  display: -webkit-box;
  overflow: hidden;
  overflow-wrap: anywhere;
  color: var(--brand-muted);
  font-size: 11px;
  line-height: 1.75;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.brand-app-card-foot {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
  padding-top: 15px;
  border-top: 1px solid #e5eef7;
}

.brand-app-card-foot > span:first-child {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.brand-app-card-foot strong {
  color: #274765;
  font-size: 10px;
  font-weight: 650;
  line-height: 1.4;
}

.brand-app-card-foot small {
  color: var(--brand-muted);
  font-size: 8px;
  line-height: 1.4;
}

.brand-app-link {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  color: var(--brand-blue);
  font-size: 9px;
  font-weight: 600;
  line-height: 1.4;
  text-align: right;
}

.brand-app-link svg {
  width: 12px;
  height: 12px;
  flex: 0 0 auto;
}

.brand-cases {
  background: #fff;
}

.brand-case-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 17px;
}

.brand-case-card {
  display: flex;
  min-width: 0;
  min-height: 294px;
  flex-direction: column;
  padding: 25px;
  border: 1px solid #deeaf5;
  border-radius: 8px;
  background: linear-gradient(145deg, #fbfdff, #f4f9ff);
}

.brand-case-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--brand-muted);
  font-size: 9px;
  font-weight: 600;
}

.brand-case-number {
  font-size: 10px;
  letter-spacing: .08em;
}

.brand-case-label {
  color: #57728c;
  font-weight: 500;
}

.brand-case-icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin: 25px 0 16px;
  border: 1px solid #c5dff5;
  border-radius: 7px;
  background: #fff;
  color: var(--brand-blue);
}

.brand-case-icon svg {
  width: 21px;
  height: 21px;
}

.brand-case-card h3 {
  margin: 0 0 8px;
  overflow-wrap: anywhere;
  color: #193b5b;
  font-size: 18px;
  font-weight: 650;
  line-height: 1.4;
}

.brand-case-card p {
  margin: 0 0 21px;
  color: var(--brand-muted);
  font-size: 12px;
  line-height: 1.8;
}

.brand-case-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: auto;
  padding-top: 15px;
  border-top: 1px solid #deebf6;
}

.brand-case-foot > span {
  color: var(--brand-muted);
  font-size: 9px;
  line-height: 1.5;
}

.brand-case-foot a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--brand-blue);
  font-size: 9px;
  font-weight: 600;
  white-space: nowrap;
}

.brand-case-foot a svg {
  width: 12px;
  height: 12px;
}

.brand-contact {
  padding: 72px 0;
  background: var(--brand-ink);
  color: #fff;
}

.brand-contact > .page-container {
  width: min(1120px, calc(100% - 48px));
}

.brand-contact-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(360px, .76fr);
  gap: 76px;
  align-items: center;
}

.brand-contact-copy .brand-eyebrow {
  color: #8fd9ff;
}

.brand-contact-copy h2 {
  margin: 12px 0 15px;
  color: #fff;
  font-size: 39px;
  font-weight: 650;
  line-height: 1.28;
}

.brand-contact-copy p {
  max-width: 610px;
  margin-bottom: 23px;
  color: rgba(229, 242, 255, .76);
  font-size: 13px;
  line-height: 1.85;
}

.brand-contact .contact-link {
  min-width: 0;
}

.brand-contact .contact-detail small {
  color: rgba(208, 230, 250, .58);
}

.brand-contact .contact-detail strong {
  color: #fff;
}

.brand-contact-assurance {
  display: grid;
  grid-template-columns: 19px minmax(0, 1fr) 15px;
  gap: 11px;
  align-items: center;
  margin-top: 14px;
  padding: 11px 13px;
  border: 1px solid rgba(150, 199, 239, .24);
  border-radius: 5px;
  color: #d8ecff;
}

.brand-contact-assurance > svg {
  width: 16px;
  height: 16px;
  color: #8fd9ff;
}

.brand-contact-assurance > span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.brand-contact-assurance strong {
  font-size: 10px;
  font-weight: 600;
}

.brand-contact-assurance small {
  overflow-wrap: anywhere;
  color: rgba(208, 230, 250, .58);
  font-size: 8px;
  line-height: 1.55;
}

@media (max-width: 980px) {
  .brand-hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(330px, .82fr);
    gap: 38px;
  }

  .brand-hero .hero-title {
    font-size: 48px;
  }

  .brand-service-grid,
  .brand-app-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .brand-about-grid {
    gap: 48px;
  }

  .brand-contact-panel {
    grid-template-columns: minmax(0, 1fr) minmax(310px, .72fr);
    gap: 46px;
  }
}

@media (max-width: 820px) {
  .brand-hero {
    padding: 54px 0 58px;
  }

  .brand-hero-grid {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .brand-hero-visual {
    max-width: 650px;
  }

  .brand-section {
    padding: 72px 0;
  }

  .brand-section-heading-row {
    grid-template-columns: 1fr;
    gap: 16px;
    align-items: start;
  }

  .brand-inline-link {
    justify-self: start;
    margin-top: 4px;
  }

  .brand-about-grid {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .brand-portrait-card {
    position: static;
    width: min(100%, 520px);
  }

  .brand-about-content {
    max-width: 720px;
  }

  .brand-about-story {
    padding-top: 0;
  }

  .brand-contact-panel {
    grid-template-columns: 1fr;
    gap: 36px;
  }
}

@media (max-width: 620px) {
  .brand-container,
  .landing-page .promotion-section .page-container,
  .brand-contact > .page-container {
    width: calc(100% - 24px);
  }

  .brand-hero {
    padding: 38px 0 44px;
  }

  .brand-hero-tags {
    gap: 6px;
    margin-bottom: 23px;
  }

  .brand-hero-tags span {
    min-height: 28px;
    padding: 4px 8px;
    font-size: 9px;
  }

  .brand-eyebrow {
    font-size: 9px;
  }

  .brand-hero .hero-title {
    margin-top: 12px;
    font-size: 34px;
    line-height: 1.2;
  }

  .brand-hero-lead {
    font-size: 13px;
    line-height: 1.85;
  }

  .brand-hero-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .brand-hero-actions .button {
    width: 100%;
  }

  .brand-hero-facts {
    margin-top: 28px;
    padding-top: 18px;
  }

  .brand-hero-facts strong {
    font-size: 18px;
  }

  .brand-hero-facts small {
    font-size: 8px;
  }

  .brand-console-body {
    padding: 15px;
  }

  .brand-console-bar {
    grid-template-columns: auto 1fr auto;
    gap: 8px;
  }

  .brand-console-metrics {
    gap: 5px;
    margin: 14px 0;
  }

  .brand-console-metrics span {
    padding: 9px 7px;
  }

  .brand-console-metrics small {
    font-size: 7px;
  }

  .brand-console-metrics strong {
    font-size: 16px;
  }

  .brand-console-app {
    grid-template-columns: 30px minmax(0, 1fr) auto;
    gap: 7px;
    padding: 8px;
  }

  .brand-console-app-icon {
    width: 30px;
    height: 30px;
  }

  .brand-console-status {
    max-width: 48px;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .brand-stage-caption {
    margin: 9px 0 0;
  }

  .brand-section {
    padding: 55px 0;
  }

  .brand-section-heading h2,
  .brand-contact-copy h2 {
    font-size: 29px;
  }

  .brand-section-heading-row {
    margin-bottom: 24px;
  }

  .brand-section-heading-row > p {
    font-size: 12px;
  }

  .brand-about {
    padding-top: 54px;
  }

  .brand-portrait-card {
    width: 100%;
  }

  .brand-portrait-media img {
    aspect-ratio: 1 / 1.02;
  }

  .brand-portrait-card figcaption {
    padding: 13px 8px 10px;
  }

  .brand-about-lead,
  .brand-about-story p {
    font-size: 12px;
    line-height: 1.9;
  }

  .brand-service-grid,
  .brand-app-grid,
  .brand-case-grid {
    grid-template-columns: 1fr;
  }

  .brand-service-card,
  .brand-app-card,
  .brand-case-card {
    min-height: 0;
  }

  .brand-service-card {
    padding: 22px;
  }

  .brand-contact {
    padding: 49px 0;
  }

  .brand-contact-copy p {
    font-size: 12px;
  }

  .brand-contact-copy .button {
    width: 100%;
  }

  .brand-contact .contact-detail strong {
    font-size: 12px;
  }
}

/* tech refresh appended below */
.landing-page {
  --brand-blue: #0e5f82;
  --brand-action: #0b7c8a;
  --brand-cyan: #2bb8e6;
  --brand-aqua: #16e0c5;
  --brand-mint: #16c9b0;
  --brand-amber: #d8952b;
  --brand-ink: #0f172a;
  --brand-muted: #4d6378;
  --brand-line: #c7e8f0;
  background: #e6f7fb;
}

.has-brand-home {
  background: #e6f7fb;
}

.has-brand-home .site-header {
  border-bottom-color: rgba(151, 216, 232, .58);
  background: rgba(242, 252, 255, .66);
  box-shadow: 0 10px 34px rgba(14, 127, 184, .07), inset 0 1px 0 rgba(255, 255, 255, .78);
}

.has-brand-home .brand-mark {
  border-radius: 8px;
  background: linear-gradient(145deg, #0b7c8a 0%, #0e5f82 100%);
  box-shadow: 0 10px 24px rgba(11, 124, 138, .24), 0 3px 9px rgba(43, 184, 230, .16), inset 0 1px 0 rgba(255, 255, 255, .44);
}

.has-brand-home .primary-nav a.is-active {
  background: linear-gradient(135deg, rgba(226, 249, 253, .94), rgba(224, 255, 250, .84));
  color: var(--brand-ink);
  box-shadow: inset 0 0 0 1px rgba(43, 184, 230, .2), 0 4px 12px rgba(14, 127, 184, .06);
}

.landing-page .brand-eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 25px;
  padding: 4px 8px;
  border: 1px solid rgba(43, 184, 230, .26);
  border-radius: 3px;
  background: rgba(255, 255, 255, .58);
  color: var(--brand-blue);
  font-size: 10px;
  letter-spacing: .13em;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .88), 0 4px 14px rgba(14, 127, 184, .04);
}

.landing-page .brand-hero {
  isolation: isolate;
  padding: 82px 0 88px;
  background: linear-gradient(132deg, #e6f7fb 0%, #f9feff 50%, #e1fbf7 100%);
}

.landing-page .brand-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image:
    linear-gradient(rgba(14, 127, 184, .052) 1px, transparent 1px),
    linear-gradient(90deg, rgba(14, 127, 184, .052) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(90deg, rgba(0, 0, 0, .28), #000 42%, rgba(0, 0, 0, .2));
  pointer-events: none;
}

.landing-page .brand-hero::after {
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(43, 184, 230, .65), rgba(22, 224, 197, .3), transparent);
}

.brand-hero .hero-title {
  font-size: 58px;
  letter-spacing: 0;
}

.brand-hero .hero-title span {
  color: var(--brand-ink);
}

.brand-console {
  position: relative;
  border-color: rgba(126, 210, 233, .68);
  background: linear-gradient(150deg, rgba(255, 255, 255, .86), rgba(239, 253, 255, .68));
  box-shadow: 0 32px 78px rgba(14, 127, 184, .18), 0 8px 22px rgba(22, 224, 197, .08), inset 0 1px 0 rgba(255, 255, 255, .96);
  -webkit-backdrop-filter: blur(18px) saturate(145%);
  backdrop-filter: blur(18px) saturate(145%);
}

.brand-console::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 2;
  height: 2px;
  background: linear-gradient(90deg, transparent, #16e0c5 28%, #2bb8e6 58%, transparent);
}

.brand-console-bar {
  background: linear-gradient(180deg, rgba(255, 255, 255, .82), rgba(232, 249, 253, .7));
}

.brand-stage-caption {
  border-left: 2px solid var(--brand-mint);
}

.brand-roles {
  padding: 76px 0 80px;
  border-bottom: 1px solid var(--brand-line);
  background: linear-gradient(180deg, #e8f9fc 0%, #f8feff 100%);
}

.brand-role-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.brand-role-card {
  position: relative;
  min-width: 0;
  min-height: 192px;
  overflow: hidden;
  padding: 23px;
  border: 1px solid rgba(150, 218, 233, .66);
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .88), rgba(235, 252, 255, .68));
  box-shadow: 0 16px 36px rgba(14, 127, 184, .09), 0 4px 12px rgba(22, 224, 197, .04), inset 0 1px 0 rgba(255, 255, 255, .96);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  backdrop-filter: blur(16px) saturate(140%);
}

.brand-role-card::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 3px;
  background: linear-gradient(180deg, #16e0c5, #2bb8e6);
}

.brand-role-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 22px;
}

.brand-role-icon {
  display: grid;
  place-items: center;
  width: 39px;
  height: 39px;
  border: 1px solid rgba(98, 203, 228, .48);
  border-radius: 6px;
  background: linear-gradient(145deg, #f5feff, #ddf9f8);
  color: var(--brand-cyan);
  box-shadow: 0 7px 16px rgba(14, 127, 184, .1), inset 0 1px 0 rgba(255, 255, 255, .9);
}

.brand-role-icon svg {
  width: 18px;
  height: 18px;
}

.brand-role-number {
  color: var(--brand-muted);
  font-family: Consolas, "SFMono-Regular", monospace;
  font-size: 10px;
  letter-spacing: .12em;
}

.brand-role-card h3 {
  margin: 0 0 9px;
  color: #0f172a;
  font-size: 20px;
  font-weight: 650;
  line-height: 1.35;
}

.brand-role-card p {
  margin: 0;
  color: var(--brand-muted);
  font-size: 12px;
  line-height: 1.8;
}

.brand-services {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 94px 0 98px;
  border-top: 1px solid rgba(150, 218, 233, .5);
  border-bottom: 1px solid rgba(150, 218, 233, .5);
  background: linear-gradient(145deg, #e4f9fc 0%, #f7feff 48%, #e1fbf6 100%);
  color: var(--brand-ink);
}

.brand-services::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image:
    linear-gradient(rgba(14, 127, 184, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(14, 127, 184, .05) 1px, transparent 1px);
  background-size: 40px 40px;
  mask-image: linear-gradient(180deg, #000, rgba(0, 0, 0, .28));
  pointer-events: none;
}

.brand-services::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(43, 184, 230, .55), rgba(22, 224, 197, .3), transparent);
}

.brand-services .brand-container {
  position: relative;
  z-index: 1;
}

.brand-services .brand-eyebrow {
  border-color: rgba(43, 184, 230, .3);
  background: rgba(255, 255, 255, .58);
  color: var(--brand-blue);
}

.brand-services .brand-section-heading h2 {
  color: var(--brand-ink);
}

.brand-services .brand-section-heading-row > p {
  color: #58758e;
}

.brand-service-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.brand-service-card {
  min-height: 448px;
  padding: 20px;
  border: 1px solid rgba(137, 216, 234, .7);
  border-radius: 8px;
  background: linear-gradient(155deg, rgba(255, 255, 255, .9), rgba(235, 252, 255, .66));
  box-shadow: 0 22px 46px rgba(14, 127, 184, .12), 0 5px 14px rgba(22, 224, 197, .045), inset 0 1px 0 rgba(255, 255, 255, .98);
  -webkit-backdrop-filter: blur(18px) saturate(145%);
  backdrop-filter: blur(18px) saturate(145%);
}

.brand-service-card:hover {
  border-color: rgba(43, 184, 230, .58);
  box-shadow: 0 28px 58px rgba(14, 127, 184, .17), 0 8px 18px rgba(22, 224, 197, .08), inset 0 1px 0 rgba(255, 255, 255, 1);
  transform: translateY(-4px);
}

.brand-service-top {
  margin-bottom: 18px;
}

.brand-service-icon {
  border-color: rgba(43, 184, 230, .34);
  background: linear-gradient(145deg, #f4feff, #dbf8fb);
  color: var(--brand-cyan);
  box-shadow: 0 8px 18px rgba(14, 127, 184, .11), inset 0 1px 0 rgba(255, 255, 255, .94);
}

.brand-service-card[data-tone="mint"] .brand-service-icon {
  border-color: rgba(22, 224, 197, .42);
  background: linear-gradient(145deg, #f2fffc, #d9fff8);
  color: #0a9b88;
}

.brand-service-card[data-tone="amber"] .brand-service-icon {
  border-color: rgba(216, 149, 43, .34);
  background: linear-gradient(145deg, #fffdf5, #fff5da);
  color: #a86c0b;
}

.brand-service-number {
  color: var(--brand-muted);
  font-family: Consolas, "SFMono-Regular", monospace;
  font-size: 9px;
  letter-spacing: .09em;
}

.brand-service-card h3 {
  margin-bottom: 14px;
  color: var(--brand-ink);
  font-size: 18px;
  line-height: 1.45;
}

.brand-service-details {
  display: grid;
  gap: 12px;
  padding: 15px 0;
  border-top: 1px solid rgba(91, 195, 220, .24);
  border-bottom: 1px solid rgba(91, 195, 220, .24);
}

.brand-service-detail {
  display: grid;
  gap: 3px;
}

.brand-service-detail small {
  color: var(--brand-blue);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
}

.brand-services .brand-service-card p {
  color: #58758e;
  font-size: 12px;
  line-height: 1.75;
}

.brand-services .brand-service-tags {
  margin: auto 0 15px;
  padding: 14px 0 0;
}

.brand-services .brand-service-tags span {
  border: 1px solid rgba(43, 184, 230, .2);
  background: rgba(226, 249, 253, .78);
  color: #3e7191;
}

.brand-services .brand-service-link {
  min-height: 40px;
  margin-top: 0;
  padding: 10px 12px;
  border: 1px solid rgba(14, 127, 184, .24);
  border-radius: 6px;
  background: var(--brand-action);
  color: #fff;
  box-shadow: 0 10px 22px rgba(11, 124, 138, .22), 0 3px 8px rgba(43, 184, 230, .1), inset 0 1px 0 rgba(255, 255, 255, .26);
}

.brand-services .brand-service-link:hover {
  border-color: rgba(11, 124, 138, .86);
  background: var(--primary-action-hover);
  transform: translateY(-1px);
}

.brand-products {
  background: linear-gradient(180deg, #f6feff 0%, #e5f8fb 100%);
}

.brand-app-card {
  position: relative;
  border-color: rgba(145, 215, 232, .64);
  background: linear-gradient(150deg, rgba(255, 255, 255, .9), rgba(239, 253, 255, .7));
  box-shadow: 0 16px 36px rgba(14, 127, 184, .08), inset 0 1px 0 rgba(255, 255, 255, .98);
  -webkit-backdrop-filter: blur(15px) saturate(140%);
  backdrop-filter: blur(15px) saturate(140%);
}

.brand-app-card::before {
  content: "";
  position: absolute;
  top: 0;
  right: 18px;
  left: 18px;
  height: 2px;
  background: linear-gradient(90deg, rgba(43, 184, 230, .06), rgba(22, 224, 197, .65), rgba(43, 184, 230, .06));
  opacity: 0;
}

.brand-app-card:hover::before {
  opacity: 1;
}

.brand-case-card {
  border-color: rgba(145, 215, 232, .62);
  background: linear-gradient(145deg, rgba(255, 255, 255, .9), rgba(235, 252, 255, .7));
  box-shadow: 0 18px 40px rgba(14, 127, 184, .08), inset 0 1px 0 rgba(255, 255, 255, .96);
  -webkit-backdrop-filter: blur(15px) saturate(140%);
  backdrop-filter: blur(15px) saturate(140%);
  transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}

.brand-case-card:hover {
  border-color: rgba(43, 184, 230, .52);
  box-shadow: 0 24px 48px rgba(14, 127, 184, .13), 0 6px 16px rgba(22, 224, 197, .06), inset 0 1px 0 rgba(255, 255, 255, 1);
  transform: translateY(-3px);
}

.brand-contact {
  padding: 0;
  background: #e6f7fb;
  scroll-margin-top: calc(var(--header-height) + 18px);
}

.brand-contact-top {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 74px 0 98px;
  background: linear-gradient(145deg, #e1f9fc 0%, #f8feff 52%, #defbf5 100%);
}

.brand-contact-top::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image:
    linear-gradient(rgba(14, 127, 184, .048) 1px, transparent 1px),
    linear-gradient(90deg, rgba(14, 127, 184, .048) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(90deg, rgba(0, 0, 0, .15), #000 55%, rgba(0, 0, 0, .3));
}

.brand-contact-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .62fr);
  gap: 78px;
  align-items: end;
}

.brand-contact .brand-eyebrow {
  border-color: rgba(43, 184, 230, .3);
  background: rgba(255, 255, 255, .58);
  color: var(--brand-blue);
}

.brand-contact-copy h2 {
  margin: 16px 0 15px;
  color: var(--brand-ink);
  font-size: 42px;
}

.brand-contact-copy p {
  max-width: 650px;
  margin: 0;
  color: #58758e;
  font-size: 13px;
  line-height: 1.85;
}

.brand-contact-channels {
  display: grid;
  gap: 10px;
}

.brand-channel-link {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-width: 0;
  padding: 13px 14px;
  border: 1px solid rgba(138, 215, 232, .68);
  border-radius: 6px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .82), rgba(232, 251, 255, .6));
  box-shadow: 0 14px 30px rgba(14, 127, 184, .08), inset 0 1px 0 rgba(255, 255, 255, .98);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  backdrop-filter: blur(14px) saturate(140%);
}

.brand-channel-link:hover {
  border-color: rgba(43, 184, 230, .56);
  background: linear-gradient(145deg, rgba(255, 255, 255, .94), rgba(226, 252, 250, .74));
  box-shadow: 0 18px 36px rgba(14, 127, 184, .12), inset 0 1px 0 rgba(255, 255, 255, 1);
}

.brand-channel-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(43, 184, 230, .34);
  border-radius: 6px;
  background: linear-gradient(145deg, #f5feff, #daf8f8);
  color: var(--brand-cyan);
  box-shadow: 0 7px 16px rgba(14, 127, 184, .1), inset 0 1px 0 rgba(255, 255, 255, .94);
}

.brand-channel-icon svg {
  width: 17px;
  height: 17px;
}

.brand-channel-link > span:last-child {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.brand-channel-link small {
  color: var(--brand-muted);
  font-size: 9px;
}

.brand-channel-link strong {
  overflow-wrap: anywhere;
  color: var(--brand-ink);
  font-size: 12px;
  font-weight: 550;
}

.brand-contact-form-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: -44px;
}

.brand-contact-form {
  display: flex;
  min-width: 0;
  min-height: 486px;
  flex-direction: column;
  padding: 24px;
  border: 1px solid rgba(138, 215, 232, .7);
  border-radius: 8px;
  background: linear-gradient(150deg, rgba(255, 255, 255, .92), rgba(240, 253, 255, .78));
  box-shadow: 0 26px 58px rgba(14, 127, 184, .13), 0 6px 16px rgba(22, 224, 197, .05), inset 0 1px 0 rgba(255, 255, 255, 1);
  -webkit-backdrop-filter: blur(18px) saturate(145%);
  backdrop-filter: blur(18px) saturate(145%);
}

.brand-form-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}

.brand-form-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(43, 184, 230, .34);
  border-radius: 7px;
  background: linear-gradient(145deg, #f5feff, #dcf9fa);
  color: var(--brand-cyan);
  box-shadow: 0 8px 18px rgba(14, 127, 184, .1), inset 0 1px 0 rgba(255, 255, 255, .94);
  flex: 0 0 auto;
}

.brand-form-icon svg {
  width: 19px;
  height: 19px;
}

.brand-form-head > div {
  display: grid;
  gap: 1px;
}

.brand-form-head small {
  color: var(--brand-muted);
  font-family: Consolas, "SFMono-Regular", monospace;
  font-size: 8px;
  letter-spacing: .1em;
}

.brand-form-head h3 {
  margin: 0;
  color: var(--brand-ink);
  font-size: 19px;
  font-weight: 650;
  line-height: 1.35;
}

.brand-form-fields {
  display: grid;
  gap: 12px;
}

.brand-form-field {
  display: grid;
  gap: 6px;
}

.brand-form-field > span {
  color: #3e657d;
  font-size: 10px;
  font-weight: 600;
}

.brand-form-field input,
.brand-form-field select,
.brand-form-field textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid rgba(126, 201, 219, .56);
  border-radius: 6px;
  background: rgba(248, 254, 255, .82);
  color: #163f59;
  box-shadow: inset 0 1px 2px rgba(14, 127, 184, .035);
  font-size: 12px;
  outline: none;
}

.brand-form-field input,
.brand-form-field select {
  height: 43px;
  padding: 0 11px;
}

.brand-form-field textarea {
  min-height: 94px;
  padding: 11px;
  line-height: 1.65;
  resize: vertical;
}

.brand-form-field input:focus,
.brand-form-field select:focus,
.brand-form-field textarea:focus {
  border-color: #2bb8e6;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 0 0 3px rgba(43, 184, 230, .13), 0 5px 14px rgba(14, 127, 184, .05);
}

.brand-form-submit {
  width: 100%;
  min-height: 43px;
  margin-top: auto;
}

.brand-contact-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 17px 0 28px;
  color: var(--brand-muted);
  font-size: 10px;
  line-height: 1.6;
  text-align: center;
}

.brand-contact-note svg {
  width: 14px;
  height: 14px;
  color: #0a9b88;
  flex: 0 0 auto;
}

.contact-request-summary {
  display: grid;
  gap: 8px;
  margin: 18px 0;
}

.contact-request-summary > span {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid rgba(140, 211, 229, .56);
  border-radius: 5px;
  background: rgba(241, 253, 255, .82);
}

.contact-request-summary small {
  color: var(--brand-muted);
  font-size: 10px;
}

.contact-request-summary strong {
  overflow-wrap: anywhere;
  color: #173f59;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.7;
  white-space: pre-wrap;
}

.contact-request-note {
  color: var(--brand-muted);
  font-size: 10px;
  line-height: 1.65;
}

@media (max-width: 1060px) {
  .brand-service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .brand-contact-heading {
    grid-template-columns: minmax(0, 1fr) minmax(280px, .62fr);
    gap: 46px;
  }

  .brand-contact-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .brand-contact-form:last-child {
    grid-column: 1 / -1;
    min-height: 0;
  }
}

@media (max-width: 820px) {
  .brand-role-grid,
  .brand-contact-form-grid {
    grid-template-columns: 1fr;
  }

  .brand-contact-form:last-child {
    grid-column: auto;
  }

  .brand-role-card {
    min-height: 0;
  }

  .brand-contact-heading {
    grid-template-columns: 1fr;
    gap: 32px;
  }
}

@media (max-width: 620px) {
  .landing-page .brand-hero {
    padding: 40px 0 46px;
  }

  .brand-hero .hero-title {
    font-size: 34px;
  }

  .brand-roles {
    padding: 54px 0;
  }

  .brand-service-grid {
    grid-template-columns: 1fr;
  }

  .brand-service-card {
    min-height: 0;
  }

  .brand-contact-top {
    padding: 56px 0 78px;
  }

  .brand-contact-copy h2 {
    font-size: 30px;
  }

  .brand-contact-copy p {
    font-size: 12px;
  }

  .brand-channel-link {
    padding: 12px;
  }

  .brand-channel-link strong {
    font-size: 11px;
  }

  .brand-contact-form-grid {
    margin-top: -34px;
  }

  .brand-contact-form {
    min-height: 0;
    padding: 20px;
  }

  .brand-contact-note {
    align-items: flex-start;
    text-align: left;
  }

  .contact-request-summary > span {
    grid-template-columns: 1fr;
    gap: 3px;
  }
}