
.about-hero{position:relative;min-height:570px;background:linear-gradient(120deg,#f8fbf9,#eaf3ee);display:flex;align-items:center;overflow:hidden}
.about-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,calc(.56 + var(--about-overlay,.74)*.52)) 0%,rgba(255,255,255,calc(.34 + var(--about-overlay,.74)*.58)) 52%,rgba(0,92,103,.16) 100%)}
.about-hero-grid{position:relative;display:grid;grid-template-columns:1.15fr .7fr;gap:55px;align-items:center;padding-top:70px;padding-bottom:70px}
.about-copy h1{font-size:49px;line-height:1.07;letter-spacing:-.045em;margin:13px 0 18px;max-width:760px}
.about-copy>p{font-size:17px;color:#526b70;max-width:700px}.about-actions{display:flex;gap:11px;flex-wrap:wrap;margin-top:26px}
.about-story-card{background:rgba(0,63,72,.94);color:#fff;border-radius:22px;padding:30px;box-shadow:0 24px 55px rgba(0,53,60,.22)}.about-story-card>span{font-size:9px;color:#b9e77f;font-weight:900;letter-spacing:.12em}.about-story-card h2{font-size:27px;line-height:1.15;margin:9px 0}.about-story-card p{font-size:13px;color:#d3e5e6}.story-points{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:22px}.story-points i{font-style:normal;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:12px}.story-points b,.story-points span{display:block}.story-points b{color:#a7dc67;font-size:10px}.story-points span{font-size:9px;margin-top:3px}
.problem-section{background:#fff}.before-after{display:grid;grid-template-columns:1fr 1fr;gap:18px}.before-after article{border-radius:20px;padding:30px;border:1px solid #e0e9e7}.before{background:#fff8f5}.after{background:#f3f8ee}.small-label{font-size:9px;font-weight:900;letter-spacing:.12em;color:#b25e42}.green-label{color:#629c30}.before-after h3{font-size:26px;margin:8px 0 18px}.before-after ul{list-style:none;padding:0;margin:0}.before-after li{font-size:13px;padding:10px 0;border-bottom:1px solid rgba(0,0,0,.06)}.before li:before{content:"×";color:#bd5b45;font-weight:900;margin-right:9px}.after li:before{content:"✓";color:#659e32;font-weight:900;margin-right:9px}
.pillars{background:#f7faf8}.pillar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.pillar-grid article{background:#fff;border:1px solid #dfe9e7;border-radius:18px;padding:25px}.pillar-grid i{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#eef5e9;color:#609d2e;font-style:normal;font-size:19px}.pillar-grid h3{font-size:18px;margin:14px 0 7px}.pillar-grid p{font-size:13px;color:#708386;margin:0}
.history-section{background:linear-gradient(135deg,#003f48,#00606b);color:#fff}.history-grid{display:grid;grid-template-columns:1fr .75fr;gap:55px;align-items:center}.history-grid h2{font-size:37px;line-height:1.12;letter-spacing:-.035em}.history-grid p{color:#cae0e1}.history-list{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:22px;font-size:12px}.history-list span{color:#d7e8e9}.timeline-card{background:#fff;color:#163b41;border-radius:20px;padding:24px}.timeline-head{font-weight:900;font-size:18px;border-bottom:1px solid #e8efed;padding-bottom:14px;margin-bottom:7px}.timeline-card article{display:grid;grid-template-columns:15px 1fr;gap:10px;padding:12px 0;border-bottom:1px solid #edf1ef}.timeline-card i{width:9px;height:9px;border-radius:50%;background:#80C342;margin-top:5px;box-shadow:0 0 0 5px #edf6e6}.timeline-card b,.timeline-card span{display:block}.timeline-card b{font-size:10px;color:#5b9830}.timeline-card span{font-size:11px;color:#667c80;margin-top:3px}
.roles-section{background:#fff}.roles-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.roles-grid article{border:1px solid #dfe9e7;border-radius:18px;padding:25px}.role-icon{font-size:25px}.roles-grid h3{margin:12px 0 6px}.roles-grid p{font-size:13px;color:#718487;margin:0}
.about-cta{padding:45px 0;background:#eef5e8}.about-cta .container{display:flex;align-items:center;justify-content:space-between;gap:30px}.about-cta span{font-size:10px;color:#629d31;font-weight:900;letter-spacing:.11em}.about-cta h2{font-size:30px;margin:7px 0}
@media(max-width:900px){.about-hero-grid,.history-grid{grid-template-columns:1fr}.about-story-card{max-width:650px}.pillar-grid,.roles-grid{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.about-hero-grid{padding-top:45px;padding-bottom:45px}.about-copy h1{font-size:36px}.before-after,.pillar-grid,.roles-grid{grid-template-columns:1fr}.history-grid h2{font-size:30px}.history-list{grid-template-columns:1fr}.about-cta .container{flex-direction:column;align-items:flex-start}}
