/* About page: hero, story, values, timeline, capabilities, corporate info, CTA. */
.about-heading{margin-bottom:2.2rem;text-align:center}
.about-heading h2{display:inline-block;margin:0;padding-bottom:.7rem;border-bottom:3px solid var(--bm-red);color:var(--bm-green);font-size:clamp(1.6rem,2.4vw,2.2rem);font-weight:800;letter-spacing:-.03em}

.about-hero{background:linear-gradient(112deg,#fffdf7 0%,#f7faf3 62%,#fff 100%)}
.about-hero-copy{padding:3.6rem 2.5rem 3.6rem 0}
.about-hero-copy h1{margin:0 0 1.3rem;color:var(--bm-green);font-size:clamp(2.2rem,4vw,3.6rem);font-weight:800;line-height:1.12;letter-spacing:-.045em}
.about-hero-copy h1 span{color:var(--bm-green)}
.about-hero-copy p{max-width:34rem;margin:0 0 2rem;color:#59655f;font-size:1rem;line-height:1.7}
.about-hero-actions{display:flex;flex-wrap:wrap;gap:.8rem}
.about-hero-visual{align-self:stretch}
.about-hero-visual img{display:block;width:100%;height:100%;object-fit:cover;border-radius:0 0 0 2.5rem}

.about-story-photo{overflow:hidden;border-radius:16px;aspect-ratio:4/3}
.about-story-photo img{display:block;width:100%;height:100%;object-fit:cover}
.about-mark{display:block;margin-bottom:.6rem;color:var(--bm-red);font-size:1.7rem}
.about-story-copy h2{margin:0 0 1rem;color:var(--bm-green);font-size:clamp(1.5rem,2.2vw,2rem);font-weight:800;letter-spacing:-.03em}
.about-story-copy p{margin:0 0 1rem;color:#5f6a64;font-size:.94rem;line-height:1.75}
.about-story-link{display:inline-flex;align-items:center;gap:.4rem;color:var(--bm-green);font-size:.9rem;font-weight:800;text-decoration:none}
.about-story-link:hover{color:var(--bm-red)}

.about-values{background:#fafaf8}
.about-value-card{height:100%;padding:1.6rem 1.4rem;border:1px solid var(--bm-line);border-radius:14px;background:#fff}
.about-value-card i{display:block;margin-bottom:1rem;color:var(--bm-red);font-size:1.9rem}
.about-value-card h3{margin:0 0 .5rem;color:var(--bm-green);font-size:1.05rem;font-weight:800}
.about-value-card p{margin:0;color:#78827c;font-size:.84rem;line-height:1.6}

/* One flex row of steps; the connector is a line behind the badges. */
.timeline-track{position:relative;display:flex;gap:1rem;margin:0;padding:0;list-style:none;overflow-x:auto;scroll-snap-type:x proximity}
.timeline-track:before{content:"";position:absolute;top:34px;left:0;right:0;border-top:1px dashed #cfd8d3}
.timeline-step{position:relative;flex:1 0 12.5rem;scroll-snap-align:start;text-align:center}
.timeline-badge{position:relative;z-index:1;display:grid;place-items:center;width:68px;height:68px;margin:0 auto 1rem;border:1px solid var(--bm-line);border-radius:50%;background:#fff;color:var(--bm-green);font-size:1.5rem}
.timeline-step.is-current .timeline-badge{border-color:var(--bm-green);background:var(--bm-green);color:#fff}
.timeline-step h3{margin:0 0 .45rem;color:var(--bm-green);font-size:.95rem;font-weight:800}
.timeline-step p{margin:0 auto;max-width:13rem;color:#78827c;font-size:.8rem;line-height:1.55}

.capability-card{display:block;height:100%;overflow:hidden;border:1px solid var(--bm-line);border-radius:14px;background:#fff;color:inherit;text-decoration:none}
.capability-card:hover{border-color:var(--bm-red)}
.capability-card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.capability-body{position:relative;display:block;padding:1.1rem 3.2rem 1.2rem 1.2rem}
.capability-body strong{display:block;margin-bottom:.35rem;color:var(--bm-green);font-size:1rem}
.capability-body small{display:block;color:#78827c;font-size:.82rem;line-height:1.55}
.capability-body i{position:absolute;top:1.1rem;right:1.1rem;display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--bm-line);border-radius:50%;color:var(--bm-green);font-size:.9rem}
.capability-card:hover .capability-body i{border-color:var(--bm-red);background:var(--bm-red);color:#fff}

.about-corporate{background:#fafaf8}
.corporate-card{display:flex;align-items:flex-start;gap:.9rem;height:100%;padding:1.3rem;border:1px solid var(--bm-line);border-radius:14px;background:#fff}
.corporate-card i{flex:none;color:var(--bm-green);font-size:1.5rem}
.corporate-card strong{display:block;margin-bottom:.3rem;color:var(--bm-green);font-size:.98rem}
.corporate-card small{display:block;color:#78827c;font-size:.82rem;line-height:1.55}

.about-cta-wrap{padding:0 0 4rem}
.about-cta{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.2rem;overflow:hidden;padding:2.2rem 2.4rem;border-radius:16px;background:linear-gradient(120deg,var(--bm-green-bg),var(--bm-green-deep));color:#fff}
.about-cta:after{content:"";position:absolute;right:-2rem;bottom:-3rem;width:15rem;height:15rem;opacity:.12;pointer-events:none;background:#fff;-webkit-mask:url('/assets/images/header/mega-bg.svg') center/contain no-repeat;mask:url('/assets/images/header/mega-bg.svg') center/contain no-repeat}
.about-cta>div{position:relative;z-index:1}
.about-cta h2{margin:0 0 .4rem;font-size:clamp(1.3rem,2.2vw,1.8rem);font-weight:800;letter-spacing:-.03em}
.about-cta p{margin:0;font-size:.9rem;color:rgba(255,255,255,.85)}
.about-cta .btn{position:relative;z-index:1;flex:none}

@media(max-width:991.98px){
    .about-hero-copy{padding:2.4rem 0 2rem}
    .about-hero-visual img{border-radius:0;aspect-ratio:16/9}
    .timeline-track{padding-bottom:.8rem}
}
@media(max-width:575.98px){
    .about-hero-actions .btn{width:100%}
    .about-cta{padding:1.6rem 1.4rem}
    .about-cta .btn{width:100%}
}