/* About Us (T9) — 문구 출처: KOITA IR s07–08·s05(지역만), 국문리뉴얼 s05, v8 §3. 미승인 수치(1~2주·10배)·협력기관명·연구진 실명 제외
   History는 [organo_history]('연혁' 카테고리 글) — 관리자가 글을 추가하면 자동 반영 */
html .bde-section:has(.oa){padding:0}
html .bde-section:has(.oa)>.section-container{max-width:none;padding:0}
.oa{width:100%;font-family:var(--bde-body-font-family);color:var(--organo-ink)}
.oa p{margin:0}
.oa-in{max-width:var(--bde-section-width);margin:0 auto;padding:0 var(--bde-section-horizontal-padding)}
.oa-sec{padding:var(--bde-section-vertical-padding) 0;scroll-margin-top:calc(var(--organo-header-h) + 56px)}
.oa-sec.is-tint{background:var(--organo-light-bg)}
.oa h2{font-family:var(--bde-heading-font-family);font-size:var(--bde-h2-font-size);line-height:1.2;margin:12px 0 16px}
.oa h3{font-size:19px;line-height:1.35;margin:0 0 8px}
.oa-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--min,260px)),1fr));gap:20px;margin-top:40px}
.oa-card{background:#fff;border:1px solid var(--organo-stroke);border-radius:var(--organo-radius);padding:28px}
.oa-card p{font-size:15px;line-height:1.65;color:var(--organo-ink-2)}
.oa-tag{display:inline-block;font:700 12px/1 var(--bde-heading-font-family);letter-spacing:.08em;color:var(--organo-blue);margin-bottom:14px}

/* Intro — 풀스크린 브랜드 영역(고객 10/24). 파스텔 영상 + 남색 글자(고객 10/26 「메인보다 너무 어둡다」).
   영상은 organo-ui.js가 넣는다(국·영) — 넣기 전·모션 줄이기에도 같은 톤이 되게 바탕도 파스텔 그라디언트 */
.oa-intro{position:relative;overflow:hidden;isolation:isolate;min-height:calc(100svh - var(--organo-header-h));display:flex;align-items:center;padding:clamp(72px,10vw,128px) 0 clamp(56px,7vw,88px);background:linear-gradient(110deg,#e6defa 0%,#f6dbe9 55%,#dce8fa 100%);color:var(--organo-ink)}
.oa-intro > .oa-in{width:100%}
html .oa-intro h1{color:var(--organo-navy);font-family:var(--bde-heading-font-family);font-size:clamp(36px,5.2vw,64px);line-height:1.1;letter-spacing:-.02em;margin:14px 0 20px;max-width:900px}
.oa-intro .organo-eyebrow{color:var(--organo-blue)}
.oa-intro .organo-lead{color:#2C4657;max-width:760px}
.oa-intro__video{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}
/* 원색을 살린 영상(about-hero-v3, 고객 10/27 「영상이 너무 흐리다」) + 흰빛은 글자 뒤에만.
   덮개를 글자 칸 둘레로 좁히고 글자에 흰 번짐을 둘러, 영상이 진한 장면에서도 남색 글자가 읽히게 한다(대비 최저 4.7:1) */
.oa-intro::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 60% 75% at 24% 40%,rgb(255 255 255 / .7) 0%,rgb(255 255 255 / .5) 50%,rgb(255 255 255 / 0) 100%)}
.oa-intro :is(h1,.oa-intro__ko,.organo-lead,.organo-eyebrow){text-shadow:0 0 2px rgb(255 255 255 / .7),0 0 18px rgb(255 255 255 / .85)}
@media (max-width:900px){.oa-intro::before{background:linear-gradient(180deg,rgb(255 255 255 / .5) 0%,rgb(255 255 255 / .46) 45%,rgb(255 255 255 / .12) 100%)}}
.oa-intro__ko{font-size:clamp(18px,2vw,24px);font-weight:700;line-height:1.4;color:var(--organo-navy);margin:-6px 0 16px}
/* 4개 박스 — 라벨 / 핵심어 / 설명(고객 10/26) */
.oa-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:56px}
.oa-fact{border:1px solid rgb(11 31 68 / .1);background:rgb(255 255 255 / .74);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:var(--organo-radius);padding:22px}
.oa-fact b{display:block;font-size:12px;letter-spacing:.06em;color:var(--organo-blue);margin-bottom:8px}
.oa-fact span{display:block;font-size:19px;font-weight:700;line-height:1.3;color:var(--organo-navy)}
.oa-fact small{display:block;margin-top:4px;font-size:14px;line-height:1.45;color:#2C4657}

/* Overview */
.oa-overview{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:start}
.oa-overview .organo-lead + p{margin-top:16px;color:var(--organo-ink-2);line-height:1.75}
.oa-platforms{display:grid;gap:12px}
.oa-platform{display:grid;grid-template-columns:150px 1fr;gap:16px;align-items:center;background:#fff;border:1px solid var(--organo-stroke);border-radius:var(--organo-radius);padding:20px 22px}
.oa-platform strong{font-family:var(--bde-heading-font-family);font-size:17px;color:var(--organo-blue)}
.oa-platform p{font-size:15px;color:var(--organo-ink-2)}

/* Vision */
.oa-brand{margin-top:40px;padding:28px 32px;border-radius:var(--organo-radius-lg);background:var(--organo-grad);color:#fff;display:flex;flex-wrap:wrap;gap:8px 28px;align-items:baseline}
.oa-brand b{font-family:var(--bde-heading-font-family);font-size:clamp(22px,2.6vw,30px)}
.oa-brand span{color:rgb(255 255 255 / .85)}
.oa-card .oa-num{display:block;font:800 13px/1 var(--bde-heading-font-family);color:var(--organo-cyan);margin-bottom:16px}

/* Leadership */
.oa-ceo{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:48px;margin-top:40px;background:#fff;border:1px solid var(--organo-stroke);border-radius:var(--organo-radius-lg);padding:clamp(24px,4vw,44px)}
.oa-ceo h3{font-size:26px;margin:4px 0 16px}
.oa-ceo h3 small{display:block;font:700 13px/1 var(--bde-heading-font-family);letter-spacing:.08em;color:var(--organo-muted);margin-bottom:10px}
.oa-ceo ul{margin:0;padding:0;list-style:none}
.oa-comp{display:flex;flex-wrap:wrap;gap:8px}
.oa-comp li{font-size:14px;border:1px solid var(--organo-stroke);border-radius:999px;padding:6px 14px;background:var(--organo-light-bg);color:var(--organo-ink-2)}
.oa-career li{display:grid;grid-template-columns:56px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--organo-stroke);font-size:15px;color:var(--organo-ink-2)}
.oa-career li:last-child{border-bottom:0}
.oa-career b{font-family:var(--bde-heading-font-family);color:var(--organo-blue)}

/* Global */
.oa-ph{display:grid;place-items:center;min-height:80px;border-radius:12px;border:1px dashed var(--organo-stroke);background:repeating-linear-gradient(135deg,transparent 0 10px,rgb(11 31 68 / .04) 10px 11px);color:var(--organo-muted);font-size:13px}
/* 협력기관 제목 — 로고는 공용 .organo-partners(organo-ui.css) */
.oa-sub{display:flex;width:fit-content;margin:48px 0 0}
.oa-note{font-size:13px;color:var(--organo-muted);margin-top:16px!important}

/* CTA */
.oa-cta{background:var(--organo-grad);color:#fff;text-align:center}
html .oa-cta h2{color:#fff}
.oa-cta p{color:rgb(255 255 255 / .85)}
.oa-cta .button-atom{margin-top:28px}

@media (max-width:960px){
  .oa-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .oa-overview,.oa-ceo{grid-template-columns:1fr;gap:32px}
}
@media (max-width:560px){
  .oa-platform{grid-template-columns:1fr;gap:6px}
}
