.about-page h2 { font-size: clamp(2rem,3.7vw,3.6rem); line-height: 1.06; letter-spacing: -.045em; }
.about-page h2 span { color: #6f5cff; }
.about-hero { background: radial-gradient(ellipse at 85% 10%,#f8e8f5,transparent 55%),#f4f4fb; }
.about-section-nav { border-bottom: 1px solid #e0e2eb; background: #fff; }
.about-section-nav .container { display: flex; gap: 2rem; overflow-x: auto; }
.about-section-nav a { flex: none; padding: 1.3rem 0; color: #596175; font-size: .8rem; font-weight: 750; border-bottom: 3px solid transparent; }
.about-section-nav a:hover,.about-section-nav a:focus-visible { color: #6f5cff; border-color: #e24bab; }
.about-page section[id] { scroll-margin-top: 120px; }
.about-overview-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem,5vw,5rem); align-items: start; }
.about-gallery { min-width: 0; }
.about-gallery-stage { position: relative; overflow: hidden; border-radius: 28px; background: #141628; }
.about-gallery-stage>img { display: block; width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.about-gallery-caption { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-between; align-items: end; gap: 1rem; padding: 4rem 1.3rem 1.2rem; background: linear-gradient(transparent,rgba(10,12,28,.85)); color: #fff; pointer-events: none; font-size: .8rem; }
.about-gallery-caption [data-about-counter] { font-size: .65rem; letter-spacing: .1em; }
.about-gallery-controls { position: absolute; top: 1rem; right: 1rem; display: flex; gap: .4rem; }
.about-gallery-controls button { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid #ffffff65; border-radius: 50%; background: #111425aa; color: #fff; }
.about-gallery-controls button:hover { background: #6f5cff; }
.about-gallery-thumbs { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .65rem; margin-top: .8rem; }
.about-gallery-thumbs button { padding: 3px; border: 2px solid transparent; border-radius: 13px; background: #fff; }
.about-gallery-thumbs button[aria-pressed="true"] { border-color: #8058ff; }
.about-gallery-thumbs img { display: block; width: 100%; height: auto; aspect-ratio: 3/2; object-fit: cover; border-radius: 8px; }
.about-gallery button:focus-visible,.about-page a:focus-visible { outline: 3px solid #8058ff; outline-offset: 4px; }
.about-story>p,.about-history-intro>p { margin: 1.3rem 0; color: #747b8d; line-height: 1.8; font-size: .88rem; }
.about-story>p strong { color: #171a2d; }
.about-capabilities { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.25rem; margin-top: 2rem; }
.about-capabilities a { display: flex; align-items: start; gap: .8rem; color: #171a2d; }
.about-capabilities i { display: grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: 12px; background: #f1eeff; color: #795cff; }
.about-capabilities strong { display: block; font-size: .8rem; }
.about-capabilities small { display: block; margin-top: .25rem; color: #747b8d; font-size: .7rem; }
.about-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin-top: 4rem; padding: 2.5rem 1rem; border-radius: 28px; background: radial-gradient(ellipse at 100% 100%,#422044,transparent 65%),#131527; }
.about-stats>div { display: flex; flex-direction: column; gap: .5rem; align-items: center; padding: .5rem 1rem; text-align: center; border-right: 1px solid #ffffff22; }
.about-stats>div:last-child { border: 0; }
.about-stats strong { font-size: clamp(2rem,4vw,3.7rem); line-height: 1.2; letter-spacing: -.04em; color: #cfa2ff; }
.about-stats span { font-size: .76rem; color: #d0cfdd; }
.about-history-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 5rem; align-items: start; }
.about-history-intro { position: sticky; top: 130px; }
.about-timeline { list-style: none; margin: 0; padding: 0; }
.about-timeline li { position: relative; display: grid; grid-template-columns: 75px 1fr; gap: 2rem; padding: 0 0 2.5rem; }
.about-timeline li:before { content: ''; position: absolute; top: .5rem; bottom: -.5rem; left: 88px; width: 1px; background: #dcd6f0; }
.about-timeline li:after { content: ''; position: absolute; top: .4rem; left: 83px; width: 11px; height: 11px; border-radius: 50%; background: linear-gradient(135deg,#7759ff,#ec4da1); box-shadow: 0 0 0 5px #efebfa; }
.about-timeline li:last-child { padding-bottom: 0; }
.about-timeline li:last-child:before { display: none; }
.about-year { color: #795cff; font-size: 1.5rem; font-weight: 800; line-height: 1; }
.about-timeline h3 { font-size: 1.15rem; margin: 0 0 .65rem; }
.about-timeline p { margin: 0; color: #747b8d; font-size: .85rem; line-height: 1.8; }
.about-section-heading { max-width: 820px; margin-bottom: 2.5rem; }
.about-values-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1rem; }
.about-value { padding: 1.6rem; border: 1px solid #e0e2eb; border-radius: 24px; background: #fff; }
.about-value>i { width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 2rem; border-radius: 14px; color: #fff; background: linear-gradient(135deg,#7658ff,#ee49a4); font-size: 1.25rem; }
.about-value h3 { font-size: 1.15rem; }
.about-value p { color: #747b8d; font-size: .8rem; line-height: 1.75; margin-bottom: 0; }
.about-recognition-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.about-award-setting { display: flex; flex-direction: column; position: relative; min-width: 0; overflow: hidden; border-radius: 24px; background: #141628; }
.about-award-setting>img { width: 100%; height: 100%; min-height: 350px; object-fit: cover; }
.about-award-setting>span { position: absolute; bottom: 0; left: 0; right: 0; display: flex; justify-content: space-between; padding: 3rem 1.5rem 1.5rem; color: #fff; background: linear-gradient(transparent,#111425bb); font-size: .8rem; }
.about-awards { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.about-award { padding: 1rem 1rem 1.5rem; border: 1px solid #e0e2eb; border-radius: 24px; background: #fff; color: #171a2d; }
.about-award>div { display: grid; place-items: center; height: 280px; padding: .5rem; background: #f8f7fb; border-radius: 16px; margin-bottom: 1.25rem; }
.about-award img { width: 100%; height: 100%; object-fit: contain; min-height: 0; }
.about-award small { display: block; color: #795cff; font-weight: 800; font-size: .65rem; letter-spacing: .08em; }
.about-award h3 { margin: .7rem 0 0; font-size: 1.1rem; }
.about-certificate-link { display: inline-flex; align-items: center; gap: .5rem; margin-top: 1.5rem; color: #7658ff; font-size: .8rem; font-weight: 700; }
.about-cta { background: radial-gradient(ellipse at 100% 100%,#49213f,transparent 60%),#111425; }
.about-cta p { color: #b8bdcf; max-width: 700px; margin: 1.4rem 0 0; line-height: 1.7; }
.about-cta-actions { display: flex; flex-direction: column; gap: 1.25rem; flex: none; align-items: center; }
.about-secondary-link { color: #fff; font-size: .85rem; }
@media(max-width:1199px) { .about-overview-grid { gap: 2rem; } .about-history-grid { gap: 3rem; } .about-values-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .about-recognition-grid { grid-template-columns: 1fr; } .about-award-setting>img { max-height: 450px; object-position: 50% 65%; } }
@media(max-width:991px) { .about-overview-grid,.about-history-grid { grid-template-columns: 1fr; } .about-gallery { max-width: 700px; } .about-history-intro { position: static; } .about-gallery-thumbs { grid-template-columns: repeat(8,minmax(0,1fr)); } }
@media(max-width:767px) { .about-section-nav .container { gap: 1.4rem; } .about-section-nav a { font-size: .72rem; } .about-gallery-thumbs { grid-template-columns: repeat(4,minmax(0,1fr)); } .about-stats { grid-template-columns: 1fr 1fr; gap: 1.5rem 0; padding: 1.7rem .5rem; margin-top: 2.5rem; } .about-stats>div:nth-child(2) { border: 0; } .about-stats strong { font-size: 2.4rem; } .about-capabilities { gap: 1.1rem .6rem; } .about-capabilities a { gap: .6rem; } .about-values-grid { grid-template-columns: 1fr; } .about-value>i { margin-bottom: 1.3rem; } .about-awards { grid-template-columns: 1fr; } .about-award>div { height: 300px; } .about-award-setting>img { min-height: 260px; } .about-cta .container { align-items: start; } .about-cta-actions { align-items: start; } .about-timeline li { grid-template-columns: 62px 1fr; gap: 1.5rem; } .about-timeline li:before { left: 70px; } .about-timeline li:after { left: 65px; } }