/* V2: typographic opening and a scroll-linked transition into education. */
.home-impact { --impact-ink:#090b09; --impact-paper:#f1f0e8; --impact-lime:#d3fa42; background:var(--impact-ink); }
html.light .home-impact { background:var(--impact-paper); }
.home-impact > .nav {
  position:fixed; top:0; left:0; right:0; z-index:20;
  max-width:none; min-height:78px; padding:20px var(--edge);
  background:rgba(17,18,15,.94); border-bottom:1px solid #393a32;   /* 처음부터 내부 페이지와 같은 머리 (2026-09-16 은아님, 세 안 비교 후 B) */
}
/* 스크롤이 시작되면 띠가 생긴다 — js/home-abstract.js 가 body 에 is-scrolled 를 붙인다 */
/* is-scrolled 띠는 이제 필요 없다(처음부터 띠) — js 가 붙이는 클래스는 무해 */   /* 내부 페이지 메뉴와 같은 띠·선 (2026-09-16) */
.home-impact > .nav .nav__logo { color:var(--impact-paper); font-family:'Playfair Display','Noto Sans KR',Georgia,serif; font-size:21px; font-weight:700; letter-spacing:.02em; text-shadow:0 1px 2px rgba(9,11,9,.9), 0 2px 12px rgba(9,11,9,.8); }
.home-impact > .nav .nav__link { color:#e6e8dd; font-size:13px; text-shadow:0 1px 2px rgba(9,11,9,.9), 0 2px 12px rgba(9,11,9,.8); }
.home-impact > .nav .nav__link--active { border-color:var(--impact-lime); }
.home-impact > .nav .nav__burger { color:var(--impact-paper); }
.home-impact > .nav .nav__link:last-child { padding:9px 18px; border-radius:30px; background:var(--impact-lime); color:var(--impact-ink); text-shadow:none; }
.home-impact > .nav .nav__links { align-items:center; }
.home-impact .page-content { animation:none; }
.impact { background:var(--impact-ink); color:var(--impact-paper); }
.impact__stage { position:relative; }
.impact__opening, .impact__field { position:relative; height:100svh; min-height:680px; overflow:hidden; }
.impact__art, .impact__classroom { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.impact__art { object-position:48% center; will-change:transform; transition:transform 260ms ease-out; }
.impact__shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(9,11,9,.74),rgba(9,11,9,.38) 55%,rgba(9,11,9,.16) 100%),linear-gradient(180deg,rgba(9,11,9,.66),transparent 24%),linear-gradient(0deg,rgba(9,11,9,.92),transparent 44%); }
.impact__eyebrow { position:absolute; top:17%; left:var(--edge); right:var(--edge); display:flex; flex-direction:column; align-items:flex-start; gap:10px; margin:0; font-family:'Playfair Display','Noto Sans KR',Georgia,serif; font-size:13px; letter-spacing:.14em; color:#e8eadf; text-shadow:0 1px 2px rgba(9,11,9,.9), 0 2px 14px rgba(9,11,9,.85); }
.impact__eyebrow span { font-family:'Noto Sans KR',sans-serif; letter-spacing:.03em; font-size:13px; color:#f1f0e8; }
.impact__title { position:absolute; top:24%; left:var(--edge); right:var(--edge); margin:0; font-family:'Noto Sans KR',sans-serif; font-size:clamp(64px,8.4vw,140px); line-height:1.16; letter-spacing:-.04em; font-weight:900; transform-origin:45% 50%; transition:transform 320ms ease-out; text-shadow:0 1px 1px rgba(9,11,9,.55), 0 3px 10px rgba(9,11,9,.5); }
.impact__title > span { display:block; }
/* 윤곽선 글자: 획이 겹치는 자리에 안쪽 선이 생기므로 채움을 잉크색으로 두고 paint-order 로 덮는다 (2026-09-16 은아님 캐처) */
.impact__title > .impact__outline { padding-left:13%; color:#0b0c0a; -webkit-text-stroke:2px #f1f0e8; paint-order:stroke fill; text-shadow:none; transition:color 380ms ease; }
/* 제목에 마우스를 올리면 윤곽선 글자가 채워진다 (마우스 있는 기기만) */
@media (hover:hover) and (pointer:fine) { .impact__title:hover > .impact__outline { color:#f1f0e8; } }
.impact__title > .impact__last { padding-left:43%; }
.impact__bottom { position:absolute; bottom:5%; left:var(--edge); right:var(--edge); display:flex; align-items:flex-end; justify-content:space-between; gap:24px; }
.impact__bottom p { font-size:15px; font-weight:500; line-height:1.75; color:#ebeadf; margin:0; text-shadow:0 1px 2px rgba(9,11,9,.9), 0 2px 18px rgba(9,11,9,.95); }
.impact__bottom a { text-decoration:none; }
.impact__cta { display:inline-flex; gap:30px; align-items:center; background:var(--impact-lime); color:var(--impact-ink); border-radius:40px; padding:18px 26px; font-size:15px; font-weight:700; }
.impact__cta span { font-size:23px; line-height:1; transition:transform 220ms ease; }
.impact__cta:hover span { transform:translate(3px,-3px); }
.impact__cta:hover { background:#e3ff80; }
.impact__scroll { display:flex; align-items:center; gap:16px; color:var(--impact-paper); font-size:13px; min-height:48px; padding:10px 18px; border-radius:30px; background:rgba(9,11,9,.62); border:1px solid rgba(241,240,232,.18); text-shadow:0 1px 2px rgba(9,11,9,.9), 0 2px 14px rgba(9,11,9,.85); }
.impact__scroll span { font-size:24px; animation:impactNudge 1.8s ease-in-out infinite; }
@keyframes impactNudge { 0%, 100% { transform:translateY(0); } 50% { transform:translateY(4px); } }
.impact__field-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(5,13,8,.88),rgba(5,13,8,.58) 45%,rgba(5,13,8,.13)),linear-gradient(0deg,rgba(5,13,8,.5),transparent 50%); }
.impact__field-copy { position:relative; padding:clamp(120px,18vh,200px) 6vw 90px; }
.impact__label { color:var(--impact-lime); font-size:11px; letter-spacing:.16em; margin:0 0 38px; }
.impact__field-copy h2 { font-family:'Noto Sans KR',sans-serif; font-size:clamp(44px,5.4vw,88px); font-weight:700; line-height:1.22; letter-spacing:-.06em; margin:0 0 32px; }
.impact__field-copy em { color:var(--impact-lime); font-style:normal; }
.impact__field-copy > p:not(.impact__label) { color:#e0e4d9; font-size:15px; line-height:1.8; }
.impact__field-copy a { display:inline-flex; align-items:center; gap:50px; color:var(--impact-paper); text-decoration:none; border-bottom:1px solid #c1c6af; padding:16px 0; margin-top:20px; font-size:14px; }
.impact__caption { position:absolute; bottom:24px; right:4vw; color:#e0e4d9; font-size:10px; }
.impact__progress { display:none; }
.impact a:focus-visible, .impact-intro a:focus-visible { outline:3px solid var(--impact-lime); outline-offset:6px; }
/* Sticky is enabled only after the motion controller is ready. */
.impact.is-motion { height:210svh; }
.impact.is-motion .impact__stage { position:sticky; top:0; height:100svh; min-height:680px; overflow:hidden; }
.impact.is-motion .impact__title > span:nth-child(n+2), .impact.is-motion .impact__bottom > p, .impact.is-motion .impact__cta { opacity:0; }
.impact.is-motion .impact__opening, .impact.is-motion .impact__field { position:absolute; inset:0; height:100%; min-height:0; }
.impact.is-motion .impact__field { opacity:0; }
.impact.is-motion .impact__progress { display:block; position:absolute; bottom:0; left:0; width:100%; height:3px; background:#33372c; z-index:5; }
.impact__progress span { display:block; height:100%; background:var(--impact-lime); transform:scaleX(0); transform-origin:left; }
.impact-intro { background:var(--impact-lime); color:var(--impact-ink); padding:90px 6vw; }
.impact-intro__heading { display:grid; grid-template-columns:1fr 2fr; gap:36px; align-items:start; }
.impact-intro__heading > span { padding-top:12px; font-size:11px; letter-spacing:.12em; }
.impact-intro h2 { font-size:clamp(30px,4vw,60px); line-height:1.3; letter-spacing:-.06em; margin:0 0 60px; }
.impact-intro__body { display:grid; grid-template-columns:1fr 1fr; gap:7vw; align-items:center; }
.impact-intro__body img { display:block; width:100%; height:auto; }
.impact-intro__body p { font-size:16px; line-height:1.9; }
.impact-intro__body p:first-child { font-weight:700; }
.impact-intro__body a { display:inline-flex; align-items:center; gap:50px; color:inherit; text-decoration:none; border-bottom:1px solid currentColor; padding:12px 0; }
.home-impact .home--landing { padding-top:80px; }
.home-impact .home-tabs { border-color:#aaa; }
html.light .home-impact .home-tabs__btn[aria-pressed="true"] { border-color:#262b1e; }
.home-impact .fab { z-index:25; }
.home-impact:not(.impact-past) .fab { visibility:hidden; pointer-events:none; }
@media (max-width: 800px) {
  .impact__title { top:28%; font-size:9vw; }
  .impact__title > .impact__last { padding-left:33%; }
  .impact__bottom { flex-wrap:wrap; }
  .impact__bottom p { max-width:45%; }
  .impact-intro__heading { grid-template-columns:1fr; gap:20px; }
  .impact-intro__heading > span { padding:0; }
}
@media (max-width: 520px) {
  .home-impact > .nav { min-height:70px; padding:16px 22px; background:rgba(9,11,9,.8); }
  .home-impact > .nav .nav__links { align-items:stretch; background:#090b09; }
  .impact__opening, .impact__field, .impact.is-motion .impact__stage { min-height:650px; }
  .impact__art { object-position:62% center; opacity:.8; }
  .impact__shade { background:linear-gradient(90deg,rgba(9,11,9,.5),transparent),linear-gradient(0deg,#090b09,transparent 60%); }
  .impact__eyebrow { left:var(--edge); right:var(--edge); top:17%; font-size:11px; }
  .impact__eyebrow span { font-size:11px; }
  .impact__title { top:30%; left:var(--edge); right:var(--edge); font-size:12.4vw; line-height:1.28; }
  .impact__title > .impact__outline { padding-left:12%; }
  .impact__title > .impact__last { padding-left:31%; }
  .impact__bottom { left:var(--edge); right:var(--edge); bottom:5%; gap:18px; }
  .impact__bottom p { max-width:none; width:100%; font-size:14px; }
  .impact__cta { padding:14px 17px; font-size:13px; gap:16px; }
  .impact__scroll { gap:10px; font-size:12px; }
  .impact.is-motion { height:170svh; }
  .impact__field-copy { padding:140px 6vw 65px; }
  .impact__field-copy h2 { font-size:10.2vw; }
  .impact__field-copy > p:not(.impact__label) { font-size:13px; }
  .impact__classroom { object-position:75% center; }
  .impact__field-shade { background:rgba(5,13,8,.67); }
  .impact-intro { padding:55px 6vw; }
  .impact-intro h2 { font-size:29px; margin-bottom:30px; }
  .impact-intro__body { grid-template-columns:1fr; gap:20px; }
  .impact-intro__body p { font-size:14px; }
}
@media (max-height: 680px) and (min-width: 521px) {
  .impact__opening, .impact__field, .impact.is-motion .impact__stage { min-height:540px; }
  .impact__title { font-size:min(8vw,100px); top:24%; }
  .impact__field-copy { padding-top:80px; }
  .impact__field-copy h2 { font-size:48px; }
}
@media (prefers-reduced-motion: reduce) {
  .impact__scroll span { animation:none; }
  .impact__art, .impact__title, .impact__title > .impact__outline, .impact__cta span { transition:none !important; }
  .impact__title > span, .impact__bottom > p, .impact__cta { opacity:1 !important; transform:none !important; }
  .impact__art, .impact__title, .impact__classroom, .impact__field-copy { transform:none !important; }
  .impact__opening, .impact__field { opacity:1 !important; }
  html:has(.home-impact) { scroll-behavior:auto; }
}