.mg-about { overflow: hidden; background: #f4f7f9; color: #0a2436; }
.mg-about__wrap { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.mg-about__hero { position: relative; min-height: min(660px, 82vh); display: grid; align-items: end; padding: 160px 0 86px; background: #08263a; color: #fff; isolation: isolate; }
.mg-about__hero::before { content: "MEGAGEN"; position: absolute; inset: auto -3vw -4vw auto; z-index: -1; color: rgba(255,255,255,.045); font: 800 clamp(120px, 22vw, 330px)/.72 Arial, sans-serif; letter-spacing: -.08em; }
.mg-about__hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(circle at 15% 20%, rgba(21,141,205,.28), transparent 32%), linear-gradient(120deg, transparent, rgba(0,0,0,.22)); }
.mg-about__eyebrow,.mg-about__kicker { margin: 0 0 18px; color: #5fbdea; font-size: 12px; font-weight: 800; letter-spacing: .12em; }
/* On the light sections the sky-blue kicker measured 1.8:1; it stays sky-blue only on the dark hero, missions and contact bands. */
.mg-about__kicker { color: #0a6aa6; }
.mg-about__contact .mg-about__kicker,
[data-theme="dark"] .mg-about__kicker { color: #79d1f6; }
.mg-about__hero h1 { max-width: 760px; margin: 0; font-size: clamp(44px, 7vw, 88px); line-height: 1.05; letter-spacing: -.06em; text-wrap: balance; }
.mg-about__lead { max-width: 650px; margin: 28px 0 0; color: #d6e4eb; font-size: clamp(18px, 2vw, 23px); line-height: 1.9; }
.mg-about__hero-links { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; margin-top: 34px; }
.mg-about__hero-links > a:not(.btn-primary) { color: #fff; font-weight: 750; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.55); }
.mg-about__intro { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: clamp(34px, 8vw, 124px); padding-block: clamp(72px, 11vw, 148px); }
.mg-about h2 { margin: 0; font-size: clamp(29px, 4vw, 52px); line-height: 1.2; letter-spacing: -.045em; text-wrap: balance; }
.mg-about__copy { max-width: 630px; color: #425e6e; font-size: 17px; line-height: 2; }
.mg-about__copy p { margin: 0 0 18px; }
.mg-about__vision { padding-block: clamp(72px, 10vw, 130px); background: #e7f0f4; }
.mg-about__vision .mg-about__wrap,.mg-about__heritage { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: clamp(34px, 8vw, 124px); }
.mg-about__missions { padding-block: clamp(70px, 10vw, 136px); background: #0b2a3e; color: #fff; }
.mg-about__missions > .mg-about__wrap { display: grid; grid-template-columns: minmax(0,.78fr) minmax(0,1.22fr); gap: clamp(34px, 8vw, 112px); }
.mg-about__missions .mg-about__kicker { color: #79d1f6; }
.mg-about__mission-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); border-block: 1px solid rgba(201,229,240,.22); }
.mg-about__mission-grid article { padding: 25px clamp(15px,2vw,30px) 30px; border-inline-start: 1px solid rgba(201,229,240,.22); }
.mg-about__mission-grid article:first-child { border-inline-start: 0; }
.mg-about__mission-grid span { display:block; margin-bottom:42px; color:#7bd3f8; font-weight:800; font-size:12px; }
.mg-about__mission-grid h3 { margin:0 0 14px; font-size:20px; line-height:1.45; }
.mg-about__mission-grid p { margin:0; color:#bad0dc; font-size:14px; line-height:2; }
.mg-about__heritage { padding-block: clamp(72px, 10vw, 140px); }
.mg-about__source { display:inline-flex; gap:8px; margin-top:10px; padding-bottom:5px; color:#0067b1; font-size:15px; font-weight:800; text-decoration:none; border-bottom:1px solid currentColor; }
.mg-about__principles { padding-block: clamp(64px, 9vw, 116px); background: #dfeaf0; }
.mg-about__grid { display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 0; margin-top: 34px; border-block: 1px solid #aec4d0; }
.mg-about__grid article { padding: 30px clamp(20px, 3vw, 46px) 36px; border-inline-start: 1px solid #aec4d0; }
.mg-about__grid article:first-child { border-inline-start: 0; }
.mg-about__grid span { display: block; margin-bottom: 48px; color: #065f96; font: 800 12px/1 Arial,sans-serif; }
.mg-about__grid h2 { font-size: clamp(23px, 2.6vw, 34px); }
.mg-about__grid p { color: #4f6876; font-size: 15px; line-height: 1.9; }
.mg-about__systems { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 64px; padding-block: clamp(72px, 11vw, 148px); }
.mg-about__systems-list { border-top: 1px solid #b6c8d1; }
.mg-about__systems-list a { display: grid; grid-template-columns: 1fr auto auto; gap: 16px; align-items: center; min-height: 82px; padding: 14px 6px; border-bottom: 1px solid #b6c8d1; color: inherit; text-decoration: none; transition: padding .28s ease, color .28s ease, background-color .28s ease; }
.mg-about__systems-list a:hover { padding-inline: 17px 6px; background: rgba(0,103,177,.06); color: #0067b1; }
.mg-about__systems-list b { font-size: 20px; }.mg-about__systems-list span { color: #5b7482; font-size: 14px; }.mg-about__systems-list i { color: #0876ba; font-style: normal; font-size: 20px; }
.mg-about__contact { padding-block: 48px; background: #0a2436; color: #fff; }.mg-about__contact .mg-about__wrap { display: grid; grid-template-columns: 1.2fr .8fr; gap: 50px; align-items: end; }.mg-about__contact h2 { max-width: 670px; font-size: clamp(27px, 4vw, 46px); }.mg-about__contact-list { display: grid; gap: 9px; justify-items: start; color: #b7cad4; }.mg-about__contact-list a { color: #fff; font-size: 16px; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.3); }
[data-theme="dark"] .mg-about { background: #091926; color: #eaf3f8; }
[data-theme="dark"] .mg-about__hero { background: #061521; }
[data-theme="dark"] .mg-about__hero::after { background: radial-gradient(circle at 15% 20%, rgba(30,143,205,.22), transparent 34%), linear-gradient(120deg, transparent, rgba(0,0,0,.42)); }
[data-theme="dark"] .mg-about__copy { color: #c0d1db; }
[data-theme="dark"] .mg-about__vision { background:#102838; }
[data-theme="dark"] .mg-about__missions { background:#061a29; }
[data-theme="dark"] .mg-about__source { color:#7bd3f8; }
[data-theme="dark"] .mg-about__principles { background: #102838; }
[data-theme="dark"] .mg-about__grid { border-color: rgba(183,211,225,.2); }
[data-theme="dark"] .mg-about__grid article { border-color: rgba(183,211,225,.2); }
[data-theme="dark"] .mg-about__grid p { color: #b7cbd7; }
[data-theme="dark"] .mg-about__systems-list { border-color: rgba(183,211,225,.24); }
[data-theme="dark"] .mg-about__systems-list a { border-color: rgba(183,211,225,.24); color: #eaf3f8; }
[data-theme="dark"] .mg-about__systems-list a:hover { background: rgba(71,165,220,.12); color: #83d1fa; }
[data-theme="dark"] .mg-about__systems-list span { color: #b1c8d4; }
@media (max-width: 720px) { .mg-about__wrap{width:calc(100% - 36px)}.mg-about__hero{min-height:560px;padding:136px 0 70px}.mg-about__intro,.mg-about__vision .mg-about__wrap,.mg-about__heritage,.mg-about__missions > .mg-about__wrap,.mg-about__systems,.mg-about__contact .mg-about__wrap{grid-template-columns:1fr;gap:36px}.mg-about__grid,.mg-about__mission-grid{grid-template-columns:1fr}.mg-about__grid article,.mg-about__mission-grid article{border-inline-start:0;border-block-start:1px solid #aec4d0}.mg-about__grid article:first-child,.mg-about__mission-grid article:first-child{border-block-start:0}.mg-about__grid span,.mg-about__mission-grid span{margin-bottom:24px}.mg-about__systems-list a{grid-template-columns:1fr auto}.mg-about__systems-list span{grid-column:1;grid-row:2}.mg-about__systems-list i{grid-column:2;grid-row:1 / span 2}.mg-about__contact{padding-bottom:112px;} }