.about-hero { padding: 82px 0 76px; background: linear-gradient(135deg, #fffdee 0%, #e2fbce 55%, #e3ef26 100%); }
.about-hero .eyebrow { display: inline-block; font-size: 12px; font-weight: 800; color: var(--primary); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 10px; }
.about-hero h1 { font-size: clamp(34px, 5vw, 58px); margin-bottom: 14px; }
.about-hero p { max-width: 680px; color: #4e6159; font-size: 15px; }
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 46px; align-items: center; }
.about-grid p { color: var(--text-muted); font-size: 14px; margin-top: 12px; }
.about-grid .eyebrow { display: inline-block; color: var(--primary); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 8px; }
.about-grid h2 { font-size: clamp(24px, 3vw, 35px); }
.about-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-sm); }
.about-card img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.about-card strong, .about-card span { display: block; padding: 0 20px; }
.about-card strong { font-family: var(--font-display); font-size: 21px; margin-top: 17px; color: var(--primary-dark); }
.about-card span { font-size: 12px; color: var(--text-muted); margin: 3px 0 20px; }
.about-points { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.about-points > div { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-md); padding: 22px; }
.about-points b { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--accent); color: var(--primary-dark); font-size: 11px; margin-bottom: 13px; }
.about-points h3 { font-size: 15px; margin-bottom: 6px; }
.about-points p { color: var(--text-muted); font-size: 12.5px; }
@media (max-width: 760px) { .about-grid { grid-template-columns: 1fr; gap: 28px; } .about-points { grid-template-columns: 1fr; } .about-hero { padding: 60px 0; } }