/* Body-only surfaces. Form controls and workflow selectors stay unchanged. */
.support-brand-page {
  --support-rule: #dfe4e9;
  --support-blue: #2467ff;
}
.support-brand-page > .section {
  padding-block: clamp(44px, 6vw, 84px);
}
.support-brand-page .section-heading {
  margin-bottom: 30px;
}
.support-brand-page .section-heading h2,
.support-brand-page .support-brand-aside > h2 {
  font-size: clamp(32px, 3.5vw, 48px);
  line-height: 1.08;
  letter-spacing: -.035em;
  text-wrap: balance;
}
.support-brand-page .support-brand-form {
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  align-items: start;
  column-gap: clamp(36px, 6vw, 88px);
  border-top: 1px solid var(--support-rule);
}
.support-brand-page .support-brand-aside {
  min-width: 0;
  max-width: 36rem;
}
.support-brand-aside > .eyebrow {
  margin: 0 0 18px;
}
.support-brand-aside > h2 {
  margin-top: 0;
  margin-bottom: 24px;
}
.support-brand-aside > p,
.support-brand-kit .copy > p {
  line-height: 1.65;
}
.support-brand-page .form-card {
  position: relative;
  width: 100%;
  max-width: none;
  background: #fff;
  border: 1px solid var(--support-rule);
  padding: clamp(24px, 3.2vw, 44px);
  box-shadow: 10px 10px 0 #f3f6fa;
}
.support-brand-page .form-card::before {
  content: '';
  position: absolute;
  top: -1px;
  left: -1px;
  width: 12px;
  height: 12px;
  background: var(--support-blue);
  box-shadow: 12px 0 #00bdb2, 0 12px #e8483f;
  pointer-events: none;
}
.support-brand-page .form-card .field-row {
  gap: 20px;
}
.support-brand-contact-details {
  padding-block: 8px 18px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--support-rule);
}
.support-brand-contact-details p {
  margin: 0 0 12px;
  font-size: clamp(20px, 2vw, 28px);
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.support-brand-page :is(.support-brand-benefits, .support-brand-paths, .support-brand-packages) .card-grid {
  gap: 0;
  border-top: 1px solid var(--support-rule);
}
.support-brand-page :is(.support-brand-benefits, .support-brand-paths, .support-brand-packages) .card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 30px;
  border: 0;
  border-right: 1px solid var(--support-rule);
  border-bottom: 1px solid var(--support-rule);
  background: #fff;
}
.support-brand-page :is(.support-brand-benefits, .support-brand-paths) .card:first-child,
.support-brand-page .support-brand-packages .card:nth-child(odd) {
  border-left: 1px solid var(--support-rule);
}
.support-brand-page .support-brand-benefits .card h3::before {
  content: '';
  display: block;
  width: 7px;
  height: 7px;
  margin-bottom: 28px;
  background: #2467ff;
}
.support-brand-page .support-brand-benefits .card:nth-child(2) h3::before { background: #00bdb2; }
.support-brand-page .support-brand-benefits .card:nth-child(3) h3::before { background: #e8483f; }
.support-brand-page :is(.support-brand-paths, .support-brand-packages) .card .text-link {
  margin-top: auto;
  padding-top: 24px;
}
.support-brand-page .support-brand-packages .card h3 {
  font-size: 30px;
  margin-bottom: 12px;
}
.support-brand-page .support-brand-kit {
  border-top: 1px solid var(--support-rule);
}
.support-brand-press-contact {
  padding: 24px 30px;
  border-left: 3px solid var(--support-blue);
}
.support-brand-press-contact h3 { margin-top: 0; }
.support-brand-page .support-brand-outbound .card {
  min-height: 124px;
  display: flex;
  align-items: center;
  padding: 26px;
  color: #164cc3;
  font-weight: 500;
  text-underline-offset: 5px;
}
.support-brand-page .support-brand-outbound .card:focus-visible {
  outline: 3px solid var(--support-blue);
  outline-offset: 4px;
}
.support-brand-page .support-brand-preferences {
  max-width: 760px;
  padding-top: 20px;
}
.support-brand-page.support-brand-legal > .prose {
  max-width: 860px;
  padding-top: 28px;
  font-size: 17px;
  line-height: 1.8;
  border-top: 1px solid var(--support-rule);
}
.support-brand-legal .prose .back,
.support-brand-legal .prose .upd {
  font-size: 14px;
  line-height: 1.6;
  color: #5a6068;
}
.support-brand-legal .prose h2 {
  margin-top: 44px;
  padding-top: 24px;
  border-top: 1px solid var(--support-rule);
  font-size: clamp(24px, 2.6vw, 30px);
  line-height: 1.25;
  letter-spacing: -.02em;
}
.support-brand-legal .prose :is(p, ul) { margin-block: 18px; }
.support-brand-legal .prose :is(p, li) { font-size: inherit; line-height: inherit; }
.support-brand-legal .prose li + li { margin-top: 10px; }
.site-page .support-brand-legal .brand-hero {
  grid-template-columns: minmax(0, 1fr) minmax(180px, 260px);
  padding-bottom: 48px;
}
.site-page .support-brand-legal .brand-hero h1 {
  font-size: clamp(40px, 5vw, 64px);
}
.support-brand-legal .brand-photo-media > img { aspect-ratio: 3 / 2; }
@media (hover: hover) and (pointer: fine) {
  .support-brand-page .support-brand-outbound .card:hover { text-decoration: underline; }
}
@media (max-width: 900px) {
  .support-brand-page .support-brand-form {
    grid-template-columns: 1fr;
    row-gap: 32px;
  }
  .support-brand-page .support-brand-aside { max-width: 46rem; }
  .support-brand-form .support-brand-aside > .brand-photo { max-width: 480px; }
  .support-brand-page :is(.support-brand-benefits, .support-brand-paths, .support-brand-packages) .card { padding: 24px; }
}
@media (min-width: 701px) and (max-width: 1000px) {
  .support-brand-page :is(.support-brand-benefits, .support-brand-paths) .card:nth-child(odd) { border-left: 1px solid var(--support-rule); }
}
@media (max-width: 700px) {
  .support-brand-page > .section { padding-block: 40px; }
  .support-brand-page .section-heading { margin-bottom: 24px; }
  .support-brand-page .form-card { padding: 28px 22px 22px; box-shadow: 6px 6px 0 #f3f6fa; }
  .support-brand-page :is(.support-brand-benefits, .support-brand-paths, .support-brand-packages) .card-grid { grid-template-columns: 1fr; }
  .support-brand-page :is(.support-brand-benefits, .support-brand-paths, .support-brand-packages) .card { border-left: 1px solid var(--support-rule); }
  .support-brand-page .support-brand-benefits .card h3::before { margin-bottom: 18px; }
  .support-brand-press-contact { padding: 16px 22px; }
  .site-page .support-brand-legal .brand-hero { grid-template-columns: 1fr; gap: 28px; padding-bottom: 36px; }
  .support-brand-legal .brand-hero .brand-photo { width: min(240px, 72%); margin: 0; }
  .support-brand-legal .brand-hero .brand-photo-media > img { aspect-ratio: 2 / 1; }
  .support-brand-legal .brand-hero .brand-photo figcaption { font-size: 11px; margin-top: 12px; }
  .support-brand-page.support-brand-legal > .prose { font-size: 16px; line-height: 1.75; }
  .support-brand-legal .prose h2 { margin-top: 32px; }
  .support-brand-unsubscribe .brand-hero .brand-photo { width: min(260px, 78%); }
  .support-brand-page .support-brand-preferences { padding-top: 12px; }
}
@media print {
  .support-brand-legal .brand-hero .brand-photo { display: none; }
  .site-page .support-brand-legal .brand-hero { display: block; padding-top: 0; }
  .support-brand-page.support-brand-legal > .prose { max-width: none; }
  .support-brand-legal .prose h2 { break-after: avoid; }
}
