/* Figma 2026-11-03: native service views and discrete iPad product illustrations. */
.offer-section { padding: 64px; background: var(--white); }
.rail-mobile { display: none; }
.offer-section .chapter-rail::after { display: none; }
.offer-section .chapter-rail { gap: 12px; }
.offer-section .chapter-rail small { font-size: 13px; max-width: none; width: 168px; }
.offer-section .button, .education-showcase .button, .priority-services .button { padding: 12px 24px; border: 0; }
.offer-body { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.offer-body > h2 { margin: 0; font-size: 40px; line-height: 1.45; width: 100%; }
.offer-intro { color: var(--muted); font-size: 18px; line-height: 1.45; max-width: none; }
.offer-note { color: var(--muted); font-size: 14px; line-height: 1.45; }
.offer-body > div { max-width: 100%; }
.priority-services { min-height: 0; }
.priority-services .offer-body, .education-showcase .offer-body { gap: 28px; }
.priority-grid { width: 100%; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; }
.priority-grid article { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding: 24px; border: 1px solid var(--line); border-radius: 16px; background: var(--ice); }
.priority-number { font-size: 14px; }
.priority-grid h3 { font-size: 23px; line-height: 1.45; }
.priority-grid p { font-size: 16px; color: var(--muted); }
.priority-link { background: var(--white); color: var(--brand); padding-inline: 24px; }
.priority-link:hover { background: var(--tint); }
.priority-mobile-arrow { display: none; }
.agent-workflow { width: 100%; padding: 32px; border-radius: 16px; background: var(--navy); color: white; display: flex; flex-direction: column; gap: 16px; }
.workflow-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-right: 12%; }
.workflow-heading h3 { font-size: 24px; line-height: 1.45; }
.workflow-heading small { font-size: 14px; }
.workflow-steps { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; }
.workflow-mobile { display: none; }
.workflow-steps article { display: flex; flex-direction: column; gap: 12px; }
.workflow-steps h4 { font-size: 20px; line-height: 1.45; }
.workflow-steps p, .workflow-steps small { font-size: 14px; line-height: 1.45; }
.agent-scenarios { width: 100%; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 20px; }
.agent-scenarios article, .legacy-steps article { padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--ice); display: flex; flex-direction: column; gap: 12px; }
.agent-scenarios h3 { font-size: 20px; line-height: 1.45; }
.agent-scenarios p { font-size: 14px; line-height: 1.45; color: var(--muted); }
.offer-knowledge-base, .offer-search { background: var(--ice); }
.offer-split { display: grid; grid-template-columns: minmax(0,386fr) minmax(0,682fr); gap: 32px; width: 100%; align-items: start; }
.offer-features { display: flex; flex-direction: column; gap: 24px; }
.offer-features article { display: flex; flex-direction: column; gap: 8px; }
.offer-features h3 { font-size: 22px; line-height: 1.45; }
.offer-features p { font-size: 16px; line-height: 1.45; color: var(--muted); }
.knowledge-demo { padding: 32px; border: 1px solid var(--line); background: white; border-radius: 16px; display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.demo-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.demo-heading h3 { font-size: 22px; }
.demo-heading small { color: var(--muted); font-size: 14px; }
.knowledge-tags { display: flex; gap: 12px; flex-wrap: wrap; }
.knowledge-tags span { flex: 1; min-width: 80px; padding: 12px; background: var(--tint); color: var(--brand); font-size: 16px; border-radius: 24px; }
.knowledge-question { padding: 24px; background: var(--tint); border-radius: 16px; font-size: 20px; font-weight: 500; }
.knowledge-answer { display: flex; flex-direction: column; gap: 16px; font-size: 18px; line-height: 1.45; }
.knowledge-answer p:first-child { font-size: 17px; }
.knowledge-source { padding: 20px; border: 1px solid var(--line); background: var(--ice); border-radius: 16px; display: flex; flex-direction: column; gap: 8px; }
.knowledge-source strong { font-size: 14px; color: var(--brand); font-weight: 500; }
.knowledge-source p { font-size: 15px; color: var(--muted); }
.knowledge-demo .offer-note { font-size: 13px; }
.global-copy { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.global-demo { border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: white; min-width: 0; width: 100%; }
.browser-bar { background: var(--tint); color: var(--muted); padding: 16px; font-size: 14px; }
.browser-bar span { margin-left: 16px; }
.global-page { padding: 32px; display: flex; flex-direction: column; gap: 24px; }
.global-nav { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.global-nav strong { color: var(--brand); font-size: 19px; }
.global-nav small { font-size: 12px; color: var(--muted); }
.global-hero { background: var(--navy); color: white; padding: 32px; border-radius: 16px; display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.global-hero > small { font-size: 12px; }
.global-hero h3 { font-size: 34px; line-height: 1.45; }
.global-hero p { font-size: 15px; line-height: 1.45; }
.demo-quote { background: white; color: var(--brand); padding: 16px; font-size: 16px; }
.global-products { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.global-products > div { background: var(--ice); border: 1px solid var(--line); border-radius: 16px; padding: 20px; display: flex; flex-direction: column; gap: 16px; }
.global-products strong { font-size: 17px; font-weight: 500; }
.global-products small { color: var(--brand); font-size: 13px; }
.global-page .offer-note { font-size: 12px; }
.search-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; width: 100%; }
.search-grid article { border: 1px solid var(--line); border-radius: 16px; padding: 32px; background: white; display: flex; flex-direction: column; gap: 20px; }
.search-label { font-size: 34px; color: var(--brand); }
.search-grid h3 { font-size: 24px; line-height: 1.45; }
.search-grid p { font-size: 17px; color: var(--muted); }
.search-grid ul { padding: 24px 0 0; border-top: 1px solid var(--line); list-style: none; display: flex; flex-direction: column; gap: 20px; font-size: 17px; }
.search-grid li span { margin-right: 8px; }
.offer-bottom { display: flex; align-items: flex-start; gap: 32px; width: 100%; }
.offer-bottom > p { flex: 0 1 760px; }
.offer-legacy .offer-bottom { gap: 24px; }
.offer-legacy .offer-bottom > p { flex-basis: 780px; }
.offer-bottom .button { flex-shrink: 0; }
.legacy-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; width: 100%; }
.legacy-steps article { padding: 24px; gap: 16px; }
.legacy-steps article > span { font-size: 14px; }
.legacy-steps h3 { font-size: 22px; line-height: 1.45; }
.legacy-steps p { color: var(--muted); font-size: 16px; }
.offer-quiet { background: transparent; color: var(--brand); }
.offer-quiet:hover { background: var(--tint); }
.education-showcase { min-height: 0; }
.education-showcase .offer-intro, .education-showcase .offer-note { color: var(--white); }
.subject-tabs { display: flex; flex-wrap: wrap; gap: 12px; }
.subject-tabs button { width: 140px; padding: 12px; background: var(--tint); border: 0; border-radius: 24px; color: var(--brand); font-size: 16px; line-height: 1.45; text-align: left; font-weight: 500; }
.subject-tabs button[aria-selected="true"] { background: var(--brand); color: white; }
.subject-layout { display: grid; grid-template-columns: minmax(0,660fr) minmax(0,408fr); gap: 32px; align-items: start; width: 100%; }
.subject-art { width: 100%; aspect-ratio: 660 / 413; overflow: hidden; border-radius: 16px; }
.subject-image { width: 100%; height: 100%; object-fit: contain; }
.subject-copy { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.subject-copy h3 { font-size: 30px; line-height: 1.45; }
.subject-badge { display: inline-block; border-radius: 24px; padding: 12px; min-width: 210px; max-width: 100%; background: var(--tint); color: var(--brand); font-size: 16px; line-height: 1.45; font-weight: 500; }
.subject-features { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0; font-size: 18px; line-height: 1.45; }
.subject-section .subject-features { gap: 20px; }
.subject-section .subject-badge { width: 240px; }
.subject-section.subject-reverse { background: var(--ice); }
.subject-reverse .subject-layout { grid-template-columns: minmax(0,408fr) minmax(0,660fr); }
.subject-reverse .subject-art { order: 2; }
.subject-reverse .subject-copy { order: 1; }
.education-showcase .subject-features { color: white; }
.service-overview { display: flex; flex-direction: column; gap: 32px; }
.service-overview-row { display: grid; grid-template-columns: 250px minmax(0,594px) max-content; gap: 24px; align-items: start; }
.service-overview-row h3 { font-size: 23px; line-height: 1.45; }
.service-overview-row p { font-size: 17px; line-height: 1.45; color: var(--muted); }
.service-consult { padding: 12px 24px; border: 0; color: var(--brand); background: white; }
.service-consult:hover { background: var(--tint); }
.service-divider { height: 1px; width: 100%; background: var(--line); }
@media (min-width:1441px) {
  .offer-section, .priority-services, .education-showcase { padding-inline: calc((100% - 1440px) / 2 + 64px); }
}
@media (min-width:769px) and (max-width:1200px) {
  .service-overview-row { grid-template-columns: 180px minmax(0,1fr) max-content; gap: 20px; }
  .offer-section { padding: 48px 32px; grid-template-columns: 130px minmax(0,1fr); gap: 24px; }
  .priority-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .agent-scenarios { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .offer-split, .subject-layout, .subject-reverse .subject-layout { grid-template-columns: minmax(0,1fr) minmax(0,1.2fr); gap: 24px; }
  .global-nav small { display: none; }
  .global-hero h3 { font-size: 28px; }
  .global-products > div { padding: 12px; }
  .search-grid article { padding: 24px; }
}
@media (max-width:768px) {
  .education-work-together, .rail-desktop { display: none; }
  .rail-mobile { display: inline; }
  .offer-section, .priority-services, .education-showcase { padding: 48px 20px; }
  .offer-section .chapter-rail, .priority-services .chapter-rail, .education-showcase .chapter-rail { margin-bottom: 24px; color: var(--brand); }
  .education-showcase .chapter-rail { color: white; }
  .offer-body, .priority-services .offer-body, .education-showcase .offer-body { gap: 24px; }
  .offer-body > h2 { font-size: 28px; line-height: 1.45; text-wrap: balance; }
  .page-home .offer-section .offer-body > h2 { max-width: 275px; }
  .page-service .page-intro h1, .page-services .page-intro h1, .page-contact .page-intro h1 { text-wrap: balance; }
  .service-overview-row { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
  .service-overview-row h3 { font-size: 21px; }
  .service-overview-row p { font-size: 16px; }
  .offer-intro { font-size: 16px; }
  .offer-note { font-size: 13px; }
  .priority-grid { grid-template-columns: 1fr; gap: 24px; }
  .priority-grid article { padding: 20px; gap: 12px; }
  .priority-grid h3 { font-size: 21px; }
  .priority-grid p { font-size: 15px; }
  .priority-grid p br { display: none; }
  .priority-number, .priority-link { display: none; }
  .priority-mobile-arrow { display: inline; }
  .agent-workflow { padding: 24px; gap: 20px; }
  .workflow-heading { padding: 0; flex-direction: column-reverse; align-items: flex-start; gap: 16px; }
  .workflow-heading h3 { font-size: 20px; }
  .workflow-heading h3, .workflow-steps { display: none; }
  .workflow-mobile { display: block; font-size: 20px; font-weight: 700; line-height: 1.45; }
  .workflow-steps h4 { font-size: 16px; }
  .workflow-steps article { gap: 8px; }
  .workflow-steps p, .workflow-steps small { font-size: 12px; }
  .agent-scenarios { grid-template-columns: 1fr; gap: 24px; }
  .agent-scenarios article { padding: 20px; }
  .agent-scenarios p { font-size: 15px; }
  .agent-scenarios br { display: none; }
  .offer-split, .subject-layout, .subject-reverse .subject-layout { display: flex; flex-direction: column; gap: 24px; }
  .offer-features { gap: 24px; }
  .offer-features h3 { font-size: 20px; }
  .offer-features p { font-size: 15px; }
  .knowledge-demo { padding: 20px; width: 100%; }
  .demo-heading h3 { font-size: 18px; }
  .demo-heading small { font-size: 12px; }
  .knowledge-tags { display: none; }
  .knowledge-question { padding: 16px; font-size: 18px; }
  .knowledge-answer { font-size: 16px; }
  .knowledge-source { padding: 16px; }
  .knowledge-source p { font-size: 14px; }
  .offer-knowledge-base .offer-features { order: 2; }
  .offer-knowledge-base .knowledge-demo { order: 1; }
  .global-demo { order: -1; }
  .global-page { padding: 24px; background: var(--navy); color: white; gap: 20px; }
  .global-nav strong { color: white; font-size: 13px; }
  .global-nav small { font-size: 0; }
  .global-nav small::after { content: 'MENU'; font-size: 13px; color: white; }
  .global-hero { padding: 0; border-radius: 0; }
  .global-hero > small, .global-products, .global-page > .offer-note { display: none; }
  .global-hero h3 { font-size: 30px; }
  .search-grid { grid-template-columns: 1fr; }
  .search-grid article { padding: 24px; gap: 16px; }
  .search-label { font-size: 30px; }
  .search-grid h3 { font-size: 22px; }
  .search-grid p { font-size: 16px; }
  .search-grid ul { font-size: 15px; gap: 16px; }
  .offer-bottom { flex-direction: column; gap: 24px; }
  .offer-bottom > p, .offer-legacy .offer-bottom > p { flex: auto; }
  .legacy-steps { display: flex; flex-direction: column; gap: 24px; }
  .legacy-steps article { background: none; border: 0; padding: 0; display: grid; grid-template-columns: 24px minmax(0,1fr); gap: 8px; }
  .legacy-steps article > span { font-size: 20px; color: var(--ink); font-weight: 700; }
  .legacy-steps h3 { font-size: 20px; }
  .legacy-steps p { font-size: 15px; grid-column: 1 / -1; }
  .offer-legacy { background: var(--ice); }
  .subject-tabs { gap: 24px 10px; }
  .subject-tabs button { width: calc((350px - 20px) / 3); max-width: calc((100vw - 60px) / 3); }
  .subject-copy { width: 100%; gap: 24px; }
  .subject-copy h3 { font-size: 26px; }
  .subject-features { font-size: 16px; }
  .home-subject .subject-copy h3, .education-showcase > .offer-body > .offer-note { display: none; }
  .home-subject .subject-badge { min-width: 0; background: transparent; color: white; padding: 0; border-radius: 0; font-size: 18px; font-weight: 700; }
  .subject-section .offer-intro { display: none; }
  .subject-section .subject-features { gap: 0; color: var(--muted); }
  .subject-section .subject-badge { display: none; }
  .subject-reverse .subject-art, .subject-reverse .subject-copy { order: 0; }
  .subject-section .offer-body > h2 { font-size: 26px; }
  .subject-section .subject-copy { gap: 24px; }
}
@media (prefers-reduced-motion:no-preference) {
  .priority-grid article, .agent-scenarios article { transition: transform .2s,box-shadow .2s; }
  .priority-grid article:focus-within, .priority-grid article:hover, .agent-scenarios article:hover { transform: translateY(-3px); box-shadow: 0 10px 24px #102b500d; }
}
