/* Buyer-facing pages extend Orbitra's paper, carbon, red, and green palette. */
.buyer-page { background: #f2efe5; color: #1b2721; }
.buyer-page h1, .buyer-page h2, .buyer-page h3 { font-family: var(--font-display); font-weight: 500; letter-spacing: -.035em; text-wrap: balance; }
.buyer-page h1 { font-size: clamp(3rem, 5vw, 4.9rem); line-height: 1.06; max-width: 18ch; }
.buyer-page h1 span { color: #08615a; }
.buyer-page h2 { font-size: clamp(2rem, 3.4vw, 3.2rem); line-height: 1.13; }
.buyer-page h3 { font-size: clamp(1.3rem, 2vw, 1.65rem); line-height: 1.25; }
.buyer-page p { max-width: 66ch; line-height: 1.65; text-wrap: pretty; }
.buyer-page .btn--primary { background: #bd252c; border-color: #bd252c; color: #fff; }
.buyer-page a:focus-visible, .buyer-page summary:focus-visible, .buyer-table-scroll:focus-visible { outline: 3px solid #147e71; outline-offset: 5px; }
.buyer-page ::selection { background: #bed7c8; color: #172a21; }
.buyer-hero { padding: 156px 0 76px; }
.buyer-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 75px; align-items: center; }
.buyer-hero__grid > div > p { font-size: 1.18rem; max-width: 59ch; margin-top: 26px; }
.buyer-actions { display: flex; gap: 24px; align-items: center; flex-wrap: wrap; margin-top: 28px; }
.buyer-link { display: inline-block; font-weight: 600; font-size: .94rem; text-decoration: underline; text-underline-offset: 5px; }
.buyer-principle, .buyer-chapters { border-block: 1px solid #aeb9af; padding-block: 24px; }
.buyer-principle h2 { font-size: 1.55rem; line-height: 1.25; }
.buyer-principle p { color: #526157; font-size: .96rem; margin-block: 16px 20px; }
.buyer-chapters a { display: flex; gap: 18px; align-items: center; padding: 17px 0; font-size: 1.02rem; }
.buyer-chapters a + a { border-top: 1px solid #c6cfc6; }
.buyer-chapters a span { color: #536859; font: .75rem var(--font-mono); }
.buyer-band { padding: 64px 0; }
.buyer-band--dark { background: #14251c; color: #edf2e9; }
.buyer-band--dark p { color: #c7d8ca; }
.buyer-band--green { background: #dce6db; color: #213b2d; }
.buyer-fit { display: grid; grid-template-columns: 1.1fr 1fr; gap: 72px; align-items: center; }
.buyer-fit p { margin-top: 18px; }
.buyer-fit > p { margin-top: 0; }
.buyer-fit .buyer-link { margin-top: 22px; }
.buyer-fit > .btn, .buyer-fit > div > .btn { justify-self: start; }
.buyer-fit > div:last-child > .buyer-link { display: block; }
.buyer-list { padding-left: 20px; margin-top: 22px; }
.buyer-list li { line-height: 1.6; margin-top: 12px; }
.tour-chapter { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 26px 64px; padding: 70px 0; border-bottom: 1px solid #bdc8bd; scroll-margin-top: 110px; }
.tour-chapter__index { font: .83rem var(--font-mono); color: #47624d; padding-top: 7px; }
.tour-chapter h2 { max-width: 26ch; margin-bottom: 24px; }
.tour-chapter > div > p { font-size: 1.06rem; color: #43564b; }
.buyer-facts { margin: 28px 0; }
.buyer-facts > div { display: grid; grid-template-columns: 155px minmax(0, 1fr); gap: 26px; border-top: 1px solid #b9c8ba; padding: 17px 0; }
.buyer-facts dt { font-size: .87rem; font-weight: 600; color: #274e3b; }
.buyer-facts dd { margin: 0; color: #42554a; font-size: .97rem; line-height: 1.65; max-width: 65ch; }
.product-capture { grid-column: 1 / -1; margin: 20px 0 0; width: 100%; }
.product-capture img { display: block; width: 100%; height: auto; border: 1px solid #9baa9d; background: #17251c; }
.product-capture figcaption { max-width: 70ch; margin-top: 14px; color: #435b4b; font-size: .87rem; line-height: 1.6; }
.buyer-section-head { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: end; margin-bottom: 38px; }
.buyer-section-head p { color: #4b6253; }
.buyer-catalog, .buyer-comparison, .buyer-licensing { padding-block: 72px; }
.action-entry { border-top: 1px solid #afbcaf; scroll-margin-top: 112px; }
.action-entry:last-child { border-bottom: 1px solid #afbcaf; }
.action-entry summary { cursor: pointer; display: grid; grid-template-columns: 160px 1fr 22px; gap: 28px; align-items: center; padding: 27px 0; list-style: none; }
.action-entry summary::-webkit-details-marker { display: none; }
.action-entry summary > span { font-size: .8rem; color: #506c58; }
.action-entry summary > svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.action-entry[open] summary > svg { transform: rotate(180deg); }
.action-body { padding: 0 52px 34px 188px; }
.action-body > p { color: #3d5747; }
.action-body .buyer-facts > div { grid-template-columns: 140px 1fr; }
.buyer-table-scroll { overflow-x: auto; border: 1px solid #aebcaf; scrollbar-color: #557761 #e3eadd; }
.buyer-table-scroll table { width: 100%; min-width: 760px; border-collapse: collapse; text-align: left; font-size: .96rem; }
.buyer-table-scroll th, .buyer-table-scroll td { padding: 24px; vertical-align: top; line-height: 1.65; border-bottom: 1px solid #bdc9be; }
.buyer-table-scroll thead th { background: #1e3b2a; color: #edf3e8; font-weight: 500; }
.buyer-table-scroll tbody th { width: 22%; color: #254f36; font-weight: 600; }
.buyer-table-scroll td { width: 39%; }
.buyer-table-scroll tr:last-child > * { border-bottom: 0; }
.buyer-table-scroll td:last-child { background: #e1e9dd; }
.buyer-licensing > p { color: #4b6253; }

/* The homepage names the buyer's incident before showing the response. */
.product-story .buyer-pain { padding-block: 58px; background: #e4eade; }
.buyer-pain__head { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: end; margin-bottom: 32px; }
.buyer-pain__head > p { line-height: 1.65; color: #465d4b; max-width: 57ch; }
.buyer-pain .story-usecase { grid-template-columns: .8fr 1.2fr; gap: 50px; padding-block: 24px; }
.buyer-pain .story-usecase h3 { max-width: 24ch; }
.buyer-responses { background: #f2efe5; color: #203529; padding: 70px 0; }
.buyer-response-row { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; padding: 24px 0; border-top: 1px solid #b5c3b5; }
.buyer-response-row h3 { font-size: 1.5rem; }
.buyer-response-row p { color: #47604d; line-height: 1.6; }
.buyer-response-row a { display: inline-block; margin-top: 10px; font-size: .9rem; text-decoration: underline; text-underline-offset: 4px; }
.buyer-responses .buyer-link { margin-top: 24px; }
.product-story .buyer-microsoft { background: #192d21; color: #edf3e8; padding: 64px 0; }
.buyer-microsoft__intro { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; margin-bottom: 32px; }
.buyer-microsoft__intro p { color: #d0dfd0; line-height: 1.65; }
.buyer-ms-row { display: grid; grid-template-columns: .8fr 1.2fr; gap: 50px; padding: 22px 0; border-top: 1px solid #506952; }
.buyer-ms-row strong { font-weight: 500; font-family: var(--font-display); font-size: 1.2rem; }
.buyer-ms-row p { color: #c3d7c5; line-height: 1.6; }
.buyer-microsoft .buyer-link { margin-top: 24px; }
.buyer-microsoft a:focus-visible { outline-color: #96dfb3; }
.product-story .story-evidence .product-capture { margin-top: 42px; }
@media (hover: hover) and (pointer: fine) {
  .buyer-page .btn--primary:hover { background: #9f1923; border-color: #9f1923; }
  .buyer-chapters a:hover, .action-entry summary:hover h3 { color: #08705d; }
}
@media (max-width: 1000px) {
  .buyer-hero__grid { grid-template-columns: 1fr 250px; gap: 38px; }
  .buyer-fit, .buyer-section-head, .buyer-pain__head, .buyer-microsoft__intro { gap: 36px; }
  .tour-chapter { grid-template-columns: 135px 1fr; gap: 25px 32px; }
  .buyer-facts > div { grid-template-columns: 125px 1fr; gap: 20px; }
  .action-entry summary { grid-template-columns: 130px 1fr 20px; gap: 22px; }
  .action-body { padding-left: 152px; padding-right: 0; }
}
@media (max-width: 700px) {
  .buyer-hero { padding: 118px 0 46px; }
  .buyer-page h1 { font-size: clamp(2.65rem, 9.3vw, 4rem); }
  .buyer-hero__grid, .buyer-fit, .buyer-section-head, .buyer-pain__head, .buyer-microsoft__intro { grid-template-columns: 1fr; gap: 26px; }
  .buyer-hero__grid > div > p { font-size: 1.05rem; }
  .buyer-principle h2 { font-size: 1.4rem; }
  .buyer-chapters { padding-block: 8px; }
  .buyer-chapters a { font-size: .93rem; padding-block: 14px; }
  .buyer-actions { gap: 20px; }
  .buyer-actions .btn { white-space: normal; text-align: center; }
  .buyer-band, .buyer-catalog, .buyer-comparison, .buyer-licensing { padding-block: 46px; }
  .tour-chapter { grid-template-columns: 1fr; gap: 18px; padding-block: 42px; }
  .buyer-facts > div, .action-body .buyer-facts > div { grid-template-columns: 1fr; gap: 7px; }
  .buyer-facts dd { font-size: .94rem; }
  .action-entry summary { grid-template-columns: 1fr 20px; gap: 8px 14px; padding-block: 22px; }
  .action-entry summary > span { grid-column: 1; }
  .action-entry summary h3 { grid-column: 1; grid-row: 2; font-size: 1.3rem; }
  .action-entry summary > svg { grid-column: 2; grid-row: 1 / 3; }
  .action-body { padding: 0 0 28px; }
  .buyer-table-scroll th, .buyer-table-scroll td { padding: 18px; }
  .product-story .buyer-pain, .buyer-responses, .product-story .buyer-microsoft { padding-block: 44px; }
  .buyer-pain .story-usecase, .buyer-response-row, .buyer-ms-row { grid-template-columns: 1fr; gap: 12px; }
  .buyer-pain .story-usecase h3 { max-width: none; }
  .buyer-response-row h3 { font-size: 1.35rem; }
}
