.about-story { display: grid; grid-template-columns: minmax(0,2fr) minmax(0,1fr); gap: 16px; }
.about-story__statement { position: relative; isolation: isolate; overflow: hidden; grid-row: span 2; display: flex; flex-direction: column; justify-content: space-between; min-height: 430px; padding: 40px; box-shadow: var(--shadow-control); border-radius: 20px; background: radial-gradient(ellipse at 80% 15%,#d2e5db,transparent 52%),radial-gradient(ellipse at 15% 95%,#d5def3,transparent 60%),#e7e9df; }
.about-story__statement::before { content: ''; position: absolute; z-index: -1; inset: 0; opacity: .12; background: url('../images/walkthrough-grain.svg'); }
.about-story__mark img { width: 90px; height: auto; opacity: .75; }
.about-story__statement h2 { font-size: clamp(28px,3vw,40px); line-height: 1.45; font-weight: 500; letter-spacing: -.035em; }
.about-story__statement p { max-width: 540px; margin-top: 22px; font-size: 16px; line-height: 1.9; color: var(--color-text-600); }
.about-story__aside { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; gap: 22px; padding: 28px; border-radius: 20px; background: #fff; box-shadow: var(--shadow-control); }
.about-story__icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: #edf2f3; }
.about-story__icon img { width: 21px; height: 21px; }
.about-story__aside h3 { font-size: 20px; font-weight: 500; line-height: 30px; }
.about-story__aside p { margin-top: 10px; font-size: 14px; line-height: 25px; color: var(--color-text-600); }
.about-method__heading { text-align: center; margin-bottom: 48px; }
.about-method__heading h2 { font-size: clamp(28px,3vw,38px); font-weight: 500; line-height: 1.45; letter-spacing: -.035em; }
.about-method__heading p { margin-top: 20px; font-size: 15px; line-height: 27px; color: var(--color-text-600); }
.about-method__map { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0,1fr) 220px minmax(0,1fr); grid-template-areas: 'process hub people' 'improvement hub growth'; gap: 16px; padding: 20px; border-radius: 28px; background: #ecf0f670; }
.about-method__connections { position: absolute; z-index: -1; inset: 0; width: 100%; height: 100%; stroke: #c8d6db; stroke-width: 1; }
.about-method__card { position: relative; padding: 28px; background: #fff; border: 1px solid #fff; border-radius: 22px; }
.about-method__card--process { grid-area: process; }
.about-method__card--improvement { grid-area: improvement; }
.about-method__card--people { grid-area: people; }
.about-method__card--growth { grid-area: growth; }
.about-method__icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: #eef2f7; }
.about-method__icon img { width: 20px; height: 20px; }
.about-method__card--people .about-method__icon,.about-method__card--growth .about-method__icon { background: #ebf2ef; }
.about-method__card h3 { margin-top: 22px; font-size: 20px; font-weight: 500; line-height: 30px; }
.about-method__card p { margin-top: 10px; font-size: 14px; line-height: 25px; color: var(--color-text-600); }
.about-method__hub { grid-area: hub; display: grid; place-items: center; position: relative; isolation: isolate; overflow: hidden; border-radius: 22px; border: 1px solid #ffffff91; }
.about-method__core { display: flex; align-items: center; flex-direction: column; justify-content: center; width: 176px; height: 176px; border-radius: 50%; background: var(--color-brand); color: #fff; }
.about-method__core img { width: 78px; height: auto; filter: brightness(0) invert(1); }
.about-method__core strong { margin-top: 20px; font-size: 16px; font-weight: 500; }
.about-method__core span { margin-top: 8px; font-size: 12px; line-height: 18px; color: #fff; }
.about-method__orbit { position: absolute; z-index: -1; width: 194px; height: 194px; border: 1px solid #cfdae580; border-radius: 50%; box-shadow: 0 0 0 12px #dbe4ed26,0 0 0 24px #dbe4ed1a; }
.about-method__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; margin-top: 32px; }
.industry-rail { display: grid; grid-template-columns: var(--industry-columns,repeat(3,minmax(0,1fr))); gap: 14px; transition: grid-template-columns .65s cubic-bezier(.22,1,.36,1); }
.industry-scene { position: relative; isolation: isolate; display: flex; flex-direction: column; min-width: 0; min-height: 460px; padding: 28px; overflow: hidden; border-radius: 26px; background: #e8edf1; }
.industry-scene--manufacturing { background: radial-gradient(ellipse at 85% 10%,#d8e1ec,transparent 62%),#ebeff3; }
.industry-scene--specialist { background: radial-gradient(ellipse at 75% 18%,#e1dfd6,transparent 60%),#efefea; }
.industry-scene--growth { background: radial-gradient(ellipse at 90% 10%,#d4e2dd,transparent 65%),#eaf0ed; }
.industry-scene__top { display: flex; justify-content: space-between; align-items: center; gap: 14px; font-size: 11px; line-height: 19px; color: var(--color-text-600); }
.industry-scene__top img { flex: 0 0 38px; width: 38px; height: 38px; padding: 10px; border-radius: 50%; background: #ffffffa6; }
.industry-scene__art { position: absolute; z-index: -1; bottom: 40px; right: 24px; width: 140px; height: 140px; }
.industry-scene__art span { position: absolute; inset: 0; border: 1px solid #ffffffa1; border-radius: 50%; transition: transform .65s ease; }
.industry-scene__art span:nth-child(2) { inset: 14px; }
.industry-scene__art span:nth-child(3) { inset: 28px; background: #ffffff2b; }
.industry-scene[data-active="true"] .industry-scene__art span:first-child { transform: scale(1.15); }
.industry-scene__copy { margin-top: auto; padding-top: 100px; }
.industry-scene h3 { max-width: 410px; font-size: clamp(21px,2vw,28px); line-height: 1.4; font-weight: 500; letter-spacing: -.025em; }
.industry-scene__copy button { appearance: none; display: block; border: 0; padding: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.industry-scene__copy button::after { content: ''; position: absolute; inset: 0; border-radius: 26px; }
.industry-scene__copy button:disabled { cursor: default; }
.industry-scene__copy button:focus-visible { outline: none; }
.industry-scene__copy button:focus-visible::after { outline: 2px solid var(--color-brand); outline-offset: -4px; }
.industry-scene__detail { display: grid; grid-template-rows: 1fr; opacity: 1; transition: grid-template-rows .5s ease,opacity .4s ease; }
.industry-scene__detail > div { min-height: 0; overflow: hidden; }
.industry-scene__detail p { max-width: 430px; margin-top: 18px; font-size: 14px; line-height: 26px; color: var(--color-text-600); }
.industry-scene__detail a { position: relative; z-index: 2; margin-top: 24px; }
.industry-rail[data-enhanced="true"] .industry-scene[data-active="false"] .industry-scene__detail { grid-template-rows: 0fr; opacity: 0; pointer-events: none; }
.about-services .service-directory { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 20px; border: 0; }
.about-services .service-directory > a { position: relative; grid-column: span 2; display: flex; flex-direction: column; align-items: flex-start; gap: 28px; padding: 30px; border: 0; border-radius: 20px; background: #fff; box-shadow: var(--shadow-control); transition: background .28s ease; }
.about-services .service-directory > a:nth-child(n+4) { grid-column: span 3; }
.about-services .service-directory > a > img:not(.link-arrow) { width: 52px; height: 52px; padding: 13px; border-radius: 16px; background: #edf3fe; }
.about-services .service-directory > a:nth-child(2) > img:not(.link-arrow) { background: #edf4f0; }
.about-services .service-directory > a:nth-child(3) > img:not(.link-arrow) { background: #f6f0e9; }
.about-services .service-directory > a:nth-child(4) > img:not(.link-arrow) { background: #efedf8; }
.about-services .service-directory > a:nth-child(5) > img:not(.link-arrow) { background: #eaf3f5; }
.about-services .service-directory h3 { font-size: 20px; line-height: 28px; }
.about-services .service-directory p { max-width: 440px; font-size: 14px; line-height: 22px; }
.about-services .service-directory > a:hover { background: #f7faff; }
@media(max-width:760px) {
 .about-services .service-directory { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
 .about-services .service-directory > a, .about-services .service-directory > a:nth-child(n+4) { grid-column: auto; padding: 24px; }
 .about-services .service-directory > a:last-child { grid-column: 1/-1; }
}
@media(max-width:480px) {
 .about-services .service-directory { grid-template-columns: minmax(0,1fr); }
 .about-services .service-directory > a { gap: 22px; }
}
@media(prefers-reduced-motion:reduce) { .about-services .service-directory > a { transition: none; } }
@media(max-width:1000px) {
 .about-story__statement { padding: 30px; }
 .about-story__aside { padding: 24px; }
 .about-method__map { grid-template-columns: minmax(0,1fr) 170px minmax(0,1fr); padding: 12px; gap: 12px; }
 .about-method__card { padding: 22px; }
 .about-method__core { width: 144px; height: 144px; }
 .about-method__orbit { width: 162px; height: 162px; }
 .industry-scene { padding: 24px; min-height: 420px; }
 .industry-scene__detail .button-outline { padding-inline: 18px; }
}
@media(max-width:760px) {
 .about-story { grid-template-columns: 1fr 1fr; }
 .about-story__statement { grid-column: 1/-1; grid-row: auto; min-height: 360px; }
 .about-method__map { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-areas: 'hub hub' 'process people' 'improvement growth'; padding: 16px; }
 .about-method__hub { min-height: 210px; }
 .about-method__connections { display: none; }
 .industry-rail { grid-template-columns: minmax(0,1fr); }
 .industry-scene { min-height: 340px; transition: min-height .5s ease; }
 .industry-rail[data-enhanced="true"] .industry-scene[data-active="false"] { min-height: 138px; }
 .industry-scene__copy { padding-top: 50px; }
 .industry-rail[data-enhanced="true"] .industry-scene[data-active="false"] .industry-scene__copy { padding-top: 22px; }
 .industry-scene h3 { font-size: 24px; }
 .industry-scene__art { width: 115px; height: 115px; bottom: 16px; }
}
@media(max-width:480px) {
 .about-story { grid-template-columns: minmax(0,1fr); gap: 14px; }
 .about-story__statement { padding: 28px 24px; min-height: 380px; }
 .about-story__statement h2 { font-size: 28px; }
 .about-story__statement p { font-size: 14px; line-height: 26px; }
 .about-story__aside { min-height: 185px; gap: 22px; }
 .about-method__heading { margin-bottom: 30px; }
 .about-method__heading p { font-size: 14px; line-height: 25px; }
 .about-method__map { grid-template-columns: 1fr; grid-template-areas: 'hub' 'process' 'improvement' 'people' 'growth'; padding: 12px; }
 .about-method__card { padding: 24px; }
 .about-method__actions { flex-direction: column; }
 .about-method__actions .button-outline { width: 100%; }
 .industry-scene { padding: 24px; }
}
@media(prefers-reduced-motion:reduce) { .industry-rail,.industry-scene,.industry-scene__detail,.industry-scene__art span { transition: none; } }

.about-hero + .about-story {
  position: relative;
  z-index: 1;
  margin-top: 0;
}
@media (max-width: 800px) {
  .about-hero + .about-story { margin-top: -24px; }
}

@media (max-width: 720px) {
  .about-hero { margin-top: -80px; }
  .about-hero .page-hero { min-height: 560px; padding-top: 208px; }
  .industry-scene__top { font-size: 12px; line-height: 18px; }
}
@media (max-width: 520px) {
  .about-hero .page-hero { min-height: 540px; padding-top: 192px; }
}
