/* Application guidance shares the site's palette, type and spacing contracts. */
.requirements{ overflow-wrap: break-word; }
.req-hero{ padding-bottom: 0; }
.req-hero .portal-breadcrumbs{ margin-bottom: var(--section-content-gap); }
.req-hero-grid{ display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: var(--grid-gap-wide); align-items: center; }
.req-hero-copy h1{ max-width: 12ch; }
.req-hero .req-hero-line{ margin-top: var(--group-gap); max-width: 30ch; color: var(--paper); font: 400 clamp(22px, 2vw, 28px)/1.3 var(--display); letter-spacing: -.02em; text-wrap: balance; }
.req-intro{ margin-top: var(--item-gap); max-width: 48ch; color: var(--soft); font-size: 18px; line-height: 1.65; }
.req-hero-copy .btn{ margin-top: var(--group-gap); }
.req-caption{ color: var(--soft); font-size: 14px; line-height: 1.65; }
.req-hero-copy .req-caption{ margin-top: var(--item-gap); font-size: 14px; }
.req-hero .req-intro{ font-size: 18px; }
.req-equation{ padding: var(--feature-padding); }
.req-ingredients li{ position: relative; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: var(--group-gap); padding-block: var(--group-gap); color: var(--paper); border-top: 1px solid var(--stroke); font: 400 clamp(21px, 2.1vw, 28px)/1.25 var(--display); }
.req-number{ color: var(--gold); font: 400 12px/1.6 var(--mono); }
.req-ingredients li:first-child{ padding-top: 0; border-top: 0; }
.req-plus{ position: absolute; right: 0; bottom: 0; transform: translateY(50%); padding-inline: var(--inline-gap); background: var(--navy); color: var(--teal); font: 400 18px/1 var(--mono); }
.req-result{ position: relative; display: flex; align-items: center; justify-content: space-between; gap: var(--item-gap); margin-top: var(--group-gap); padding: var(--group-gap); border: 1px solid var(--teal); color: var(--teal); font: 400 clamp(25px, 2.4vw, 34px)/1.15 var(--display); letter-spacing: -.02em; border-radius: var(--radius-sm); }
.req-result-arrow{ position: absolute; top: 0; left: 50%; transform: translate(-50%, -70%); padding-inline: var(--text-gap); background: var(--navy); font: 400 25px/1 var(--mono); }
.req-result-dot{ width: 8px; height: 8px; flex: none; background: var(--teal); }
.req-result p{ font: inherit; margin: 0; }
.req-support{ padding-top: var(--group-gap); }
.req-support strong{ color: var(--gold); font: 400 18px/1.5 var(--display); }
.req-support p{ margin-top: var(--inline-gap); color: var(--soft); font-size: 14px; line-height: 1.6; }
.req-jumps{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: var(--feature-gap); border-top: 1px solid var(--stroke); }
.req-jumps a{ display: flex; align-items: center; gap: var(--text-gap); padding: var(--group-gap) var(--item-gap); min-height: var(--control-height); color: var(--paper); font-size: 15px; }
.req-jumps a:first-child{ padding-left: 0; }
.req-jumps a > span:first-child{ color: var(--gold); font: 400 11px/1.5 var(--mono); }
.req-jumps a > span:last-child{ margin-left: auto; color: var(--teal); }
.req-jumps a:hover{ background: var(--navy); color: var(--teal); }
.req-jumps a:active{ background: var(--navy-2); }
.req-section-head{ margin-bottom: var(--section-content-gap); }
.req-section-head > div:only-child{ grid-column: 1/-1; }
.req-section-head h2{ max-width: 22ch; }
.req-section-head > p{ color: var(--soft); max-width: 52ch; font-size: 17px; line-height: 1.65; }
.req-comparison{ background: var(--navy); }
.req-compare-list{ margin: 0; padding: var(--card-padding); }
.req-compare-row{ display: grid; grid-template-columns: minmax(0, .55fr) minmax(0, 1fr) minmax(0, 1.45fr); gap: var(--grid-gap); padding-block: var(--group-gap); border-top: 1px solid var(--hairline); }
.req-compare-row:first-child{ padding-top: 0; border-top: 0; }
.req-compare-row:last-child{ padding-bottom: 0; }
.req-compare-row dt{ padding-top: var(--detail-gap); font: 400 18px/1.4 var(--display); }
.req-compare-row dd{ margin: 0; font-size: 17px; line-height: 1.55; }
.req-small-label{ display: block; margin-bottom: var(--text-gap); font: 400 11px/1.55 var(--mono); text-transform: uppercase; letter-spacing: .045em; }
.req-before{ color: var(--soft); }
.req-before .req-small-label{ color: var(--gold); }
.req-after .req-small-label{ color: var(--teal); }
.req-after p{ color: var(--paper); }
.req-section-note{ margin-top: var(--group-gap); max-width: 85ch; color: var(--soft); font-size: 14px; line-height: 1.7; }
.req-criteria-grid{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--grid-gap); }
.req-criterion{ display: flex; flex-direction: column; gap: var(--group-gap); padding: var(--card-padding); }
.req-criterion h3{ margin-top: var(--text-gap); font: 400 clamp(27px, 2.7vw, 36px)/1.15 var(--display); letter-spacing: -.025em; }
.req-big-number{ color: var(--gold); font: 400 14px/1.5 var(--mono); }
.req-lead{ margin-top: var(--item-gap); color: var(--soft); font-size: 18px; line-height: 1.6; }
.req-checks{ display: grid; gap: var(--item-gap); }
.req-checks li{ display: flex; align-items: start; gap: var(--text-gap); color: var(--paper); font-size: 16px; line-height: 1.65; }
.req-checks svg{ width: 20px; height: 20px; flex: none; margin-top: var(--detail-gap); color: var(--teal); fill: none; stroke: currentColor; stroke-width: 1.4; }
.req-question{ display: flex; align-items: start; gap: var(--item-gap); margin-top: auto; padding: var(--card-padding-dense); background: var(--navy-deep); border-radius: var(--radius-sm); }
.req-question > span{ color: var(--gold); font: 400 24px/1.3 var(--mono); }
.req-question p{ color: var(--paper); font-size: 18px; line-height: 1.5; }
.req-criterion:last-child{ grid-column: 1/-1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--grid-gap-wide); background: var(--navy); }
.req-criterion:last-child .req-question{ margin-top: 0; }
.req-examples{ background: var(--navy); }
.req-case{ padding-block: var(--section-content-gap); border-top: 1px solid var(--stroke); }
.req-case:last-child{ padding-bottom: 0; }
.req-case-header{ display: flex; align-items: baseline; gap: var(--group-gap); margin-bottom: var(--block-gap); }
.req-case-index{ color: var(--gold); font: 400 16px/1.5 var(--mono); }
.req-case h3{ font: 400 clamp(28px, 3vw, 40px)/1.2 var(--display); letter-spacing: -.025em; }
.req-case-layout{ display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: var(--grid-gap-wide); }
.req-case-story .req-small-label{ color: var(--soft); }
.req-case-idea{ margin-bottom: var(--group-gap); color: var(--gold); font: 400 24px/1.4 var(--display); letter-spacing: -.015em; }
.req-case-story > p:last-child{ color: var(--soft); font-size: 16px; line-height: 1.75; }
.req-case-roles{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--group-gap); }
.req-case-roles > div{ padding-top: var(--item-gap); border-top: 1px solid var(--gold); }
.req-case-roles > div:last-child{ border-color: var(--teal); }
.req-case h4{ margin-bottom: var(--item-gap); font: 400 15px/1.5 var(--display); color: var(--gold); }
.req-case-roles > div:last-child h4{ color: var(--teal); }
.req-case-work p{ color: var(--paper); font-size: 16px; line-height: 1.7; }
.req-case-test{ margin-top: var(--group-gap); padding: var(--card-padding-dense); background: var(--navy-deep); border-radius: var(--radius-sm); }
.req-case-test h4{ color: var(--teal); margin-bottom: var(--inline-gap); }
.req-case-test h4 span{ margin-right: var(--inline-gap); }
.req-fit-grid{ display: grid; grid-template-columns: repeat(2,minmax(0, 1fr)); gap: var(--grid-gap-wide); }
.req-fit-grid h3{ margin-bottom: var(--group-gap); color: var(--gold); font: 400 25px/1.3 var(--display); }
.req-fit-grid > div:last-child h3{ color: var(--teal); }
.req-fit-grid li{ padding-block: var(--item-gap); border-top: 1px solid var(--stroke); font-size: 18px; line-height: 1.6; }
.req-fit-notes{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--grid-gap-wide); margin-block: var(--block-gap); color: var(--soft); font-size: 15px; line-height: 1.7; }
.req-application{ color: var(--paper); background: var(--navy); }
.req-application-list{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--grid-gap-wide); }
.req-application-list > li{ display: flex; align-items: baseline; gap: var(--group-gap); padding-block: var(--group-gap); border-top: 1px solid var(--stroke); }
.req-application-list h3{ margin-bottom: var(--inline-gap); font: 400 24px/1.3 var(--display); letter-spacing: -.015em; }
.req-application-list p{ color: var(--soft); font-size: 16px; line-height: 1.65; }
.req-application-list .req-apply-cell{ flex-direction: column; justify-content: center; gap: var(--item-gap); }
.req-process{ margin-top: var(--section-content-gap); padding-top: var(--block-gap); border-top: 1px solid var(--stroke); }
.req-process h3{ font: 400 24px/1.3 var(--display); margin-bottom: var(--group-gap); }
.req-process ol{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--group-gap); }
.req-process li{ display: flex; flex-wrap: wrap; align-items: baseline; column-gap: var(--text-gap); row-gap: var(--inline-gap); font-size: 16px; line-height: 1.5; }
.req-process li > span:nth-child(2){ flex-basis: 100%; order: 1; }
.req-process-arrow{ margin-left: auto; color: var(--teal); }
.req-reading{ padding-block: var(--block-gap); background: var(--navy-deep); }
.req-reading .wrap{ display: grid; grid-template-columns: repeat(2,minmax(0, 1fr)); gap: var(--grid-gap-wide); }
.req-reading h2{ color: var(--gold); font: 400 14px/1.6 var(--display); }
.req-reading p{ margin-top: var(--inline-gap); max-width: 50ch; color: var(--soft); font-size: 13px; line-height: 1.6; }
.req-reading a{ display: inline-block; padding-block: var(--inline-gap); color: var(--soft); font-size: 13px; line-height: 1.6; }
.req-reading a:hover{ color: var(--teal); text-decoration: underline; text-underline-offset: 4px; }
.requirements a:focus-visible,.requirements button:focus-visible{ outline: 2px solid var(--gold); outline-offset: 4px; }
@media (max-width: 1000px){
  .req-hero-grid{ gap: var(--grid-gap); }
  .req-equation{ padding: var(--card-padding); }
  .req-section-head,.req-case-layout,.req-fit-grid,.req-fit-notes,.req-reading .wrap{ gap: var(--block-gap); }
  .req-jumps{ grid-template-columns: repeat(2,minmax(0, 1fr)); }
  .req-jumps a:nth-child(odd){ padding-left: 0; }
  .req-compare-row{ grid-template-columns: minmax(0, .65fr) minmax(0, 1fr) minmax(0, 1.5fr); }
}
@media (max-width: 760px){
  .req-hero-grid,.req-section-head,.req-criteria-grid,.req-case-layout,.req-fit-grid,.req-fit-notes,.req-reading .wrap{ grid-template-columns: minmax(0, 1fr); }
  .req-hero-grid{ gap: var(--block-gap); }
  .req-hero-copy h1{ max-width: none; }
  .req-hero-line{ max-width: 28ch; }
  .req-equation{ padding: var(--card-padding-compact); }
  .req-ingredients li{ padding-block: var(--item-gap); font-size: 22px; }
  .req-result{ margin-top: var(--item-gap); padding: var(--item-gap); font-size: 27px; }
  .req-support{ padding-top: var(--item-gap); }
  .req-jumps{ margin-top: var(--block-gap); }
  .req-jumps a{ font-size: 14px; padding-block: var(--item-gap); }
  .req-section-head{ gap: var(--item-gap); }
  .req-section-head > p{ font-size: 17px; }
  .req-compare-row{ grid-template-columns: minmax(0, 1fr); gap: var(--item-gap); }
  .req-compare-row dt{ color: var(--paper); font-size: 24px; }
  .req-small-label{ margin-bottom: var(--inline-gap); }
  .req-compare-row dd{ font-size: 16px; }
  .req-after{ padding: var(--card-padding-dense); background: var(--navy-2); color: var(--paper); border-radius: var(--radius-sm); }
  .req-after .req-small-label{ color: var(--teal); }
  .req-criterion:last-child{ grid-column: auto; display: flex; }
  .req-criterion{ gap: var(--item-gap); }
  .req-case-header{ gap: var(--item-gap); }
  .req-case h3{ font-size: 30px; }
  .req-case-layout{ gap: var(--group-gap); }
  .req-case-roles{ grid-template-columns: minmax(0, 1fr); gap: var(--group-gap); }
  .req-case-work p,.req-case-story > p:last-child{ font-size: 15px; }
  .req-fit-grid{ gap: var(--block-gap); }
  .req-fit-grid h3{ margin-bottom: var(--item-gap); }
  .req-fit-notes{ gap: var(--item-gap); }
  .req-application-list{ grid-template-columns: minmax(0, 1fr); }
  .req-application-list > li{ padding-block: var(--item-gap); gap: var(--item-gap); }
  .req-application-list h3{ font-size: 22px; }
  .req-application-list .req-apply-cell{ padding-top: var(--group-gap); }
  .req-process ol{ grid-template-columns: minmax(0, 1fr); }
  .req-process li{ flex-wrap: nowrap; }
  .req-process li > span:nth-child(2){ flex-basis: auto; order: 0; }
  .req-process-arrow{ display: none; }
}
@media (max-width: 360px){
  .req-jumps{ grid-template-columns: minmax(0, 1fr); }
  .req-jumps a{ padding-inline: 0; }
  .req-hero .eyebrow{ font-size: 10px; }
}
