/* Reusable panels respond to their available space, not the page viewport. */
.brand-section { padding: clamp(52px, 6vw, 88px) 0; }
.brand-section--pale { background: var(--brand-pale); }
.brand-title { margin: 0 0 20px; color: var(--brand-ink); font: 800 clamp(28px,3vw,40px)/1.18 'Nunito',sans-serif; letter-spacing: -.025em; }
.brand-subtitle { margin: 0 0 22px; color: var(--brand-purple); font: 700 clamp(21px,2vw,27px)/1.35 'Nunito',sans-serif; }
.brand-text-section { display: grid; grid-template-columns: minmax(0,35fr) minmax(0,65fr); gap: 48px; }
.brand-copy { min-width: 0; }
.brand-copy .common_paragraph { max-width: 75ch; }
.brand-list { padding-left: 22px; margin: 22px 0; list-style: disc; }
.brand-list > li { list-style: disc; font-size: 16px; line-height: 1.65; margin-bottom: 9px; padding-left: 4px; }
.brand-list li::marker { color: var(--brand-purple); }
.brand-list--columns { columns: 2; column-gap: 36px; }
.brand-list--columns > li { break-inside: avoid; }
.brand-split { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items: start; gap: 48px; }
.brand-picture img { display: block; width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; border-radius: 20px; }
.brand-split--reverse .brand-picture { order: -1; }
.brand-values { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px 32px; margin-top: 30px; }
.brand-value-title { margin: 0 0 10px; color: var(--brand-primary); font: 800 21px/1.35 'Nunito',sans-serif; }
.brand-values > div { border-top: 2px solid var(--brand-lavender); padding-top: 16px; }
.brand-page-nav { padding-top: 0; padding-bottom: 30px; }
.brand-page-nav details { border-block: 1px solid var(--brand-border); }
.brand-page-nav summary { padding: 20px 0; color: var(--brand-primary); font-weight: 600; cursor: pointer; min-height: 48px; }
.brand-page-nav ul { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 4px 24px; margin: 0; padding: 0 0 20px; list-style: none; }
.brand-page-nav li { list-style: none; }
.brand-page-nav a { display: inline-flex; align-items: center; min-height: 44px; color: var(--brand-primary); font-size: 14px; line-height: 1.5; }
.brand-page-nav a:hover { text-decoration: underline; }
.brand-page-nav summary:focus-visible { outline: 3px solid var(--brand-lavender); outline-offset: 4px; }
.brand-cta { background: var(--brand-primary); padding: clamp(52px,6vw,88px) 0; text-align: center; }
.brand-cta .container { max-width: 960px; }
.brand-cta .brand-title, .allied-site .brand-cta .common_paragraph { color: var(--brand-white); }
.brand-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 26px 0; }
.brand-cta .brand-actions { justify-content: center; }
@media (max-width: 1023px) {
  .brand-split, .brand-text-section { gap: 28px; }
  .brand-page-nav ul { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 767px) {
  .brand-section { padding-block: 48px; }
  .brand-split, .brand-text-section { grid-template-columns: 1fr; gap: 28px; }
  .brand-split--reverse .brand-picture { order: 0; }
}
@media (max-width: 599px) {
  .brand-values, .brand-page-nav ul { grid-template-columns: 1fr; }
  .brand-list--columns { columns: 1; }
}
.brand-content-panel-host {
  container: brand-panel / inline-size;
  inline-size: 100%;
  min-inline-size: 0;
}

.brand-content-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  inline-size: 100%;
  max-inline-size: 100%;
  margin: 0;
  overflow: hidden;
  border-radius: 20px;
  background: var(--brand-panel-bg);
  box-shadow: 0 8px 32px rgba(var(--brand-ink-rgb), .071);
  text-align: left;
}

.brand-content-panel > :is(.brand-content-panel__header, .brand-content-panel__body) {
  box-sizing: border-box;
  min-inline-size: 0;
  margin: 0;
  padding: 24px;
  padding: clamp(22px, 4cqi, 40px);
  overflow-wrap: anywhere;
}

.brand-content-panel__header {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 14px;
  background: var(--brand-primary);
  color: var(--brand-white);
}

.brand-content-panel .brand-content-panel__title,
.brand-content-panel .brand-content-panel__subtitle {
  margin: 0;
  padding: 0;
  color: var(--brand-white);
  font-family: 'Nunito', sans-serif;
  font-weight: 800;
}

.brand-content-panel .brand-content-panel__title {
  font-size: 28px;
  font-size: clamp(28px, 4cqi, 40px);
  line-height: 1.18;
  letter-spacing: -.025em;
}

.brand-content-panel .brand-content-panel__subtitle {
  font-size: 21px;
  font-size: clamp(21px, 3cqi, 27px);
  line-height: 1.35;
}

.brand-content-panel .brand-content-panel__body .common_paragraph {
  margin: 0;
  padding: 0;
  color: var(--brand-text);
  font-size: 16px;
  line-height: 1.75;
}

.brand-content-panel .brand-content-panel__body .common_paragraph + .common_paragraph {
  margin-top: 16px;
}

/* Single-column is also the safe fallback without container-query support. */
@container brand-panel (min-width: 48rem) {
  .brand-content-panel {
    grid-template-columns: minmax(0, 38fr) minmax(0, 62fr);
  }
}