/* =============================================================
   Web2LinkIndia — About page ONLY
   Requires the existing assets/css/style.css first.
   All selectors are scoped to .about-page. No header/footer CSS.
   ============================================================= */
.about-page{overflow:hidden;background:#fff;color:var(--text)}
.about-page h1,.about-page h2,.about-page h3{font-family:var(--font-head);color:var(--heading)}
.about-page .ab-kicker{display:block;color:#e87500;text-transform:uppercase;font-family:var(--font-head);font-size:12px;letter-spacing:.12em;font-weight:700;margin-bottom:8px}
.about-page h2{font-size:clamp(25px,3.2vw,36px);font-weight:800;letter-spacing:-.04em;line-height:1.15;margin:0 0 16px}
.about-page h2 span{color:#101828}
.about-page p{line-height:1.7}

/* Hero / breadcrumb */
.about-page .ab-hero{isolation:isolate;position:relative;overflow:hidden;padding:20px 0 22px;background:radial-gradient(ellipse 56% 100% at 84% 40%,#fff0e2 0%,#fff6ed 35%,transparent 80%),linear-gradient(125deg,#eef6ff 0%,#fff 52%,#fff7ef 100%)}
.about-page .ab-hero:after{content:"";position:absolute;left:-65px;bottom:-74px;width:190px;height:190px;border-radius:50%;background:#e4f2ff;z-index:-1}
.about-page .ab-hero .container{z-index:1}
.about-page .ab-breadcrumb{margin:4px 0 24px}
.about-page .ab-breadcrumb ol{list-style:none;padding:0;margin:0;display:flex;align-items:center;gap:9px;color:#334155;font-size:12px;font-weight:500}
.about-page .ab-breadcrumb li+li:before{content:"/";padding-right:9px;color:#9aa9b8}
.about-page .ab-breadcrumb a{color:#334155}
.about-page .ab-breadcrumb a:hover{color:var(--primary-dark)}
.about-page .ab-eyebrow{display:inline-flex;align-items:center;gap:8px;padding:6px 11px;background:#f4f6f8;border-radius:7px;text-transform:uppercase;color:#344154;font-size:10px;font-weight:700;letter-spacing:.05em;margin-bottom:12px}
.about-page .ab-eyebrow i{width:8px;height:8px;border-radius:50%;background:#ff8a00;box-shadow:0 0 0 4px #fff2df}
.about-page .ab-hero h1{font-weight:800;font-size:clamp(39px,5.2vw,70px);letter-spacing:-.06em;line-height:1.06;margin-bottom:14px}
.about-page .ab-hero h1 span{display:block;color:#ff7600;white-space:normal}
.about-page .ab-hero-desc{max-width:480px;font-size:clamp(14px,1.25vw,16px);line-height:1.75;margin-bottom:21px}
.about-page .ab-hero-buttons{display:flex;flex-wrap:wrap;align-items:center;gap:11px}
.about-page .ab-hero-buttons .btn{min-height:45px;padding:10px 18px;font-size:13px}
.about-page .ab-hero-buttons .btn-outline-soft i{color:#122034}
.about-page .ab-trust{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:24px 0 0;padding:0}
.about-page .ab-trust li{font-size:11px;line-height:1.3;display:flex;align-items:center;gap:7px;white-space:nowrap;color:#344154}
.about-page .ab-trust li+li{padding-left:12px;border-left:1px solid #dbe2ec}
.about-page .ab-trust i{color:#ff8200;font-size:19px}
.about-page .ab-hero-art-col{min-width:0}
.about-page .ab-hero-art{position:relative;margin:0 -26px 0 -10px}
.about-page .ab-hero-art img{display:block;width:100%;height:auto;filter:drop-shadow(0 15px 22px rgba(134,112,87,.05));mix-blend-mode:multiply}

/* About story */
.about-page .ab-story{padding:50px 0 22px}
.about-page .ab-story h2{max-width:440px}
.about-page .ab-story p{font-size:14px;margin-bottom:12px;max-width:490px}
.about-page .ab-story-extra{color:#667586}
.about-page .ab-story .btn{padding:10px 20px;font-size:13px;margin-top:8px}
.about-page .ab-story-visual{border-radius:22px;overflow:hidden;background:#f7fbff;box-shadow:0 14px 35px rgba(26,45,69,.06)}
.about-page .ab-story-visual img{display:block;width:100%;height:auto}

/* Purpose */
.about-page .ab-purpose{padding:16px 0 25px}
.about-page .ab-purpose-card{height:100%;min-height:203px;position:relative;overflow:hidden;border:1px solid #e8edf3;border-radius:17px;padding:25px 25px 21px;box-shadow:0 5px 17px rgba(26,45,69,.04);background:#fff;transition:transform .25s,box-shadow .25s}
.about-page .ab-purpose-card:hover{transform:translateY(-5px);box-shadow:0 12px 30px rgba(26,45,69,.1)}
.about-page .ab-purpose-card:after{position:absolute;content:"";right:-32px;top:-40px;width:120px;height:120px;border-radius:50%;opacity:.55}
.about-page .ab-purpose-mission{background:linear-gradient(125deg,#fff,#fffaf5)}
.about-page .ab-purpose-mission:after{background:#ffe6c4}
.about-page .ab-purpose-vision{background:linear-gradient(125deg,#fff,#f0f7ff)}
.about-page .ab-purpose-vision:after{background:#d9ebff}
.about-page .ab-purpose-values{background:linear-gradient(125deg,#fff,#fff2f2)}
.about-page .ab-purpose-values:after{background:#ffe0df}
.about-page .ab-purpose-head{display:flex;align-items:center;gap:15px;position:relative;z-index:1;margin-bottom:12px}
.about-page .ab-purpose-icon{width:48px;height:48px;border-radius:12px;flex-shrink:0;display:grid;place-items:center;color:#fff;font-size:24px;box-shadow:0 7px 16px rgba(255,112,0,.12)}
.about-page .ab-orange{background:linear-gradient(135deg,#ff9700,#ff6900)}
.about-page .ab-blue{background:linear-gradient(135deg,#3cb4ff,#0868ff)}
.about-page .ab-coral{background:linear-gradient(135deg,#ff6e46,#fc5300)}
.about-page .ab-purpose-head h3{font-size:16px;font-weight:700;letter-spacing:-.02em;margin:0}
.about-page .ab-purpose-card p{position:relative;z-index:1;font-size:13px;line-height:1.68;margin:0}

/* Metrics */
.about-page .ab-stats{padding:5px 0 28px}
.about-page .ab-stats-bar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:20px 15px;background:linear-gradient(110deg,#f4f6f8,#fafbfc);border-radius:14px}
.about-page .ab-stat{display:flex;align-items:center;justify-content:center;gap:15px;padding:2px 12px;min-width:0}
.about-page .ab-stat+.ab-stat{border-left:1px solid #d7dfe9}
.about-page .ab-stat>i{color:#ff7a00;font-size:35px;line-height:1}
.about-page .ab-stat p{margin:0;min-width:0}
.about-page .ab-stat strong{display:block;color:#111827;font-size:clamp(19px,2vw,27px);line-height:1.05;font-family:var(--font-head);font-weight:800;letter-spacing:-.035em}
.about-page .ab-stat small{display:block;font-size:11px;color:#596779;line-height:1.6}

/* Process */
.about-page .ab-process{padding:9px 0 38px}
.about-page .ab-process-header{display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,.85fr) auto;align-items:end;gap:25px;margin-bottom:27px}
.about-page .ab-process-header h2{margin-bottom:0}
.about-page .ab-process-header p{font-size:12px;line-height:1.6;margin:0 0 3px;max-width:365px}
.about-page .ab-process-header .btn{font-size:12px;padding:9px 16px;white-space:nowrap}
.about-page .ab-steps{list-style:none;counter-reset:step;position:relative;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0}
.about-page .ab-steps:before{content:"";position:absolute;left:8%;right:8%;top:18px;border-top:2px dotted #ffb464}
.about-page .ab-steps li{position:relative;min-width:0;padding:0 18px 0 12px}
.about-page .ab-step-number{position:relative;z-index:1;display:grid;place-items:center;margin:0 auto 18px;width:38px;height:38px;border:3px solid #fff;border-radius:50%;color:#fff;font-family:var(--font-head);font-weight:700;font-size:12px;background:#ff7900;box-shadow:0 2px 8px #c5d4e66b}
.about-page .ab-steps li:nth-child(even) .ab-step-number{background:#0866f5}
.about-page .ab-steps li:nth-child(3) .ab-step-number{background:#ff6100}
.about-page .ab-step-icon{display:block;font-size:26px;color:#ff7a00;line-height:1.2;margin:0 0 11px}
.about-page .ab-steps li:nth-child(even) .ab-step-icon{color:#0866f5}
.about-page .ab-steps h3{font-size:13px;font-weight:700;margin:0 0 6px}
.about-page .ab-steps p{font-size:11px;line-height:1.5;margin:0}
.about-page .ab-steps li+li:after{content:"";position:absolute;left:0;top:75px;bottom:0;border-left:1px solid #dce4ef}

/* Orange CTA before the original footer */
.about-page .ab-cta{position:relative;isolation:isolate;padding:24px 0 28px;overflow:hidden;background:radial-gradient(circle at 4% 96%,#ffe2be,transparent 30%),linear-gradient(105deg,#fff8f1 0%,#fff0db 78%,#ffeedf 100%);border-radius:20px 20px 0 0}
.about-page .ab-cta-layout{display:flex;align-items:center;justify-content:space-between;gap:20px;position:relative;z-index:1}