/* Website tokens and type scale come from site.css. */
.stage-solution-page.quiz-page [hidden] { display: none !important; }
.stage-solution-page.quiz-page { background: #fff; --soft: #f8f9fc; }
.stage-solution-page.quiz-page button { color: inherit; }
.stage-solution-page.quiz-page .pill { color: #fff; }
.stage-solution-page.quiz-page .pill.white { color: #2e65ff; }
.stage-solution-page.quiz-page .header { position: sticky; top: 0; z-index: 1000; height: 4.5rem; border-bottom: 1px solid #e6ebf680; background: #ffffffed; backdrop-filter: blur(12px); }
.stage-solution-page.quiz-page .header-inner { height: 100%; min-height: 100%; }
.stage-solution-page.quiz-page .header .brand { width: 11rem; }
.stage-solution-page.quiz-page .header .brand img { width: 100%; }
.stage-solution-page.quiz-page .header nav { gap: 1.25rem; margin-left: auto; white-space: nowrap; }
.stage-solution-page.quiz-page .header-actions { gap: .75rem; }
.stage-solution-page.quiz-page .header-phone { display: inline-flex; align-items: center; gap: .375rem; min-height: 44px; color: #263a59; font-size: .875rem; font-weight: 600; }
.stage-solution-page.quiz-page .header-phone:hover { color: var(--blue); }
.stage-solution-page.quiz-page .header-phone img { width: 1.125rem; height: 1.125rem; filter: invert(31%) sepia(90%) saturate(4184%) hue-rotate(219deg) brightness(100%) contrast(103%); }
.stage-solution-page.quiz-page .header-cta { min-height: 44px; padding-inline: 1.125rem; font-size: .875rem; }
.stage-solution-page.quiz-page .nav-toggle { width: 38px; height: 38px; min-height: 38px; padding: .5rem; border-radius: .5rem; align-content: center; justify-items: center; gap: 4px; }
.stage-solution-page.quiz-page .nav-toggle span { display: block; width: 18px; height: 2px; border-radius: 2px; background: #263a59; transition: transform .18s, opacity .18s; }
.stage-solution-page.quiz-page .nav-toggle[aria-expanded="true"] span:first-child { transform: translateY(6px) rotate(45deg); }
.stage-solution-page.quiz-page .nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.stage-solution-page.quiz-page .nav-toggle[aria-expanded="true"] span:last-child { transform: translateY(-6px) rotate(-45deg); }
.stage-solution-page .quiz-hero { min-height: 44.375rem; padding-block: var(--section-space); color: #fff; background: linear-gradient(90deg, #000000b3 0%, #03102dbf 48%, #03102d12 78%), url('../images/quiz/banner.png') right center/cover no-repeat, linear-gradient(135deg, #04132f, #092d68 56%, #064d83); }
.stage-solution-page .quiz-hero-inner { min-height: calc(44.375rem - var(--section-space) * 2); display: flex; align-items: center; }
.stage-solution-page .quiz-hero-copy { width: min(43rem, 62%); }
.stage-solution-page .quiz-hero h1 { font-size: var(--display-size); letter-spacing: -.025em; }
.stage-solution-page .quiz-hero h1 span { color: #51adff; }
.stage-solution-page .arrow-icon { filter: invert(31%) sepia(90%) saturate(4184%) hue-rotate(219deg) brightness(100%) contrast(103%); }
.stage-solution-page .quiz-hero-copy > .eyebrow { display: inline-flex; align-items: center; width: fit-content; max-width: 100%; margin-bottom: 1rem; padding: .25rem .75rem; border: 1px solid #64ccff66; border-radius: 999px; color: #dff5ff; background: #082b5ca8; letter-spacing: .04em; }
.stage-solution-page .hero-description { max-width: 38rem; margin-top: 1.25rem; color: #d5e3f7; font-size: 1rem; }
.stage-solution-page .hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.stage-solution-page .hero-actions .pill { gap: .5rem; }
.stage-solution-page .hero-actions .pill img { width: 1.25rem; height: 1.25rem; filter: brightness(0) invert(1); }
.stage-solution-page.quiz-page .hero-wechat { background: #08b96d; }
.stage-solution-page.quiz-page .hero-phone { border: 1px solid #ffffff66; background: #051b3bbf; }
.stage-solution-page.quiz-page .hero-quote { background: #ff8a1e; }
.stage-solution-page .mobile-label,.stage-solution-page  .mobile-consult-bar { display: none; }
.stage-solution-page .visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0 !important; margin: -1px !important; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0 !important; }
.stage-solution-page .quiz-section { padding-block: var(--section-space); scroll-margin-top: 3.5rem; }
.stage-solution-page .solutions-section { background: #fff; }
.stage-solution-page .solution-explorer { min-width: 0; margin: 0; padding: 0; border: 0; }
.stage-solution-page .solution-explorer legend { padding: 0; }
.stage-solution-page .solution-grid,.stage-solution-page  .feature-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--grid-gap); }
.stage-solution-page .feature-grid { list-style: none; margin: 0; padding: 0; }
.stage-solution-page .feature-grid > li { display: flex; min-width: 0; scroll-margin-top: 3.5rem; }
.stage-solution-page .feature-grid > .play-detail-slot { display: block; grid-column: 1 / -1; min-width: 0; }
.stage-solution-page .feature-grid > .play-detail-slot[hidden] { display: none; }
.stage-solution-page .solution-choice { position: relative; display: flex; flex-direction: column; min-width: 0; }
.stage-solution-page .solution-radio { position: absolute; top: 0; left: 0; width: 1px; height: 1px; margin: 0; opacity: 0; }
.stage-solution-page .solution-card { flex: 1; cursor: pointer; background: #fff; border: 1px solid var(--line); padding: .625rem; border-radius: 1rem; display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: .75rem; text-align: left; min-width: 0; box-shadow: 0 .5rem 1.5rem #263b6305; transition: border-color .2s, transform .2s, box-shadow .2s; }
.stage-solution-page .solution-card:hover { transform: translateY(-3px); box-shadow: 0 .75rem 2rem #263b6310; }
.stage-solution-page .solution-radio:checked + .solution-card { border-color: var(--blue); box-shadow: 0 0 0 1px var(--blue), 0 .75rem 2rem #1a5bff0b; background: #f7faff; }
.stage-solution-page .solution-radio:focus-visible + .solution-card { outline: 3px solid #8bb9ff; outline-offset: 4px; }
.stage-solution-page .solution-card > img { width: 100%; aspect-ratio: 1; object-fit: cover; align-self: start; border-radius: .625rem; }
.stage-solution-page .solution-body { min-width: 0; display: flex; flex-direction: column; padding: 0; }
.stage-solution-page .solution-title { display: block; margin-bottom: .375rem; font-size: 1.125rem; font-weight: 700; line-height: 1.3; }
.stage-solution-page .solution-radio:checked + .solution-card .solution-title { color: var(--blue); }
.stage-solution-page .solution-description { display: block; color: var(--muted); font-size: .8125rem; line-height: 1.55; margin-bottom: .5rem; }
.stage-solution-page .quiz-tags { display: flex; flex-wrap: wrap; gap: .375rem; }
.stage-solution-page .quiz-tags span { border-radius: .375rem; padding: .125rem .5rem; color: #3464ae; background: #edf4ff; font-size: .75rem; line-height: 1.75; }
.stage-solution-page .solution-body .quiz-tags { margin-top: auto; }
.stage-solution-page .solution-card .quiz-tags { gap: .25rem; }
.stage-solution-page .solution-card .quiz-tags span { padding: .0625rem .375rem; font-size: .6875rem; }
.stage-solution-page .selected-label { display: none; align-items: center; gap: .25rem; min-height: 1.25rem; margin-top: .5rem; color: #2359d9; font-size: .75rem; }
.stage-solution-page .selected-label img { width: 1rem; height: 1rem; filter: invert(31%) sepia(90%) saturate(4184%) hue-rotate(219deg) brightness(100%) contrast(103%); }
.stage-solution-page .solution-radio:checked + .solution-card .selected-label { display: flex; }
.stage-solution-page .mobile-selection-status { display: none; }
.stage-solution-page .recommendation { margin-top: 1rem; padding: 1.5rem; border: 1px solid #c8d9ff; border-radius: 1.25rem; background: #f7faff; scroll-margin-top: 1rem; }
.stage-solution-page .recommendation-summary > .eyebrow { margin-bottom: .375rem; }
.stage-solution-page .recommendation-heading { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.stage-solution-page .quiz-section-heading,.stage-solution-page  .play-detail-heading { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; margin-bottom: 2rem; }
.stage-solution-page .recommendation-heading > div { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; }
.stage-solution-page .recommendation-heading h3 { font-size: 1.5rem; }
.stage-solution-page #recommended-name { color: var(--blue); }
.stage-solution-page .recommendation-badge { font-size: .875rem; color: #416ba6; background: #edf4ff; border-radius: .5rem; padding: .375rem .75rem; }
.stage-solution-page .recommendation-next { flex-basis: 100%; color: var(--muted); font-size: .875rem; }
.stage-solution-page .recommendation-body { margin-top: 2rem; }
.stage-solution-page .recommendation.is-updating .recommendation-summary { animation: recommendation-summary-in .16s ease-out; }
@keyframes recommendation-summary-in { from { opacity: .55; transform: translateY(.25rem); } to { opacity: 1; transform: translateY(0); } }
.stage-solution-page.quiz-page .text-link { color: var(--blue); gap: .25rem; flex-shrink: 0; }
.stage-solution-page .arrow-icon { width: 1.25rem; height: 1.25rem; }
.stage-solution-page .recommendation-grid { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(0, 1fr); gap: var(--grid-gap); }
.stage-solution-page .solution-gallery,.stage-solution-page  .solution-details { min-width: 0; }
.stage-solution-page .main-preview,.stage-solution-page  .play-preview { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; padding: 0; background: #eaf1ff; border: 1px solid var(--line); border-radius: 1rem; overflow: hidden; aspect-ratio: 946/520; }
.stage-solution-page .main-preview > img,.stage-solution-page  .play-preview > img { width: 100%; height: 100%; object-fit: contain; }
.stage-solution-page .main-preview.photo > img,.stage-solution-page  .play-preview.photo > img { object-fit: cover; }
.stage-solution-page .main-preview.small-source > img,.stage-solution-page  .play-preview.small-source > img { width: auto; height: auto; max-width: 55%; max-height: 85%; }
.stage-solution-page .preview-zoom { position: absolute; bottom: .75rem; right: .75rem; display: inline-flex; gap: .375rem; align-items: center; color: #fff; background: #061d47b0; backdrop-filter: blur(6px); padding: .375rem .625rem; border-radius: .5rem; font-size: .75rem; }
.stage-solution-page .preview-zoom img { width: 1rem; filter: brightness(0) invert(1); }
.stage-solution-page .gallery-category-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .375rem; margin-top: 1rem; padding: .25rem; border: 1px solid #d9e4f7; border-radius: .75rem; background: #f3f6fb; }
.stage-solution-page .gallery-category-button { min-width: 0; min-height: 40px; border: 1px solid transparent; border-radius: .5rem; padding: .375rem .5rem; color: #60718c; background: transparent; font-size: .8125rem; line-height: 1.35; }
.stage-solution-page .gallery-category-button[aria-pressed="true"] { color: var(--blue); border-color: #c4d8ff; background: #fff; box-shadow: 0 .1875rem .5rem #385a9e1a; }
.stage-solution-page .thumbnail-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin-top: .75rem; }
.stage-solution-page .gallery-category-tabs[hidden] + .thumbnail-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.stage-solution-page .thumbnail-button { min-width: 0; min-height: 44px; padding: 0; background: none; }
.stage-solution-page .thumbnail-button img { width: 100%; aspect-ratio: 16/10; object-fit: cover; border: 2px solid transparent; border-radius: .5rem; }
.stage-solution-page .thumbnail-button[aria-pressed="true"] img { border-color: var(--blue); box-shadow: 0 0 0 2px #d9e6ff; }
.stage-solution-page .detail-heading { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-bottom: 1rem; }
.stage-solution-page .detail-heading > span { font-size: .875rem; color: var(--muted); }
.stage-solution-page .participation-steps { list-style: none; margin: 0; padding: 1.25rem .75rem; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .625rem; border: 1px solid var(--line); border-radius: .875rem; background: #fbfdff; }
.stage-solution-page .participation-steps li { position: relative; min-width: 0; text-align: center; }
.stage-solution-page .step-icon { display: flex; align-items: center; justify-content: center; background: #edf4ff; width: 2.5rem; height: 2.5rem; border-radius: .75rem; margin: 0 auto .75rem; }
.stage-solution-page .step-icon img { width: 1.25rem; height: 1.25rem; filter: invert(31%) sepia(90%) saturate(4184%) hue-rotate(219deg) brightness(100%) contrast(103%); }
.stage-solution-page .participation-steps strong { display: block; font-size: .875rem; line-height: 1.5; }
.stage-solution-page .participation-steps small { display: block; font-size: .75rem; line-height: 1.75; color: var(--muted); margin-top: .375rem; }
.stage-solution-page .facts-title { margin: 1.5rem 0 1rem; }
.stage-solution-page .solution-facts { margin: 0; border: 1px solid var(--line); border-radius: .875rem; padding: .25rem 1.25rem; }
.stage-solution-page .fact-row { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); gap: .75rem; padding-block: .625rem; font-size: .875rem; border-bottom: 1px solid #edf1f7; }
.stage-solution-page .fact-row:last-child { border-bottom: 0; }
.stage-solution-page .fact-row dt { color: #536178; display: flex; align-items: center; gap: .5rem; }
.stage-solution-page .fact-row dt img { width: 1rem; height: 1rem; filter: invert(31%) sepia(90%) saturate(4184%) hue-rotate(219deg) brightness(100%) contrast(103%); }
.stage-solution-page .fact-row dd { margin: 0; color: var(--muted); overflow-wrap: anywhere; }
.stage-solution-page .playways-section { padding-block: 4rem; background: #fff; }
.stage-solution-page .playways-section .section-top { margin-bottom: 1.25rem; }
.stage-solution-page .playway-filter-group { position: sticky; top: 4.5rem; z-index: 10; min-width: 0; margin: 0 0 1rem; padding: .5rem 0; border: 0; background: #fff; }
.stage-solution-page .playway-filters { display: flex; flex-wrap: wrap; gap: .625rem; }
.stage-solution-page .playway-filter-radio { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; }
.stage-solution-page .playway-filters label { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .5rem 1.125rem; border: 1px solid #cbd8ee; border-radius: 8rem; color: #52647e; background: #fff; cursor: pointer; font-size: .875rem; white-space: nowrap; }
.stage-solution-page .playway-filter-radio:checked + label { color: #fff; border-color: var(--blue); background: var(--blue); box-shadow: 0 3px 8px #1a5bff1a; }
.stage-solution-page .playway-filter-radio:focus-visible + label { outline: 3px solid #8bb9ff; outline-offset: 3px; }
.stage-solution-page .feature-card { display: grid; flex: 1; grid-template-columns: 2rem minmax(0, 1fr) auto; grid-template-areas: "icon title action" "icon description action" ". tags action"; align-content: start; column-gap: .75rem; row-gap: .25rem; min-width: 0; text-align: left; border: 1px solid var(--line); border-radius: 1rem; background: #fff; padding: 1rem; }
.stage-solution-page .feature-card:hover { border-color: #b6ceff; }
.stage-solution-page .feature-card[aria-expanded="true"] { border-color: #9cbdff; background: #fbfdff; box-shadow: 0 .5rem 1.5rem #1a5bff0b; }
.stage-solution-page .feature-icon { grid-area: icon; display: block; width: 2rem; height: 2rem; padding: .4375rem; border-radius: .625rem; background: #edf4ff; }
.stage-solution-page .feature-icon img { width: 100%; height: 100%; filter: invert(31%) sepia(90%) saturate(4184%) hue-rotate(219deg) brightness(100%) contrast(103%); }
.stage-solution-page .feature-card h3 { grid-area: title; align-self: center; margin: 0; font-size: 1.125rem; }
.stage-solution-page .feature-card p { grid-area: description; color: var(--muted); font-size: .8125rem; line-height: 1.55; margin: 0; }
.stage-solution-page .feature-card .quiz-tags { grid-area: tags; margin-top: .375rem; }
.stage-solution-page .feature-action { grid-area: action; display: inline-flex; align-items: center; align-self: center; gap: .125rem; color: var(--blue); font-size: .75rem; font-weight: 600; white-space: nowrap; }
.stage-solution-page .feature-action .arrow-icon { width: 1rem; height: 1rem; transition: transform .18s ease; }
.stage-solution-page .feature-action .arrow-icon[data-rotated="true"] { transform: rotate(180deg); }
.stage-solution-page .play-detail { width: 100%; padding: 1.5rem; background: #fff; border: 1px solid #c8d9ff; border-radius: 1.25rem; animation: play-detail-in .16s ease-out; }
.stage-solution-page .play-detail[hidden] { display: none; }
@keyframes play-detail-in { from { opacity: .55; transform: translateY(.25rem); } to { opacity: 1; transform: translateY(0); } }
.stage-solution-page .play-detail-heading { margin-bottom: 1.25rem; }
.stage-solution-page .play-detail-heading h3 { font-size: 1.375rem; margin-top: .25rem; }
.stage-solution-page .eyebrow { display: block; font-size: .75rem; color: var(--blue); font-weight: 500; }
.stage-solution-page .play-demo-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 1.5rem; }
.stage-solution-page .play-detail .play-preview { aspect-ratio: 2/1; }
.stage-solution-page .view-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin-top: .75rem; padding: .1875rem; border: 1px solid #d9e4f7; border-radius: .75rem; background: #f3f6fb; }
.stage-solution-page .view-tabs button { min-width: 0; min-height: 36px; height: 36px; border: 1px solid transparent; border-radius: .5rem; padding: .25rem .5rem; background: transparent; color: #60718c; font-size: .8125rem; white-space: nowrap; }
.stage-solution-page .view-tabs button[aria-pressed="true"] { color: var(--blue); border-color: #c4d8ff; background: #fff; box-shadow: 0 .1875rem .5rem #385a9e1a; }
.stage-solution-page .role-guide { display: grid; grid-template-columns: minmax(0, 1fr); gap: .5rem; align-content: space-between; }
.stage-solution-page .role-card { display: grid; grid-template-columns: 1.875rem minmax(0, 1fr); grid-template-areas: "icon title" "icon description"; column-gap: .5rem; row-gap: .125rem; min-width: 0; padding: .625rem; border: 1px solid #d9e5f7; border-radius: .75rem; background: linear-gradient(135deg, #f7faff, #fbfdff); }
.stage-solution-page .role-card:nth-child(2n) { background: linear-gradient(135deg, #f5fbff, #faffff); border-color: #d3e8f5; }
.stage-solution-page .role-icon { grid-area: icon; display: flex; align-items: center; justify-content: center; width: 1.875rem; height: 1.875rem; margin: 0; border-radius: .5rem; background: #e8f0ff; }
.stage-solution-page .role-icon img { width: 1rem; height: 1rem; filter: invert(31%) sepia(90%) saturate(4184%) hue-rotate(219deg) brightness(100%) contrast(103%); }
.stage-solution-page .role-guide h4 { grid-area: title; margin: 0; font-size: .8125rem; line-height: 1.4; font-weight: 700; }
.stage-solution-page .role-guide p { grid-area: description; color: var(--muted); font-size: .75rem; line-height: 1.45; overflow-wrap: anywhere; }
.stage-solution-page .effect-gallery,.stage-solution-page  .template-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .75rem; margin-top: 1rem; }
.stage-solution-page .effect-gallery { grid-template-columns: repeat(8, minmax(0, 1fr)); margin-top: .75rem; }
.stage-solution-page .effect-button { min-width: 0; min-height: 44px; padding: 0; background: none; }
.stage-solution-page .effect-button img { width: 100%; aspect-ratio: 16/10; object-fit: cover; border: 2px solid transparent; border-radius: .5rem; }
.stage-solution-page .effect-button[aria-pressed="true"] img { border-color: var(--blue); box-shadow: 0 0 0 2px #d9e6ff; }
.stage-solution-page .template-heading { margin-top: 1.5rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; }
.stage-solution-page .template-heading h3 { font-size: 1.125rem; }
.stage-solution-page .template-heading span { font-size: .8125rem; color: var(--muted); }
.stage-solution-page .template-card { min-width: 0; background: #f8faff; padding: .375rem; border: 1px solid var(--line); border-radius: .75rem; text-align: left; }
.stage-solution-page .template-card:hover { border-color: #aac7ff; }
.stage-solution-page .template-card img { width: 100%; aspect-ratio: 16/10; object-fit: contain; background: #edf3ff; border-radius: .5rem; }
.stage-solution-page .template-card span { display: block; font-size: .8125rem; padding: .5rem .125rem .25rem; }
.stage-solution-page .case-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--grid-gap); }
.stage-solution-page .case-card { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 1rem; overflow: hidden; min-width: 0; background: #fff; }
.stage-solution-page .case-image { display: flex; aspect-ratio: 16/9; overflow: hidden; background: #edf3ff; }
.stage-solution-page .case-image > img { width: 100%; height: 100%; object-fit: contain; }
.stage-solution-page .case-body { display: flex; flex-direction: column; flex: 1; padding: var(--card-padding); }
.stage-solution-page .case-kicker { margin-bottom: .5rem; color: var(--blue); font-size: .75rem; font-weight: 600; letter-spacing: .03em; }
.stage-solution-page .case-body h3 { margin-bottom: .625rem; }
.stage-solution-page .case-body p { font-size: .875rem; color: var(--muted); margin-bottom: 1rem; }
.stage-solution-page .case-facts { margin: auto 0 0; border-top: 1px solid #edf1f7; }
.stage-solution-page .case-fact-row { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: .625rem; padding-block: .5rem; border-bottom: 1px solid #edf1f7; font-size: .8125rem; line-height: 1.55; }
.stage-solution-page .case-fact-row dt { color: #52647e; }
.stage-solution-page .case-fact-row dd { margin: 0; color: var(--text); overflow-wrap: anywhere; }
.stage-solution-page .case-consult { min-height: 44px; margin-top: 1.25rem; border: 1px solid #b5ccff; color: var(--blue) !important; background: #fff; border-radius: 8rem; font-size: .875rem; }
.stage-solution-page .cases-section { padding-block: 48px 32px; overflow: hidden; background: #f5faff; }
.stage-solution-page .case-consult:hover { background: #f2f6ff; }
.stage-solution-page .faq-section { background: var(--soft); }
.stage-solution-page .faq-layout { display: grid; grid-template-columns: minmax(16rem, .72fr) minmax(0, 1.38fr); gap: clamp(3rem, 7vw, 6.5rem); align-items: start; }
.stage-solution-page .faq-intro { min-width: 0; padding-top: .25rem; }
.stage-solution-page .faq-intro .eyebrow { margin-bottom: 1rem; }
.stage-solution-page .faq-intro .description { max-width: 21rem; margin-top: 1.25rem; }
.stage-solution-page .faq-intro .text-link { margin-top: 1.5rem; }
.stage-solution-page .faq-list { min-width: 0; }
.stage-solution-page .faq-grid { display: block; }
.stage-solution-page .faq-grid details { width: 100%; min-width: 0; border-bottom: 1px solid var(--line); background: transparent; }
.stage-solution-page .faq-list > .faq-grid:first-child details:first-child { border-top: 1px solid var(--line); }
.stage-solution-page .faq-grid summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; cursor: pointer; min-height: 76px; padding: 1rem 0; font-size: 1rem; list-style: none; }
.stage-solution-page .faq-grid summary::-webkit-details-marker { display: none; }
.stage-solution-page .faq-grid summary:focus-visible { outline: 3px solid #8bb9ff; outline-offset: 4px; border-radius: .375rem; }
.stage-solution-page .faq-question { display: flex; align-items: center; gap: 1rem; min-width: 0; font-weight: 600; line-height: 1.5; }
.stage-solution-page .faq-question-icon { display: flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; flex: 0 0 2.5rem; border-radius: .625rem; background: #edf4ff; }
.stage-solution-page .faq-question-icon img { width: 1.25rem; height: 1.25rem; filter: invert(31%) sepia(90%) saturate(4184%) hue-rotate(219deg) brightness(100%) contrast(103%); }
.stage-solution-page .faq-toggle-icon { width: 1.25rem; height: 1.25rem; flex-shrink: 0; opacity: .55; transition: transform .2s; }
.stage-solution-page .faq-grid details[open] summary .faq-toggle-icon { transform: rotate(180deg); }
.stage-solution-page .faq-grid details[open] .faq-question { color: var(--blue); }
.stage-solution-page .faq-grid details > p { padding: 0 3rem 1.5rem 3.5rem; font-size: .875rem; color: var(--muted); }
.stage-solution-page .extra-faq { margin: 0; }
.stage-solution-page .mobile-break { display: none; }
.stage-solution-page .quiz-lead { padding-block: var(--section-space); scroll-margin-top: 4.5rem; color: #fff; background: linear-gradient(rgba(3, 17, 43, .84), rgba(3, 17, 43, .84)), url('../images/background-cta.png') center/cover no-repeat, #041a3d; }
.stage-solution-page .quiz-lead-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(32rem, .92fr); gap: 4rem; align-items: center; }
.stage-solution-page .lead-copy { min-width: 0; }
.stage-solution-page .lead-form-anchor { min-width: 0; scroll-margin-top: 5.5rem; }
.stage-solution-page .lead-kicker { display: inline-flex; align-items: center; min-height: 2rem; padding: .25rem .75rem; border: 1px solid #36adff55; border-radius: 999px; color: #69c6ff; background: #0875c426; font-size: .8125rem; font-weight: 600; }
.stage-solution-page .lead-copy h2 { margin-top: 1.25rem; color: #fff; font-size: 2.5rem; line-height: 1.28; }
.stage-solution-page .lead-copy h2 span { color: #ff8a1e; }
.stage-solution-page .lead-copy > p { margin-top: 1.25rem; color: #b9cbe5; }
.stage-solution-page .lead-benefits { display: grid; gap: 1rem; margin: 2rem 0 0; padding: 0; list-style: none; }
.stage-solution-page .lead-benefits li { display: flex; align-items: center; gap: .875rem; color: #d8e6f8; }
.stage-solution-page .lead-benefits li > span { display: block; flex: 1; min-width: 0; font-size: 14px; line-height: 1.6; color: #d8e6f8; overflow-wrap: anywhere; }
.stage-solution-page .lead-benefits li > img { flex-shrink: 0; }
.stage-solution-page .lead-benefits img { width: 2.5rem; height: 2.5rem; padding: .625rem; border: 1px solid #28a7ff55; border-radius: .75rem; background: #0b6fb52e; filter: brightness(0) invert(1); }
.stage-solution-page .lead-contact-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: 2rem; }
.stage-solution-page.quiz-page .lead-wechat { min-height: 2.75rem; padding-inline: 1.25rem; background: #08ad68; font-size: .875rem; }
.stage-solution-page .lead-wechat img,.stage-solution-page  .lead-phone img { width: 1.125rem; height: 1.125rem; filter: brightness(0) invert(1); }
.stage-solution-page .lead-phone { display: flex; align-items: center; gap: .5rem; min-height: 44px; color: #fff; }
.stage-solution-page .lead-phone strong { font-size: 1.125rem; }
.stage-solution-page .lead-phone span { color: #9cb4d4; font-size: .75rem; }
.stage-solution-page .lead-form { min-width: 0; padding: 2.25rem; border-radius: 1.5rem; color: var(--ink); background: #fff; box-shadow: 0 1.5rem 4rem #00102e40; }
.stage-solution-page .lead-form-title h3 { font-size: 1.5rem; }
.stage-solution-page .lead-form-title p { margin-top: .375rem; color: var(--muted); font-size: .8125rem; }
.stage-solution-page .lead-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1.5rem; }
.stage-solution-page .lead-field { display: grid; gap: .375rem; min-width: 0; color: #35435b; font-size: .8125rem; font-weight: 600; }
.stage-solution-page .lead-field > span:first-child strong { color: #e84b4b; }
.stage-solution-page .lead-field small { color: #8490a4; font-size: inherit; font-weight: 400; }
.stage-solution-page .lead-field-full,.stage-solution-page  .optional-fields { grid-column: 1 / -1; }
.stage-solution-page .lead-field input,.stage-solution-page  .lead-field select,.stage-solution-page  .lead-field textarea { width: 100%; min-width: 0; border: 1px solid #dce4ef; border-radius: .5rem; color: #21304a; background: #fff; font: inherit; font-size: .9375rem; font-weight: 400; outline: 0; transition: border-color .18s, box-shadow .18s; }
.stage-solution-page .lead-field input,.stage-solution-page  .lead-field select { min-height: 2.75rem; padding: .5rem .75rem; }
.stage-solution-page .lead-field textarea { min-height: 4rem; padding: .625rem .75rem; resize: vertical; line-height: 1.5; }
.stage-solution-page .lead-field input:focus,.stage-solution-page  .lead-field select:focus,.stage-solution-page  .lead-field textarea:focus { border-color: #2788ff; box-shadow: 0 0 0 3px #2788ff20; }
.stage-solution-page .optional-fields { border-top: 1px solid #e9edf4; border-bottom: 1px solid #e9edf4; padding-block: .75rem; }
.stage-solution-page .optional-fields summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 44px; color: #52627c; cursor: pointer; font-size: .8125rem; font-weight: 600; list-style: none; }
.stage-solution-page .optional-fields summary::-webkit-details-marker { display: none; }
.stage-solution-page .optional-fields summary::after { content: '+'; color: #1686ff; font-size: 1.25rem; line-height: 1; }
.stage-solution-page .optional-fields[open] summary::after { content: '−'; }
.stage-solution-page .optional-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; padding-top: 1rem; }
.stage-solution-page .input-unit { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.stage-solution-page .input-unit input { grid-column: 1 / -1; grid-row: 1; padding-right: 2.5rem; }
.stage-solution-page .input-unit > span { z-index: 1; grid-column: 2; grid-row: 1; padding-right: .75rem; color: #8490a4; font-size: .8125rem; font-weight: 400; }
.stage-solution-page .lead-consent { display: flex; align-items: flex-start; gap: .5rem; margin-top: 1rem; color: #66748a; font-size: .8125rem; }
.stage-solution-page .lead-consent input { width: 1rem; height: 1rem; margin: .2rem 0 0; accent-color: #1686ff; flex-shrink: 0; }
.stage-solution-page .lead-consent button { min-height: 24px; padding: 0; color: #1677dc; background: none; font: inherit; }
.stage-solution-page .lead-submit { width: 100%; margin-top: 1rem; border-radius: .5rem; background: #ff8a1e; box-shadow: 0 .75rem 1.5rem #ff8a1e35; font-weight: 600; }
.stage-solution-page .lead-submit:disabled { cursor: wait; opacity: .72; }
.stage-solution-page .form-status { min-height: 1.5rem; margin-top: .625rem; font-size: .8125rem; text-align: center; }
.stage-solution-page .form-status.success { color: #087b4c; }
.stage-solution-page .form-status.error { color: #c73c3c; }
.stage-solution-page .form-tip { display: flex; align-items: center; justify-content: center; gap: .375rem; margin-top: .25rem; color: #a0a9b9; font-size: .75rem; }
.stage-solution-page .form-tip img { width: .875rem; height: .875rem; opacity: .55; }
.stage-solution-page.quiz-page .pill.green { background: #07824b; }
.stage-solution-page .quiz-footer { background: #020527; color: #a0a9c4; }
.stage-solution-page .quiz-footer-main { display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; padding-block: 3rem; }
.stage-solution-page .quiz-footer-main > div { max-width: 32rem; }
.stage-solution-page .quiz-footer .brand { display: block; }
.stage-solution-page .quiz-footer-main p { font-size: .875rem; margin-top: 1rem; }
.stage-solution-page .quiz-footer nav { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; }
.stage-solution-page .quiz-footer nav a,.stage-solution-page  .quiz-footer nav button { min-height: 44px; display: inline-flex; align-items: center; background: none; padding: 0; font-size: .875rem; color: #a0a9c4; }
.stage-solution-page .quiz-footer nav a:hover,.stage-solution-page  .quiz-footer nav button:hover { color: #fff; }
.stage-solution-page .quiz-footer-bottom { border-top: 1px solid #ffffff17; padding-block: 1.5rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; font-size: .75rem; }
.stage-solution-page.quiz-page dialog h2 { margin-top: .75rem; }
.stage-solution-page.quiz-page dialog .dialog-close { position: sticky; top: 0; z-index: 2; box-shadow: 0 2px 12px #23334d12; }
.stage-solution-page.quiz-page dialog .eyebrow { min-height: 44px; display: flex; align-items: center; }
.stage-solution-page.quiz-page .image-dialog { width: 65rem; }
.stage-solution-page .image-dialog > img { width: 100%; object-fit: contain; border-radius: .75rem; max-height: 70dvh; background: #edf4ff; }
.stage-solution-page .image-dialog.small-source > img { width: auto; max-width: 100%; max-height: 65dvh; margin-inline: auto; }
.stage-solution-page .privacy-dialog { width: 32rem; }
.stage-solution-page .privacy-dialog .pill { margin-top: 1.5rem; }
.stage-solution-page #template-gallery-dialog { width: min(52rem, calc(100vw - 2rem)); height: min(36rem, calc(100dvh - 2rem)); overflow: auto; }
.stage-solution-page .template-gallery-categories { display: flex; gap: .375rem; margin: 0 0 .75rem; padding: .1875rem; border: 1px solid #d9e4f7; border-radius: .75rem; background: #f3f6fb; }
.stage-solution-page .template-gallery-categories button { flex: 1; min-width: 0; min-height: 36px; border: 1px solid transparent; border-radius: .5rem; padding: .25rem .5rem; background: transparent; color: #60718c; font-size: .8125rem; white-space: nowrap; }
.stage-solution-page .template-gallery-categories button[aria-pressed="true"] { color: var(--blue); border-color: #c4d8ff; background: #fff; box-shadow: 0 .1875rem .5rem #385a9e1a; }
.stage-solution-page .template-gallery-main { display: grid; margin: .75rem 0; padding: .625rem; border: 1px solid #dce7f8; border-radius: .875rem; background: #f8fbff; }
.stage-solution-page .template-gallery-main img { display: block; width: 100%; max-height: min(40dvh, 28rem); object-fit: contain; border-radius: .5rem; background: #edf3ff; }
.stage-solution-page .template-gallery-thumbnails { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: .5rem; }
.stage-solution-page .template-gallery-thumbnails button { min-width: 0; padding: .25rem; border: 1px solid var(--line); border-radius: .625rem; background: #fff; }
.stage-solution-page .template-gallery-thumbnails button[aria-pressed="true"] { border-color: #8eb4ff; box-shadow: 0 0 0 2px #d9e6ff; }
.stage-solution-page .template-gallery-thumbnails img { display: block; width: 100%; aspect-ratio: 16/10; object-fit: contain; border-radius: .375rem; background: #edf3ff; }
@media (max-width: 1199px) {
  .stage-solution-page.quiz-page .header-phone, .stage-solution-page.quiz-page .header-cta { display: none; }
  .stage-solution-page.quiz-page .nav-toggle { display: grid; }
  .stage-solution-page.quiz-page .header nav { position: fixed; top: 4.5rem; left: 0; right: 0; z-index: 999; grid-template-columns: minmax(0, 1fr); gap: 0; margin: 0; padding: 0 2.5rem; max-height: calc(100dvh - 4.5rem); overflow-y: auto; background: #fff; box-shadow: 0 1rem 1.5rem #16346712; }
  .stage-solution-page.quiz-page .header nav a { justify-content: flex-start; min-height: 48px; border-bottom: 1px solid var(--line); }
  .stage-solution-page.quiz-page .header nav a:last-child { border-bottom: 0; }
  .stage-solution-page .quiz-hero-copy { max-width: 44rem; }
  .stage-solution-page .solution-grid,.stage-solution-page  .feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stage-solution-page .solution-card { grid-template-columns: 5.5rem minmax(0, 1fr); padding: .6875rem; }
  .stage-solution-page .recommendation-grid { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .stage-solution-page .solution-gallery { max-width: 48rem; width: 100%; margin-inline: auto; }
  .stage-solution-page .solution-details { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 1.5rem; }
  .stage-solution-page .detail-heading { grid-column: 1; }
  .stage-solution-page .participation-steps { grid-column: 1; grid-row: 2; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: 1.5rem; }
  .stage-solution-page .facts-title { grid-column: 2; grid-row: 1; margin: 0 0 1rem; }
  .stage-solution-page .solution-facts { grid-column: 2; grid-row: 2; }
  .stage-solution-page .fact-row { grid-template-columns: 5.75rem minmax(0, 1fr); padding-block: .75rem; }
  .stage-solution-page .play-demo-grid { grid-template-columns: minmax(0, 1fr); }
  .stage-solution-page .role-guide { grid-template-columns: minmax(0, 1fr); }
  .stage-solution-page .template-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .stage-solution-page .effect-gallery { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .stage-solution-page .playways-section { padding-block: 3.5rem; }
  .stage-solution-page .case-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stage-solution-page .quiz-lead-inner { gap: 2rem; }
  .stage-solution-page .quiz-footer-main { flex-direction: column; }
}
@media (max-width: 899px) {
  .stage-solution-page .quiz-lead-inner { grid-template-columns: minmax(0, 1fr); gap: 2.5rem; }
  .stage-solution-page .lead-form-anchor { scroll-margin-top: 5.5rem; }
}
@media (max-width: 767px) {
  .stage-solution-page.quiz-page { padding-bottom: calc(5rem + env(safe-area-inset-bottom)); }
  .stage-solution-page.quiz-page .header { height: 3.75rem; }
  .stage-solution-page.quiz-page .header .brand { width: 9.0625rem; }
  .stage-solution-page.quiz-page .header nav { top: 3.75rem; padding-inline: 1.25rem; max-height: calc(100dvh - 3.75rem); }
  .stage-solution-page .quiz-section { scroll-margin-top: 2.75rem; }
  .stage-solution-page .desktop-label { display: none; }
  .stage-solution-page .mobile-label { display: inline; }
  .stage-solution-page .quiz-hero { min-height: 43rem; padding-block: 2rem 4rem; background-position: 0 0, 62% center, 0 0; }
  .stage-solution-page .quiz-hero-inner { min-height: 37rem; }
  .stage-solution-page .quiz-hero-copy { width: 100%; max-width: none; }
  .stage-solution-page .quiz-hero h1 { letter-spacing: -.03em; text-wrap: wrap; }
  .stage-solution-page .quiz-hero h1 span { display: inline-block; }
  .stage-solution-page .hero-description { color: #e0eafb; }
  .stage-solution-page .hero-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stage-solution-page .hero-actions .pill { width: 100%; }
  .stage-solution-page .hero-actions .pill { min-height: 2.75rem; padding-inline: .5rem; font-size: .875rem; }
  .stage-solution-page .hero-actions .hero-quote { grid-column: 1 / -1; }
  .stage-solution-page .mobile-consult-bar { position: fixed; z-index: 20; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; padding: .625rem .75rem calc(.625rem + env(safe-area-inset-bottom)); background: #ffffffed; border-top: 1px solid var(--line); box-shadow: 0 -.25rem 1rem #17264108; backdrop-filter: blur(12px); }
  .stage-solution-page .mobile-consult-bar .pill { min-width: 0; min-height: 2.75rem; gap: .25rem; padding-inline: .25rem; border-radius: .625rem; font-size: .8125rem; }
  .stage-solution-page .mobile-consult-bar img { width: 1.25rem; height: 1.25rem; filter: brightness(0) invert(1); }
  .stage-solution-page.quiz-page .mobile-wechat { background: #08ad68; }
  .stage-solution-page.quiz-page .mobile-phone { background: #176fe6; }
  .stage-solution-page.quiz-page .mobile-quote { background: #ff8a1e; }
  .stage-solution-page.quiz-page:has(dialog[open]) .mobile-consult-bar { display: none; }
  .stage-solution-page .feature-grid,.stage-solution-page  .case-grid { grid-template-columns: minmax(0, 1fr); }
  .stage-solution-page .solution-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; }
  .stage-solution-page .feature-grid > li { scroll-margin-top: 2.75rem; }
  .stage-solution-page .solution-card { display: flex; flex-direction: column; align-items: center; gap: .375rem; padding: .375rem; border-radius: .75rem; }
  .stage-solution-page .solution-card > img { width: 100%; aspect-ratio: 1; align-self: auto; border-radius: .5rem; }
  .stage-solution-page .solution-body { width: 100%; padding: 0; text-align: center; }
  .stage-solution-page .solution-title { margin: 0; font-size: .75rem; line-height: 1.3; }
  .stage-solution-page .solution-description,.stage-solution-page  .solution-card .quiz-tags,.stage-solution-page  .selected-label { display: none !important; }
  .stage-solution-page .desktop-selection-status { display: none; }
  .stage-solution-page .mobile-selection-status { display: none; }
  .stage-solution-page .solution-choice { scroll-margin-top: 4.5rem; }
  .stage-solution-page .recommendation { padding: 1rem; border-radius: 1rem; }
  .stage-solution-page .recommendation-heading,.stage-solution-page  .quiz-section-heading { align-items: flex-start; flex-direction: column; gap: .75rem; }
  .stage-solution-page .recommendation-heading > div { width: 100%; }
  .stage-solution-page .recommendation-heading h3 { font-size: 1.25rem; }
  .stage-solution-page .recommendation-badge { font-size: .875rem; }
  .stage-solution-page .recommendation-next { margin-top: -.125rem; }
  .stage-solution-page .recommendation-body { margin-top: 1.25rem; }
  .stage-solution-page .gallery-category-tabs { gap: .25rem; }
  .stage-solution-page .gallery-category-button { min-height: 36px; padding-inline: .25rem; font-size: .75rem; }
  .stage-solution-page .thumbnail-grid { gap: .5rem; }
  .stage-solution-page .solution-details { display: block; }
  .stage-solution-page .participation-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
  .stage-solution-page .facts-title { margin: 1.5rem 0 1rem; }
  .stage-solution-page .solution-facts { padding-inline: 1rem; }
  .stage-solution-page .fact-row { grid-template-columns: 5.75rem minmax(0, 1fr); gap: .5rem; }
  .stage-solution-page .playway-filter-group { top: 3.75rem; }
  .stage-solution-page .playway-filters { flex-wrap: nowrap; overflow-x: auto; margin-inline: -1.25rem; padding-inline: 1.25rem; padding-bottom: .25rem; scrollbar-width: none; }
  .stage-solution-page .playway-filters::-webkit-scrollbar { display: none; }
  .stage-solution-page .playways-section { padding-block: 2.5rem; }
  .stage-solution-page .feature-card { padding: 1rem; }
  .stage-solution-page .play-detail { padding: 1rem; }
  .stage-solution-page .play-detail-heading { align-items: flex-start; gap: .75rem; }
  .stage-solution-page .play-detail-heading h3 { font-size: 1.25rem; }
  .stage-solution-page .play-demo-grid { gap: 1rem; }
  .stage-solution-page .view-tabs button { padding-inline: .25rem; }
  .stage-solution-page .role-guide { grid-template-columns: minmax(0, 1fr); gap: .5rem; }
  .stage-solution-page .effect-gallery { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .5rem; }
  .stage-solution-page .template-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
  .stage-solution-page .template-heading { margin-top: 1.25rem; }
  .stage-solution-page .case-body { padding: 1.25rem 1rem; }
  .stage-solution-page .faq-layout { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .stage-solution-page .faq-intro { padding-top: 0; }
  .stage-solution-page .faq-intro .eyebrow { margin-bottom: .75rem; }
  .stage-solution-page .faq-intro .description { margin-top: .75rem; }
  .stage-solution-page .faq-intro .text-link { margin-top: 1rem; }
  .stage-solution-page .faq-grid summary { min-height: 64px; padding-block: .875rem; gap: .75rem; }
  .stage-solution-page .faq-question { gap: .75rem; }
  .stage-solution-page .faq-question-icon { width: 2.25rem; height: 2.25rem; flex-basis: 2.25rem; }
  .stage-solution-page .faq-grid details > p { padding: 0 2rem 1.25rem 3rem; }
  .stage-solution-page .mobile-break { display: block; }
  .stage-solution-page .quiz-lead { padding-block: 3rem; }
  .stage-solution-page .lead-form-anchor { scroll-margin-top: 4.5rem; }
  .stage-solution-page .lead-copy h2 { font-size: 2rem; }
  .stage-solution-page .lead-contact-actions { align-items: flex-start; flex-direction: column; }
  .stage-solution-page .lead-form { padding: 1.25rem; border-radius: 1rem; }
  .stage-solution-page .lead-form-title h3 { font-size: 1.25rem; }
  .stage-solution-page .lead-form-grid,.stage-solution-page  .optional-grid { grid-template-columns: minmax(0, 1fr); }
  .stage-solution-page .lead-field-full,.stage-solution-page  .optional-fields { grid-column: auto; }
  .stage-solution-page .quiz-footer nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem 1rem; }
  .stage-solution-page .quiz-footer-main { padding-block: 2.5rem; }
  .stage-solution-page #template-gallery-dialog { width: calc(100vw - 2rem); height: calc(100dvh - 1rem); padding: 1rem; }
  .stage-solution-page .template-gallery-main { max-height: none; overflow: visible; }
  .stage-solution-page .template-gallery-main img { max-height: 30dvh; }
  .stage-solution-page .template-gallery-thumbnails { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 359px) {
  .stage-solution-page.quiz-page .header-inner { gap: .375rem; }
  .stage-solution-page.quiz-page .header-actions { gap: .375rem; }
  .stage-solution-page.quiz-page .header-actions .pill { padding-inline: .5rem; }
  .stage-solution-page.quiz-page .nav-toggle { padding-inline: .5rem; }
  .stage-solution-page .solution-card { grid-template-columns: 4.5rem minmax(0, 1fr); gap: .625rem; }
  .stage-solution-page .role-guide { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .stage-solution-page .recommendation.is-updating .recommendation-summary,.stage-solution-page  .play-detail { animation: none; }
}

/* The gallery keeps its header visible while its content scrolls. */
.stage-solution-page #template-gallery-dialog {
  width: min(760px, calc(100vw - 32px));
  max-width: calc(100vw - 32px);
  height: fit-content;
  max-height: calc(100dvh - 32px);
  padding: 16px;
  border-radius: 8px;
  overflow: hidden;
}
.stage-solution-page #template-gallery-dialog[open] { display: flex; flex-direction: column; gap: 12px; }
.stage-solution-page .template-gallery-header { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.stage-solution-page #template-gallery-name { flex: 1; min-width: 0; margin: 0; font-size: 18px; line-height: 1.4; overflow-wrap: anywhere; max-height: 5.6em; overflow: auto; }
.stage-solution-page .template-gallery-close { display: grid; place-items: center; flex: 0 0 36px; width: 36px; height: 36px; padding: 0; border-radius: 4px; background: #f1f4f8; font-size: 28px; line-height: 1; }
.stage-solution-page .template-gallery-close:hover { background: #e5ebf3; }
.stage-solution-page .template-gallery-body { display: flex; flex-direction: column; gap: 12px; min-height: 0; overflow: auto; overscroll-behavior: contain; }
.stage-solution-page #template-gallery-dialog .template-gallery-main { display: block; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; }
.stage-solution-page #template-gallery-media { display: grid; place-items: center; position: relative; height: min(46dvh, 360px); background: #f5f7fa; }
.stage-solution-page #template-gallery-media img { width: 100%; height: 100%; max-height: 100%; min-height: 0; object-fit: contain; border-radius: 0; background: transparent; }
.stage-solution-page #template-gallery-dialog .template-gallery-categories { margin: 0; flex-wrap: wrap; }
.stage-solution-page #template-gallery-dialog .template-gallery-thumbnails { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 6px; }
.stage-solution-page #template-gallery-dialog .template-gallery-thumbnails button { flex: 0 0 72px; width: 72px; height: 52px; padding: 3px; border-radius: 4px; }
.stage-solution-page #template-gallery-dialog .template-gallery-thumbnails img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: contain; }
@media (max-width: 767px) {
  .stage-solution-page #template-gallery-dialog { width: calc(100vw - 24px); max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px); }
  .stage-solution-page #template-gallery-media { height: min(40dvh, 300px); }
}

.stage-solution-page .template-gallery-body > * { flex: 0 0 auto; min-width: 0; }



.stage-solution-page .cases-section { overflow: hidden; background: #f5f9ff; }
.stage-solution-page .case-section-heading { margin-bottom: 30px; }
.stage-solution-page .case-section-heading > div { max-width: 880px; }
.stage-solution-page .case-kicker { display: block; margin-bottom: 10px; color: #889ff0; font-size: 13px; font-weight: 700; letter-spacing: 0; }
.stage-solution-page .case-section-heading h2 { margin: 0; color: #0b142b; font-size: 40px; font-weight: 800; line-height: 1.2; }
.stage-solution-page .case-highlight { margin: 8px 0 12px; color: #0b142b; font-size: 34px; font-weight: 800; line-height: 1.35; }
.stage-solution-page .case-highlight > span { color: var(--blue); }
.stage-solution-page .case-section-heading .description { max-width: 780px; margin: 0; color: #7888a6; font-size: 16px; line-height: 1.65; }
.stage-solution-page .case-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.stage-solution-page .case-filter-list { display: flex; min-width: 0; gap: 10px; overflow-x: auto; padding: 2px 0; scrollbar-width: none; }
.stage-solution-page .case-filter-list::-webkit-scrollbar { display: none; }
.stage-solution-page .case-filter-list button { min-width: 122px; height: 46px; flex: 0 0 auto; padding: 0 26px; border: 1px solid transparent; border-radius: 999px; background: #eaf3ff; color: #435573; font-size: 14px; font-weight: 700; }
.stage-solution-page .case-filter-list button:hover { border-color: #c8d8f4; color: var(--blue); background: #f4f7fd; }
.stage-solution-page .case-filter-list button.is-active { border-color: var(--blue); background: var(--blue); color: #fff; }
.stage-solution-page .case-pagination { display: flex; align-items: center; flex: 0 0 auto; gap: 16px; color: #8495b2; font-size: 14px; white-space: nowrap; }
.stage-solution-page .case-pagination span { margin-right: 10px; }
.stage-solution-page .case-pagination button { display: grid; place-items: center; width: 46px; height: 46px; padding: 11px; border: 1px solid #deebfc; border-radius: 50%; background: #edf5ff; }
.stage-solution-page .case-pagination button:hover:not(:disabled), .stage-solution-page .case-pagination [data-case-page="next"]:not(:disabled) { border-color: var(--blue); background: var(--blue); }
.stage-solution-page .case-pagination button:hover:not(:disabled) img, .stage-solution-page .case-pagination [data-case-page="next"]:not(:disabled) img { filter: brightness(0) invert(1); }
.stage-solution-page .case-pagination button:disabled { opacity: .35; cursor: default; }
.stage-solution-page .case-pagination [data-case-page="prev"] img { transform: rotate(180deg); opacity: .55; }
.stage-solution-page .case-pagination button img { width: 22px; height: 22px; }
.stage-solution-page .case-showcase-grid { display: grid; height: 324px; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: 324px; gap: 20px; }
.stage-solution-page .case-showcase-card { display: grid; height: 324px; grid-template-rows: 144px minmax(0, 1fr); min-width: 0; overflow: hidden; border: 1px solid #e8f0fa; border-radius: 8px; background: #fff; box-shadow: 0 6px 22px #315c9710; }
.stage-solution-page .case-card-media { position: relative; min-width: 0; overflow: hidden; background: #dfe9f8; }
.stage-solution-page .case-card-image { display: block; width: 100%; height: 100%; object-fit: cover; }
.stage-solution-page .case-card-placeholder { display: grid; width: 100%; height: 100%; place-items: center; align-content: center; gap: 8px; color: #6f83a6; background: linear-gradient(135deg, #e7effa, #dbe9fb); font-size: 13px; font-weight: 700; }
.stage-solution-page .case-card-placeholder img { width: 34px; height: 34px; opacity: .65; }
.stage-solution-page .case-card-tags { position: absolute; top: 14px; left: 16px; display: flex; max-width: calc(100% - 32px); gap: 6px; overflow: hidden; }
.stage-solution-page .case-card-tags span { display: block; max-width: 170px; flex-shrink: 1; height: 34px; padding: 0 16px; border-radius: 999px; background: var(--blue); color: #fff; font-size: 14px; font-weight: 700; line-height: 34px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-shadow: 0 3px 10px #09286a1a; }
.stage-solution-page .case-card-content { display: flex; min-height: 0; flex-direction: column; overflow: hidden; padding: 12px 16px; }
.stage-solution-page .case-card-content > * { flex-shrink: 0; }
.stage-solution-page .case-card-content h3 { display: -webkit-box; height: 46px; min-width: 0; margin: 0 0 8px; color: #10172e; font-size: 17px; font-weight: 700; line-height: 23px; overflow: hidden; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.stage-solution-page .case-facts { display: grid; gap: 4px; min-height: 0; margin: 0; border: 0; }
.stage-solution-page .case-fact { display: flex; align-items: center; min-width: 0; gap: 6px; color: #7a88a3; font-size: 13px; line-height: 20px; }
.stage-solution-page .case-fact-icon { display: grid; width: 20px; height: 20px; flex: 0 0 20px; place-items: center; border-radius: 50%; color: var(--blue); background: #eaf3ff; }
.stage-solution-page .case-fact-icon i { font-size: 14px; line-height: 1; }
.stage-solution-page .case-fact-copy { display: flex; min-width: 0; align-items: baseline; gap: 4px; }
.stage-solution-page .case-fact small { flex: 0 0 auto; color: #7a88a3; font-size: 13px; }
.stage-solution-page .case-fact small::after { content: "："; }
.stage-solution-page .case-fact strong { min-width: 0; color: #7a88a3; font-size: 13px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stage-solution-page .case-participant-count { font-size: inherit; font-weight: inherit; }
.stage-solution-page .case-fact-values { display: none; }
.stage-solution-page .case-fact-values > span > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.stage-solution-page .case-card-content a { display: flex; align-items: center; justify-content: flex-start; gap: 10px; min-height: 26px; margin-top: auto; color: var(--blue); font-size: 13px; font-weight: 700; line-height: 20px; }
.stage-solution-page .case-card-content a i, .stage-solution-page .case-more-link i { flex: 0 0 20px; font-size: 20px; font-weight: 400; line-height: 1; }
.stage-solution-page .case-card-content a:hover span { text-decoration: underline; text-underline-offset: 3px; }
.stage-solution-page .case-showcase-grid.is-updating .case-showcase-card { animation: caseShowcaseIn .2s ease both; }
.stage-solution-page .case-showcase-grid.is-updating .case-showcase-card:nth-child(2) { animation-delay: .03s; }
.stage-solution-page .case-showcase-grid.is-updating .case-showcase-card:nth-child(3) { animation-delay: .06s; }
.stage-solution-page .case-showcase-grid.is-updating .case-showcase-card:nth-child(4) { animation-delay: .09s; }
.stage-solution-page .case-showcase-grid.is-updating .case-showcase-card:nth-child(5) { animation-delay: .12s; }
@keyframes caseShowcaseIn { from { opacity: .4; } to { opacity: 1; } }
.stage-solution-page .case-more-link { display: flex; align-items: center; justify-content: center; gap: 12px; width: fit-content; min-height: 42px; margin: 22px auto 0; padding: 0 26px; border: 1px solid var(--blue); border-radius: 999px; color: var(--blue); font-size: 14px; font-weight: 700; }
.stage-solution-page .case-more-link:hover { background: var(--blue); color: #fff; }
.stage-solution-page .case-more-link .arrow-icon { width: 17px; height: 17px; margin-left: 8px; }
@media (max-width: 1199px) and (min-width: 1024px) {
  .stage-solution-page .case-card-content { padding-inline: 12px; }
  .stage-solution-page .case-card-content a { font-size: 12px; gap: 4px; }
}
@media (max-width: 1023px) {
  .stage-solution-page .case-toolbar { align-items: flex-start; flex-direction: column; gap: 12px; }
  .stage-solution-page .case-filter-list { width: 100%; }
  .stage-solution-page .case-pagination { align-self: flex-end; }
  .stage-solution-page .case-showcase-grid { display: grid; height: 410px; grid-template-columns: minmax(0, 1fr); grid-template-rows: 410px; overflow: hidden; }
  .stage-solution-page .case-showcase-card:nth-child(n+2) { display: none; }
  .stage-solution-page .case-showcase-grid::-webkit-scrollbar { display: none; }
  .stage-solution-page .case-showcase-card { height: 410px; grid-row: auto; grid-template-rows: 170px minmax(0, 1fr); scroll-snap-align: start; }
}
@media (max-width: 767px) {
  .stage-solution-page .case-section-heading { margin-bottom: 20px; }
  .stage-solution-page .cases-section { padding-block: 32px; }
  .stage-solution-page .case-kicker { font-size: 11px; }
  .stage-solution-page .case-section-heading h2 { font-size: 30px; }
  .stage-solution-page .case-highlight { font-size: 22px; }
  .stage-solution-page .case-section-heading .description { font-size: 14px; }
  .stage-solution-page .case-filter-list button { min-width: 106px; min-height: 0; height: 40px; padding-inline: 20px; font-size: 13px; }
  .stage-solution-page .case-pagination { align-self: stretch; justify-content: flex-end; }
  .stage-solution-page .case-pagination span { margin-right: auto; }
  .stage-solution-page .case-pagination button { width: 40px; height: 40px; padding: 8px; }
  .stage-solution-page .case-more-link { padding-inline: 18px; font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .stage-solution-page .case-showcase-grid.is-updating .case-showcase-card { animation: none; }
}
/* Local to the SEO solution selector; shared page backgrounds stay unchanged. */
.stage-solution-page #solutions .section-top { margin-bottom: 28px; }
.stage-solution-page #solutions .solution-kicker { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; color: var(--blue); font-size: 14px; font-weight: 700; line-height: 20px; }
.stage-solution-page #solutions .solution-kicker::before { width: 3px; height: 16px; background: var(--blue); content: ""; }
.stage-solution-page #solutions .section-top .description { margin-top: 8px; font-size: 16px; }
.stage-solution-page #solutions .solution-grid { gap: 12px; }
.stage-solution-page #solutions .solution-card { position: relative; height: 190px; flex: 0 0 auto; grid-template-columns: 84px minmax(0, 1fr); gap: 14px; padding: 16px 14px; border-radius: 8px; transition: border-color .2s, box-shadow .2s; }
.stage-solution-page #solutions .solution-card:hover { transform: none; }
.stage-solution-page #solutions .solution-card > img { width: 84px; height: 84px; border-radius: 8px; }
.stage-solution-page #solutions .solution-body { min-height: 0; }
.stage-solution-page #solutions .solution-title { margin-bottom: 6px; padding-right: 6px; font-size: 19px; line-height: 26px; overflow-wrap: anywhere; }
.stage-solution-page #solutions .solution-description { display: -webkit-box; margin-bottom: 10px; color: #6e7f9c; font-size: 14px; line-height: 21px; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
.stage-solution-page #solutions .solution-card .quiz-tags { flex-wrap: nowrap; gap: 6px; }
.stage-solution-page #solutions .solution-card .quiz-tags span { min-width: 0; padding: 3px 8px; border-radius: 999px; font-size: 12px; line-height: 20px; white-space: nowrap; }
.stage-solution-page #solutions .selected-label { position: absolute; top: 8px; right: 8px; min-height: 0; margin: 0; color: var(--blue); background: none; line-height: 1; }
.stage-solution-page #solutions .selected-label i { display: block; font-size: 24px; background: #fff; border-radius: 50%; }
.stage-solution-page #solutions .solution-radio:checked + .solution-card .solution-title { padding-right: 18px; }
.stage-solution-page #solutions .recommendation { margin-top: 22px; padding: 28px; }
.stage-solution-page #solutions .single-solution .recommendation { margin-top: 0; }
.stage-solution-page #solutions .recommendation-summary > .eyebrow { margin-bottom: 8px; font-size: 14px; line-height: 20px; }
.stage-solution-page #solutions .recommendation-heading > div { width: 100%; flex-wrap: nowrap; gap: 24px; }
.stage-solution-page #solutions .recommendation-heading h3 { flex: 0 1 auto; font-size: 30px; line-height: 1.35; }
.stage-solution-page #solutions .recommendation-badge { display: flex; align-items: center; flex: 1 1 320px; gap: 10px; margin: 0; padding: 10px 12px; font-size: 14px; line-height: 22px; }
.stage-solution-page #solutions .recommendation-badge > i { flex: 0 0 24px; font-size: 24px; line-height: 1; }
.stage-solution-page #solutions .recommendation-body { margin-top: 24px; }
.stage-solution-page #solutions .recommendation-grid { gap: 18px; align-items: start; }
.stage-solution-page #solutions .main-preview { height: 346px; aspect-ratio: auto; border-radius: 8px; }
.stage-solution-page #solutions .thumbnail-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; padding: 2px; margin-top: 10px; overflow: visible; }
.stage-solution-page #solutions .thumbnail-button { display: block; width: 100%; height: 78px; min-height: 0; border-radius: 8px; }
.stage-solution-page #solutions .thumbnail-button img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; }
.stage-solution-page #solutions .solution-gallery-more { position: relative; isolation: isolate; overflow: hidden; }
.stage-solution-page #solutions .solution-gallery-more::after { position: absolute; inset: 0; z-index: 1; background: #0b1c3a99; content: ""; }
.stage-solution-page #solutions .solution-gallery-more > span { position: absolute; inset: 0; z-index: 2; display: grid; place-content: center; justify-items: center; gap: 2px; color: #fff; }
.stage-solution-page #solutions .solution-gallery-more i { font-size: 26px; line-height: 1; }
.stage-solution-page #solutions .solution-gallery-more small { font-size: 12px; line-height: 20px; }
.stage-solution-page #solutions .solution-details { display: flex; flex-direction: column; gap: 12px; }
.stage-solution-page #solutions .solution-process, .stage-solution-page #solutions .solution-features { min-width: 0; padding: 16px; border: 1px solid #e3edfb; border-radius: 8px; background: #fff; }
.stage-solution-page #solutions .detail-heading { gap: 8px 14px; margin-bottom: 14px; }
.stage-solution-page #solutions .detail-heading h3 { font-size: 23px; line-height: 28px; }
.stage-solution-page #solutions .detail-heading > span { font-size: 13px; color: #7585a0; }
.stage-solution-page #solutions .participation-steps { grid-template-columns: repeat(var(--step-columns, 3), minmax(0, 1fr)); gap: 22px 14px; margin: 0; padding: 2px 0 8px; border: 0; border-radius: 0; background: none; }
.stage-solution-page #solutions .participation-steps li { position: relative; align-self: start; }
.stage-solution-page #solutions .step-icon { position: relative; width: 56px; height: 56px; margin: 0 auto 24px; border-radius: 50%; color: var(--blue); background: color-mix(in srgb, var(--blue) 12%, white); }
.stage-solution-page #solutions .step-icon > i { font-size: 28px; line-height: 1; }
.stage-solution-page #solutions .step-number { position: absolute; bottom: -15px; left: 50%; display: grid; place-items: center; width: 23px; height: 23px; transform: translateX(-50%); border: 2px solid #fff; border-radius: 50%; color: #fff; background: var(--blue); font-size: 12px; font-weight: 700; line-height: 1; }
.stage-solution-page #solutions .participation-steps strong { font-size: 16px; line-height: 24px; overflow-wrap: anywhere; }
.stage-solution-page #solutions .step-connector { position: absolute; top: 14px; right: -21px; width: 28px; color: color-mix(in srgb, var(--blue) 45%, white); font-size: 28px; line-height: 28px; }
.stage-solution-page #solutions .participation-steps[data-columns="3"] li:nth-child(3n) .step-connector { display: none; }
.stage-solution-page #solutions .solution-facts { display: grid; gap: 8px; margin: 0; padding: 0; border: 0; border-radius: 0; }
.stage-solution-page #solutions .solution-fact { min-width: 0; border: 1px solid #e4edfb; border-radius: 8px; background: #fbfdff; }
.stage-solution-page #solutions .solution-fact summary { display: grid; grid-template-columns: 36px 62px minmax(0, 1fr) 14px; align-items: center; gap: 10px; min-height: 52px; padding: 6px 8px; list-style: none; cursor: pointer; }
.stage-solution-page #solutions .solution-fact summary::-webkit-details-marker { display: none; }
.stage-solution-page #solutions .solution-fact summary:focus-visible { outline: 3px solid #8bb9ff; outline-offset: 2px; border-radius: 8px; }
.stage-solution-page #solutions .solution-fact-icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 8px; color: var(--blue); background: color-mix(in srgb, var(--blue) 8%, white); }
.stage-solution-page #solutions .solution-fact-icon i { font-size: 24px; line-height: 1; }
.stage-solution-page #solutions .solution-fact summary strong { color: #17223a; font-size: 14px; line-height: 22px; }
.stage-solution-page #solutions .solution-fact-value { display: -webkit-box; color: #7484a0; font-size: 14px; line-height: 21px; overflow: hidden; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.stage-solution-page #solutions .solution-fact-arrow { color: #8193b0; font-size: 20px; line-height: 1; transition: transform .15s; }
.stage-solution-page #solutions .solution-fact[open] .solution-fact-arrow { transform: rotate(90deg); }
.stage-solution-page #solutions .solution-fact[open] .solution-fact-value { visibility: hidden; }
.stage-solution-page #solutions .solution-fact > p { padding: 0 14px 12px 54px; color: #667b9b; font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
@media (min-width: 768px) and (max-width: 1199px) {
  .stage-solution-page #solutions .solution-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stage-solution-page #solutions .solution-card { height: 168px; grid-template-columns: 94px minmax(0, 1fr); }
  .stage-solution-page #solutions .solution-card > img { width: 94px; height: 94px; }
  .stage-solution-page #solutions .recommendation-heading > div { flex-wrap: wrap; gap: 12px; }
  .stage-solution-page #solutions .recommendation-heading h3 { flex-basis: 100%; }
  .stage-solution-page #solutions .main-preview { height: 400px; }
  .stage-solution-page #solutions .solution-details { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
  .stage-solution-page #solutions .solution-fact summary { grid-template-columns: 32px 56px minmax(0, 1fr) 12px; gap: 6px; }
  .stage-solution-page #solutions .solution-fact-icon { width: 32px; height: 32px; }
  .stage-solution-page #solutions .solution-fact summary strong, .stage-solution-page #solutions .solution-fact-value { font-size: 13px; }
}
@media (max-width: 767px) {
  .stage-solution-page #solutions .section-top .description { font-size: 14px; }
  .stage-solution-page #solutions .section-top { margin-bottom: 20px; }
  .stage-solution-page #solutions .solution-grid { gap: 8px; }
  .stage-solution-page #solutions .solution-card { height: 140px; padding: 7px; gap: 8px; }
  .stage-solution-page #solutions .solution-card > img { width: 100%; height: auto; aspect-ratio: 1; }
  .stage-solution-page #solutions .solution-title { display: -webkit-box; margin: 0; padding: 0; font-size: 12px; line-height: 18px; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
  .stage-solution-page #solutions .solution-radio:checked + .solution-card .solution-title { padding: 0; }
  .stage-solution-page #solutions .solution-radio:checked + .solution-card .selected-label { display: block !important; top: 3px; right: 3px; }
  .stage-solution-page #solutions .selected-label i { font-size: 20px; }
  .stage-solution-page #solutions .recommendation { margin-top: 16px; padding: 16px; }
  .stage-solution-page #solutions .recommendation-heading > div { flex-wrap: wrap; gap: 12px; }
  .stage-solution-page #solutions .recommendation-heading h3 { font-size: 23px; }
  .stage-solution-page #solutions .recommendation-badge { flex-basis: 100%; font-size: 13px; line-height: 21px; }
  .stage-solution-page #solutions .recommendation-body { margin-top: 18px; }
  .stage-solution-page #solutions .recommendation-grid { gap: 16px; }
  .stage-solution-page #solutions .main-preview { height: 200px; }
  .stage-solution-page #solutions .thumbnail-grid { gap: 5px; }
  .stage-solution-page #solutions .thumbnail-button { height: 50px; }
  .stage-solution-page #solutions .solution-gallery-more i { font-size: 21px; }
  .stage-solution-page #solutions .solution-gallery-more small { font-size: 10px; line-height: 14px; }
  .stage-solution-page #solutions .solution-details { display: flex; }
  .stage-solution-page #solutions .solution-process, .stage-solution-page #solutions .solution-features { padding: 12px; }
  .stage-solution-page #solutions .detail-heading { gap: 6px 10px; margin-bottom: 16px; }
  .stage-solution-page #solutions .detail-heading h3 { font-size: 20px; line-height: 26px; }
  .stage-solution-page #solutions .detail-heading > span { font-size: 12px; }
  .stage-solution-page #solutions .participation-steps { gap: 20px 10px; }
  .stage-solution-page #solutions .step-icon { width: 46px; height: 46px; }
  .stage-solution-page #solutions .step-icon > i { font-size: 24px; }
  .stage-solution-page #solutions .step-connector { top: 10px; right: -17px; width: 24px; font-size: 24px; }
  .stage-solution-page #solutions .participation-steps strong { font-size: 13px; line-height: 20px; }
  .stage-solution-page #solutions .solution-fact summary { grid-template-columns: 30px 56px minmax(0, 1fr) 12px; gap: 6px; padding-inline: 6px; }
  .stage-solution-page #solutions .solution-fact-icon { width: 30px; height: 30px; }
  .stage-solution-page #solutions .solution-fact-icon i { font-size: 22px; }
  .stage-solution-page #solutions .solution-fact summary strong, .stage-solution-page #solutions .solution-fact-value { font-size: 12px; line-height: 19px; }
  .stage-solution-page #solutions .solution-fact > p { padding-left: 42px; font-size: 13px; }
}

/* Shared section rhythm, scoped to the independent SEO template. */
.stage-solution-page {
  --module-title-size: 32px;
  --module-title-line: 44px;
  --module-description-size: 16px;
  --module-description-line: 26px;
  --module-heading-gap: 24px;
  --module-space: 56px;
}
.stage-solution-page .quiz-section { padding-block: var(--module-space); }
.stage-solution-page .module-heading { min-width: 0; margin: 0 0 var(--module-heading-gap); text-align: left; }
.stage-solution-page .module-heading > h2,
.stage-solution-page .lead-copy h2 {
  margin: 0;
  font-size: var(--module-title-size);
  font-weight: 700;
  line-height: var(--module-title-line);
  letter-spacing: 0;
  overflow-wrap: anywhere;
}
.stage-solution-page .module-heading > h2 { color: var(--ink); }
.stage-solution-page .module-heading > .description {
  max-width: 880px;
  margin: 8px 0 0;
  color: var(--muted);
  font-size: var(--module-description-size);
  line-height: var(--module-description-line);
  overflow-wrap: anywhere;
}
.stage-solution-page .module-heading .text-link { margin-top: 12px; font-size: 14px; }
.stage-solution-page .faq-layout { display: block; }
.stage-solution-page .lead-copy h2 { margin-top: 12px; }
.stage-solution-page .lead-copy > p {
  margin-top: 12px;
  font-size: var(--module-description-size);
  line-height: var(--module-description-line);
}
.stage-solution-page #solutions .recommendation-heading h3,
.stage-solution-page #playways .play-title-line h3 { font-size: 24px; line-height: 34px; }
.stage-solution-page #solutions .detail-heading h3,
.stage-solution-page #playways .detail-heading h3 { font-size: 20px; line-height: 28px; }
@media (max-width: 767px) {
  .stage-solution-page {
    --module-title-size: 26px;
    --module-title-line: 36px;
    --module-description-size: 14px;
    --module-description-line: 24px;
    --module-heading-gap: 20px;
    --module-space: 32px;
  }
  .stage-solution-page #solutions .recommendation-heading h3,
  .stage-solution-page #playways .play-title-line h3 { font-size: 22px; line-height: 30px; }
  .stage-solution-page #solutions .detail-heading h3,
  .stage-solution-page #playways .detail-heading h3 { font-size: 18px; line-height: 26px; }
}
/* Capability cards share one toggle, including dynamically rendered cards. */
.stage-solution-page .capability-item { cursor: pointer; }
.stage-solution-page .capability-item:focus-within { outline: 2px solid var(--blue); outline-offset: 2px; }

/* Match the actual task count without changing other grids. */
.stage-solution-page #solutions .solution-grid { grid-template-columns: repeat(var(--task-columns, 4), minmax(0, 1fr)); }
.stage-solution-page #solutions .solution-card { height: auto; min-height: 190px; flex: 1; }
.stage-solution-page #solutions .solution-title, .stage-solution-page #solutions .solution-description { overflow-wrap: anywhere; }
.stage-solution-page #solutions .solution-card .quiz-tags { max-width: 100%; overflow: hidden; flex-wrap: wrap; }
.stage-solution-page #solutions .solution-card .quiz-tags span { max-width: 100%; flex-shrink: 0; overflow: hidden; text-overflow: ellipsis; }
@media (min-width: 768px) and (max-width: 1199px) {
  .stage-solution-page #solutions .solution-grid { grid-template-columns: repeat(var(--task-tablet-columns, 2), minmax(0, 1fr)); }
  .stage-solution-page #solutions .solution-card { min-height: 168px; }
}
@media (max-width: 767px) {
  .stage-solution-page #solutions .solution-grid { grid-template-columns: minmax(0, 1fr); }
  .stage-solution-page #solutions .solution-card { display: grid; grid-template-columns: 80px minmax(0, 1fr); align-items: start; gap: 12px; padding: 12px; min-height: 150px; }
  .stage-solution-page #solutions .solution-card > img { width: 80px; height: 80px; }
  .stage-solution-page #solutions .solution-body { text-align: left; }
  .stage-solution-page #solutions .solution-title { display: block; font-size: 16px; line-height: 24px; margin-bottom: 6px; padding-right: 16px; overflow: visible; }
  .stage-solution-page #solutions .solution-radio:checked + .solution-card .solution-title { padding-right: 16px; }
  .stage-solution-page #solutions .solution-description { display: -webkit-box !important; font-size: 14px; line-height: 21px; -webkit-line-clamp: 2; margin-bottom: 8px; }
  .stage-solution-page #solutions .solution-card .quiz-tags { display: flex !important; text-align: left; }
}