/* About page: light, sky-blue visual system aligned with the homepage. */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root { --xwa-ink: #08213c; --xwa-copy: #4e718a; --xwa-blue: #298fca; --xwa-sky: #e5f6ff; --xwa-line: rgba(33, 126, 190, .22); }
body.xw-about-page main { overflow: hidden; background: #fff; color: var(--xwa-ink); font-family: Manrope, "Segoe UI", sans-serif; }
.xw-about-container { width: min(1160px, calc(100% - 48px)); margin: 0 auto; }
.xw-about-label, .xw-about-eyebrow { display: inline-flex; align-items: center; gap: 8px; color: #287fbb; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }

.xw-about-hero { position: relative; min-height: 690px; display: flex; align-items: center; overflow: hidden; background: #e5f6ff; }
.xw-about-hero::before, .xw-about-hero::after { content: ""; position: absolute; border: 1px solid rgba(41, 143, 202, .22); border-radius: 50%; pointer-events: none; }
.xw-about-hero::before { width: min(71vw, 950px); aspect-ratio: 1; right: -19vw; top: -28%; }
.xw-about-hero::after { width: min(44vw, 570px); aspect-ratio: 1; right: 10vw; bottom: -39%; }
.xw-about-hero__pattern { position: absolute; inset: 0; opacity: .5; background-image: linear-gradient(rgba(33,126,190,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(33,126,190,.08) 1px, transparent 1px); background-size: 68px 68px; mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.82) 48%, transparent 92%); }
.xw-about-hero__inner { position: relative; z-index: 1; padding: 176px 0 110px; }
.xw-about-eyebrow { margin-bottom: 23px; padding: 10px 14px; border: 1px solid rgba(41,143,202,.28); border-radius: 999px; background: rgba(255,255,255,.58); }
.xw-about-hero h1 { max-width: 900px; margin: 0; color: var(--xwa-ink); font-size: clamp(48px, 7vw, 96px); font-weight: 700; letter-spacing: -.07em; line-height: .94; }
.xw-about-hero h1 span { color: var(--xwa-blue); }
.xw-about-hero p { max-width: 620px; margin: 28px 0 0; color: var(--xwa-copy); font-size: clamp(17px, 1.7vw, 21px); line-height: 1.6; }
.xw-about-hero__markers { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 38px; }
.xw-about-hero__markers span { padding: 10px 14px; border: 1px solid rgba(33,126,190,.2); border-radius: 999px; background: rgba(255,255,255,.68); color: #246b9c; font-size: 12px; font-weight: 700; }

.xw-about-journey { background: #fff; }
.xw-about-journey__grid { display: grid; grid-template-columns: minmax(230px, .7fr) minmax(0, 1.3fr); gap: clamp(45px, 9vw, 140px); padding: 120px 0; }
.xw-about-section-intro { align-self: start; position: sticky; top: 125px; }
.xw-about-section-intro h2, .xw-about-purpose__head h2, .xw-about-values h2, .xw-about-cta h2 { margin: 14px 0 0; color: var(--xwa-ink); font-size: clamp(38px, 4.4vw, 64px); font-weight: 700; letter-spacing: -.065em; line-height: .98; }
.xw-about-journey__copy { position: relative; border: 1px solid var(--xwa-line); border-radius: 18px; background: linear-gradient(145deg, #fff 0%, #f4fbff 100%); padding: clamp(28px, 4vw, 52px); box-shadow: 0 18px 42px rgba(23,107,157,.08); }
.xw-about-journey__copy::before { content: ""; position: absolute; top: 0; left: 34px; width: 82px; height: 4px; border-radius: 0 0 8px 8px; background: #298fca; }
.xw-about-journey__copy.tech-reveal { transform: translateX(48px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.75,.2,1), box-shadow .3s ease; }.xw-about-journey__copy.tech-reveal.is-visible { transform: translateX(0); }.xw-about-journey__copy:hover { box-shadow: 0 24px 50px rgba(23,107,157,.13); }
.xw-about-journey__copy p { margin: 0 0 28px; color: var(--xwa-copy); font-size: 16px; line-height: 1.78; }.xw-about-journey__copy p:last-child { margin-bottom: 0; }

.xw-about-purpose { padding: 112px 0 120px; background: var(--xwa-sky); border-block: 1px solid rgba(33,126,190,.12); }
.xw-about-purpose__head { max-width: 700px; margin-bottom: 52px; }.xw-about-purpose__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.xw-about-purpose-card { min-height: 500px; padding: clamp(28px, 4vw, 50px); border-radius: 18px; }.xw-about-purpose-card--mission { background: #298fca; color: #fff; }.xw-about-purpose-card--vision { border: 1px solid var(--xwa-line); background: #fff; color: var(--xwa-ink); }
.xw-about-purpose-card__icon { display: grid; width: 54px; height: 54px; margin-bottom: 54px; place-items: center; border-radius: 14px; font-size: 21px; }.xw-about-purpose-card--mission .xw-about-purpose-card__icon { background: rgba(255,255,255,.16); }.xw-about-purpose-card--vision .xw-about-purpose-card__icon { background: #d8f0fc; color: #197bb8; }
.xw-about-purpose-card > span { display: block; font-size: 11px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }.xw-about-purpose-card--mission > span { color: #dff5ff; }.xw-about-purpose-card--vision > span { color: #287fbb; }
.xw-about-purpose-card h3 { max-width: 470px; margin: 17px 0; font-size: clamp(29px, 3.1vw, 43px); letter-spacing: -.055em; line-height: 1.03; }.xw-about-purpose-card p { max-width: 510px; margin: 0; font-size: 15px; line-height: 1.72; }.xw-about-purpose-card--mission p { color: rgba(255,255,255,.86); }.xw-about-purpose-card--vision p { color: var(--xwa-copy); }

.xw-about-values { padding: 120px 0; background: #fff; }.xw-about-values__head { display: grid; grid-template-columns: 1.2fr .7fr; gap: 70px; align-items: end; margin-bottom: 55px; }.xw-about-values__head p { max-width: 420px; margin: 0 0 4px; color: var(--xwa-copy); font-size: 17px; line-height: 1.65; }
.xw-about-values__grid { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--xwa-line); border-radius: 18px; overflow: hidden; }.xw-about-value { min-height: 300px; padding: 30px 24px; border-right: 1px solid var(--xwa-line); }.xw-about-value:last-child { border: 0; }.xw-about-value i { display: grid; width: 46px; height: 46px; margin-bottom: 44px; place-items: center; border-radius: 12px; background: #d9f1fc; color: #197bb8; font-size: 18px; }.xw-about-value h3 { margin: 0 0 10px; color: var(--xwa-ink); font-size: 20px; letter-spacing: -.04em; }.xw-about-value p { margin: 0; color: var(--xwa-copy); font-size: 14px; line-height: 1.62; }

.xw-about-cta { position: relative; overflow: hidden; padding: 122px 0; background: #e5f6ff; text-align: center; }.xw-about-cta::before { content: ""; position: absolute; inset: auto -10vw -38vw auto; width: min(63vw, 780px); aspect-ratio: 1; border: 1px solid rgba(41,143,202,.2); border-radius: 50%; }.xw-about-cta__inner { position: relative; max-width: 900px; }.xw-about-cta h2 { max-width: 840px; margin-inline: auto; }.xw-about-cta p { max-width: 580px; margin: 24px auto 34px; color: var(--xwa-copy); font-size: 18px; line-height: 1.6; }.xw-about-cta__actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 13px; }.xw-about-button { display: inline-flex; align-items: center; gap: 11px; min-height: 52px; padding: 14px 20px; border: 1px solid transparent; border-radius: 8px; font-size: 13px; font-weight: 800; letter-spacing: .02em; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }.xw-about-button:hover { transform: translateY(-2px); text-decoration: none; }.xw-about-button--primary { background: #298fca; color: #fff; box-shadow: 0 15px 28px rgba(41,143,202,.22); }.xw-about-button--primary:hover { color: #fff; }.xw-about-button--secondary { border-color: rgba(33,126,190,.32); background: rgba(255,255,255,.65); color: #176b9d; }.xw-about-button--secondary:hover { color: #0c5e95; }
@media (max-width: 900px) { .xw-about-values__grid { grid-template-columns: repeat(3, 1fr); }.xw-about-value:nth-child(3) { border-right: 0; }.xw-about-value:nth-child(-n+3) { border-bottom: 1px solid var(--xwa-line); }.xw-about-value:last-child { border-right: 1px solid var(--xwa-line); } }
@media (max-width: 767px) { .xw-about-container { width: min(100% - 32px, 1160px); }.xw-about-hero { min-height: 640px; }.xw-about-hero__inner { padding: 145px 0 80px; }.xw-about-hero h1 { font-size: clamp(43px, 13.2vw, 68px); }.xw-about-journey__grid, .xw-about-values__head { display: block; padding: 75px 0; }.xw-about-section-intro { position: static; margin-bottom: 35px; }.xw-about-journey__copy { padding-left: 20px; }.xw-about-purpose, .xw-about-values, .xw-about-cta { padding: 75px 0; }.xw-about-purpose__grid { grid-template-columns: 1fr; }.xw-about-purpose-card { min-height: 0; }.xw-about-purpose-card__icon { margin-bottom: 38px; }.xw-about-values__head { margin-bottom: 36px; }.xw-about-values__head p { margin-top: 18px; }.xw-about-values__grid { grid-template-columns: 1fr; }.xw-about-value, .xw-about-value:nth-child(3), .xw-about-value:last-child { min-height: 0; border-right: 0; border-bottom: 1px solid var(--xwa-line); }.xw-about-value:last-child { border-bottom: 0; }.xw-about-value i { margin-bottom: 26px; } }

/* Sky-blue hero artwork with white typography. */
body.xw-about-page, body.xw-about-page main { background: #fff !important; color: var(--xwa-ink); }
.xw-about-hero { min-height: 650px; background: linear-gradient(135deg, #56b8e6 0%, #2796cd 56%, #6fc7ed 100%) !important; color: #fff !important; }
.xw-about-hero::before { opacity: .58; animation: xwAboutOrbit 18s ease-in-out infinite alternate; }
.xw-about-hero::after { opacity: .48; animation: xwAboutOrbit 14s ease-in-out -4s infinite alternate-reverse; }
.xw-about-hero__pattern { opacity: .28; animation: xwAboutGridDrift 26s linear infinite; }
.xw-about-hero__inner { padding: 164px 0 98px; animation: xwAboutIntro .75s cubic-bezier(.2,.8,.2,1) both; }
.xw-about-eyebrow { margin-bottom: 20px; border-color: rgba(255,255,255,.42); background: rgba(255,255,255,.16); color: #fff; animation: xwAboutFadeUp .6s .1s both; }
.xw-about-hero h1 { max-width: 820px; color: #fff !important; font-size: clamp(42px, 5.8vw, 76px); line-height: .98; animation: xwAboutFadeUp .7s .18s both; }
.xw-about-hero h1 span { color: #e8f9ff; }
.xw-about-hero p { max-width: 590px; margin-top: 24px; color: rgba(255,255,255,.9) !important; font-size: clamp(15px, 1.35vw, 18px); animation: xwAboutFadeUp .7s .3s both; }
.xw-about-hero__markers { margin-top: 32px; animation: xwAboutFadeUp .7s .42s both; }.xw-about-hero__markers span { border-color: rgba(255,255,255,.36); background: rgba(255,255,255,.14); color: #fff; }
.xw-about-purpose-card { transition: transform .3s ease, box-shadow .3s ease; }.xw-about-purpose-card:hover { transform: translateY(-6px); box-shadow: 0 22px 42px rgba(14,78,124,.13); }
.xw-about-value { transition: background .25s ease, transform .25s ease; }.xw-about-value:hover { background: #effaff; transform: translateY(-3px); }.xw-about-value i { transition: transform .25s ease; }.xw-about-value:hover i { transform: rotate(-8deg) scale(1.08); }
.xw-about-cta::before { opacity: .52; animation: xwAboutOrbit 16s ease-in-out infinite alternate; }
@keyframes xwAboutOrbit { from { transform: translate3d(0, 0, 0) scale(1); } to { transform: translate3d(-24px, 18px, 0) scale(1.06); } }
@keyframes xwAboutGridDrift { from { background-position: 0 0, 0 0; } to { background-position: 68px 68px, 68px 68px; } }
@keyframes xwAboutIntro { from { opacity: 0; } to { opacity: 1; } }
@keyframes xwAboutFadeUp { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 767px) { .xw-about-hero h1 { font-size: clamp(39px, 11.8vw, 60px); }.xw-about-hero__inner { padding: 145px 0 80px; } }
@media (prefers-reduced-motion: reduce) { .xw-about-hero::before, .xw-about-hero::after, .xw-about-hero__pattern, .xw-about-cta::before, .xw-about-hero__inner, .xw-about-eyebrow, .xw-about-hero h1, .xw-about-hero p, .xw-about-hero__markers { animation: none; }.xw-about-purpose-card, .xw-about-value, .xw-about-value i, .xw-about-button { transition: none; } }

/* Individual image-backed core value cards. */
.xw-about-values__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; border: 0; border-radius: 0; overflow: visible; }
.xw-about-value { position: relative; isolation: isolate; min-height: 335px; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; padding: 26px 22px; border: 0 !important; border-radius: 15px; background: linear-gradient(180deg, rgba(5,28,48,.08) 5%, rgba(5,28,48,.88) 100%), var(--value-image) center / cover no-repeat; color: #fff; box-shadow: 0 12px 24px rgba(8,33,60,.1); transition: transform .35s cubic-bezier(.2,.75,.2,1), box-shadow .35s ease, background-size .55s ease; }
.xw-about-value::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(8,33,60,.03) 0%, rgba(8,33,60,.88) 100%); transition: background .35s ease; }.xw-about-value:hover { background-size: 112%; transform: translateY(-10px); box-shadow: 0 22px 38px rgba(8,33,60,.22); }.xw-about-value:hover::before { background: linear-gradient(180deg, rgba(20,112,164,.12) 0%, rgba(5,38,64,.94) 100%); }
.xw-about-value i { width: 43px; height: 43px; margin: 0 0 auto; background: rgba(255,255,255,.18); color: #fff; backdrop-filter: blur(8px); }.xw-about-value:hover i { transform: rotate(-8deg) scale(1.1); background: rgba(255,255,255,.28); }.xw-about-value h3 { color: #fff; font-size: 19px; }.xw-about-value p { color: rgba(255,255,255,.84); font-size: 13px; line-height: 1.62; }
@media (max-width: 1050px) { .xw-about-values__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }.xw-about-value { min-height: 310px; } }
@media (max-width: 767px) { .xw-about-values__grid { grid-template-columns: 1fr; gap: 14px; }.xw-about-value { min-height: 270px; }.xw-about-value:hover { transform: translateY(-5px); } }

/* Image-backed mission and vision cards. */
.xw-about-purpose-card { position: relative; isolation: isolate; overflow: hidden; min-height: 520px; border: 0; background-position: center; background-size: cover; background-repeat: no-repeat; transition: transform .35s cubic-bezier(.2,.75,.2,1), box-shadow .35s ease, background-size .55s ease; }
.xw-about-purpose-card--mission { background-image: linear-gradient(180deg, rgba(7,48,79,.18) 8%, rgba(5,44,75,.91) 100%), url('../../images/solutions-cloud-visual.png'); }.xw-about-purpose-card--vision { background-image: linear-gradient(180deg, rgba(7,48,79,.16) 8%, rgba(5,44,75,.91) 100%), url('../../images/staffing-team-visual.png'); }
.xw-about-purpose-card:hover { background-size: 110%; transform: translateY(-10px); box-shadow: 0 24px 44px rgba(8,33,60,.23); }.xw-about-purpose-card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(14,115,171,.08); transition: background .35s ease; }.xw-about-purpose-card:hover::before { background: rgba(14,115,171,.22); }
.xw-about-purpose-card--mission, .xw-about-purpose-card--vision { color: #fff; }.xw-about-purpose-card--mission .xw-about-purpose-card__icon, .xw-about-purpose-card--vision .xw-about-purpose-card__icon { background: rgba(255,255,255,.18); color: #fff; backdrop-filter: blur(8px); }.xw-about-purpose-card--mission > span, .xw-about-purpose-card--vision > span { color: rgba(255,255,255,.86); }.xw-about-purpose-card h3 { color: #fff; }.xw-about-purpose-card--mission p, .xw-about-purpose-card--vision p { color: rgba(255,255,255,.87); }
@media (max-width: 767px) { .xw-about-purpose-card { min-height: 430px; }.xw-about-purpose-card:hover { transform: translateY(-5px); } }