.about-page{background-color:#f7faff;background-image:radial-gradient(circle at 8% 20%,rgba(61,133,232,.09),transparent 24%),radial-gradient(circle at 92% 62%,rgba(39,190,155,.08),transparent 25%)}
.about-hero{isolation:isolate;background:radial-gradient(circle at 82% 18%,rgba(37,187,177,.25),transparent 27%),radial-gradient(circle at 16% 72%,rgba(52,110,226,.26),transparent 31%),linear-gradient(125deg,#041735 0%,#0b2d66 52%,#086f73 100%)}
.about-hero::before{content:"";position:absolute;z-index:-1;right:8%;top:12%;width:290px;height:290px;border:1px solid rgba(144,211,255,.18);border-radius:50%;box-shadow:0 0 0 36px rgba(143,205,255,.035),0 0 0 72px rgba(143,205,255,.025)}
.about-hero__copy{animation:aboutCopyIn .8s ease both}.about-hero__visual{animation:aboutVisualIn .9s .12s ease both}@keyframes aboutCopyIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}@keyframes aboutVisualIn{from{opacity:0;transform:rotate(2deg) translateY(22px)}to{opacity:1;transform:rotate(2deg) translateY(0)}}
.about-hero__visual{border-color:rgba(170,221,255,.38);box-shadow:0 30px 80px rgba(0,0,0,.33),0 0 0 8px rgba(255,255,255,.025)}
.about-signature__mark{object-fit:cover}
.about-hero__visual::before{content:"W3 KARIGAR / ABOUT US";position:absolute;z-index:3;top:19px;left:20px;padding:8px 11px;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:rgba(3,19,48,.48);color:#d2e9ff;font-size:9px;font-weight:800;letter-spacing:.15em}
.about-hero__badge{box-shadow:0 14px 30px rgba(0,0,0,.24)}
.about-section-label{color:#1768c9}.about-story,.about-values{position:relative}.about-story::before{content:"";position:absolute;left:24px;top:74px;width:3px;height:92px;border-radius:9px;background:linear-gradient(#1d70d2,#2bc59b)}
.about-story__intro{padding-left:22px}.about-story__body{position:relative;padding:27px 0 10px 42px;border-left:1px solid #d3e1f1}.about-story__body::before{content:"";position:absolute;left:-5px;top:30px;width:9px;height:9px;border-radius:50%;background:#25ae88;box-shadow:0 0 0 6px #e4f7f1}
.about-proof{position:relative;box-shadow:0 18px 50px rgba(8,29,67,.16)}.about-proof::before{content:"";position:absolute;inset:0;opacity:.14;background-image:linear-gradient(rgba(255,255,255,.15) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.15) 1px,transparent 1px);background-size:34px 34px}.about-proof__grid{position:relative}
.about-values article{transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}.about-values article:hover{transform:translateY(-8px);border-color:#9fc5ed;box-shadow:0 24px 45px rgba(44,79,132,.14)}
.about-process{position:relative;isolation:isolate;background:radial-gradient(circle at 90% 10%,rgba(39,190,155,.13),transparent 28%),linear-gradient(135deg,#edf6ff,#f0fbf8)}.about-process::after{content:"";position:absolute;z-index:-1;right:-120px;bottom:-220px;width:430px;height:430px;border:1px solid rgba(38,112,198,.15);border-radius:50%;box-shadow:0 0 0 40px rgba(38,112,198,.035),0 0 0 80px rgba(38,112,198,.025)}
.about-process article{position:relative}.about-process article::before{content:"";position:absolute;left:0;top:31px;width:100%;height:1px;background:#cddded}.about-process article:first-child::before{left:50%;width:50%}.about-process article:last-child::before{width:50%}.about-process strong{position:relative;z-index:1;display:grid;place-items:center;width:47px;height:47px;border:1px solid #b8d1eb;border-radius:50%;background:#edf6ff;color:#1768c9}
.about-cta{position:relative;isolation:isolate;background:radial-gradient(circle at 80% 30%,rgba(37,183,161,.25),transparent 30%),linear-gradient(120deg,#06183a,#0a326c)}.about-cta::before{content:"";position:absolute;z-index:-1;inset:0;opacity:.13;background-image:linear-gradient(rgba(255,255,255,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.16) 1px,transparent 1px);background-size:40px 40px}
@media(max-width:850px){.about-story::before{left:24px;top:48px}.about-story__body{padding-left:24px}.about-process article::before{display:none}.about-process article:first-child::before,.about-process article:last-child::before{display:none}}
@media(max-width:520px){.about-hero__visual::before{font-size:8px}.about-story::before{left:16px}.about-story__intro{padding-left:17px}.about-story__body{padding-left:20px}}
