.teachers-section{--teacher-blue:var(--blue,#0028f9);position:relative;isolation:isolate;overflow:hidden;background:#fff;color:var(--teacher-blue);padding:clamp(54px,6vw,96px) 0 20px;scroll-margin-top:95px;font-family:Pretendard,sans-serif}
.teachers-section::before,.teachers-section::after{content:none;display:none}
.teacher-background{position:absolute;inset:-40px;z-index:-1;filter:blur(28px);opacity:.17;pointer-events:none}
.teacher-background-mark{position:absolute;inset:0;background:#0028f9;mask:url('assets/media/hero-mark.webp') center/cover no-repeat;-webkit-mask:url('assets/media/hero-mark.webp') center/cover no-repeat;transform:scale(1.08)}
.teachers-heading{text-align:center;padding:0 22px;position:relative;z-index:2}
.teachers-eyebrow{display:block;font-size:10px;font-weight:700;letter-spacing:.17em;margin-bottom:16px;opacity:.65}
.teachers-heading h2{font-family:'Ria Sans',sans-serif;font-size:clamp(27px,3.35vw,48px);font-weight:800;letter-spacing:-.065em;line-height:1.25;margin:0 0 20px}
.teachers-heading p{font-size:clamp(12px,1.05vw,15px);line-height:1.65;font-weight:600;margin:0;letter-spacing:-.025em}
.teacher-composition{position:relative;width:min(1440px,100%);margin:26px auto 0;height:clamp(420px,44vw,635px)}
.teacher-portraits{position:absolute;inset:0}
.teacher-person{position:absolute;left:var(--teacher-left);top:var(--teacher-top);width:var(--teacher-width,29%);height:90%;padding:0;border:0;background:transparent;transform:translateX(-50%);cursor:pointer;z-index:var(--teacher-depth,1);transition:left 650ms cubic-bezier(.22,1,.36,1),top 650ms cubic-bezier(.22,1,.36,1),width 650ms cubic-bezier(.22,1,.36,1),opacity 650ms ease,filter 650ms ease,transform 650ms cubic-bezier(.22,1,.36,1);filter:grayscale(1);-webkit-tap-highlight-color:transparent}
.teacher-person img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;mask-image:linear-gradient(#000 0%,#000 71%,transparent 98%);-webkit-mask-image:linear-gradient(#000 0%,#000 71%,transparent 98%);pointer-events:none}
.teacher-person-free{--teacher-left:19%;--teacher-top:15%;--teacher-width:26%;--teacher-depth:2}
.teacher-person-zero{--teacher-left:35%;--teacher-top:-4%;--teacher-width:27%}
.teacher-person-ruda{--teacher-left:50%;--teacher-top:16%;--teacher-width:32%;--teacher-depth:4}
.teacher-person-jerry{--teacher-left:66%;--teacher-top:-5%;--teacher-width:27%}
.teacher-person-crystal{--teacher-left:82%;--teacher-top:16%;--teacher-width:27%;--teacher-depth:2}
.teacher-person:hover{filter:grayscale(.35);transform:translateX(-50%) translateY(-7px)}
.teacher-person:focus:not(:focus-visible){outline:none}
.teacher-person:focus-visible{outline:2px solid var(--teacher-blue);outline-offset:-10px;border-radius:45%}
.teacher-hover-label{position:absolute;z-index:30;display:flex;align-items:center;gap:6px;max-width:calc(100% - 24px);padding:9px 17px;border:1px solid #0028f914;border-radius:24px;background:#fff;box-shadow:0 4px 24px #0028f91f;color:var(--teacher-blue);font-family:Pretendard,sans-serif;white-space:nowrap;pointer-events:none;animation:teacher-label-in 140ms ease both}
.teacher-hover-label[hidden]{display:none}.teacher-hover-label strong{font-size:14px;font-weight:750}.teacher-hover-label small{font-size:10px;font-weight:600}
.teacher-head-target{display:none;position:absolute;left:var(--teacher-back-left);top:calc(var(--teacher-back-top) + 5%);transform:translateX(-50%);width:13%;height:29%;z-index:20;padding:0;border:0;background:transparent;cursor:pointer}
.teacher-head-target:focus{outline:none}
.has-selected-teacher .teacher-head-target:not(.is-selected){display:block}
.teacher-stage-hint{position:absolute;left:50%;bottom:0;transform:translateX(-50%);font-size:12px;letter-spacing:-.025em;white-space:nowrap;opacity:.7;transition:opacity 250ms}
.teacher-stage-hint span{display:inline-block;margin-left:5px}
.teacher-identity,.teacher-detail{position:absolute;top:47%;z-index:11;opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity 350ms ease,transform 500ms ease}
.teacher-identity{left:8%;width:26%;padding-right:12px}
.teacher-identity h3{font-family:'Ria Sans',sans-serif;letter-spacing:-.055em;font-size:clamp(29px,3.2vw,46px);margin:0;line-height:1.3;white-space:nowrap}
.teacher-identity h3 span{display:inline-block;font-size:clamp(13px,1.55vw,22px);margin-left:9px;padding-left:9px;border-left:3px solid var(--teacher-blue);line-height:1}
.teacher-identity i{display:block;position:relative;background:var(--teacher-blue);height:2px;width:100%;margin-top:10px}
.teacher-identity i::after{content:"";width:9px;height:9px;border-radius:50%;position:absolute;background:var(--teacher-blue);right:0;top:-3.5px}
.teacher-detail{right:6.5%;width:27.5%;top:45.5%}
.teacher-detail-actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:20px}
.teacher-detail-actions a{display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;padding:8px 18px;border-radius:40px;color:#fff;font-size:clamp(11px,.93vw,13px);font-weight:700;white-space:nowrap;transition:transform 180ms,box-shadow 180ms}
.teacher-detail-actions a:hover{transform:translateY(-3px);box-shadow:0 5px 16px #0028f920}
.teacher-detail-actions a:focus-visible{outline:2px solid var(--teacher-blue);outline-offset:4px}
.teacher-consult{background:var(--orange,#f37022)}.teacher-instagram{background:var(--teacher-blue)}
.teacher-detail ul{list-style:none;padding:0;margin:0;font-size:clamp(12px,1.2vw,17px);font-weight:650;letter-spacing:-.035em;line-height:1.65}
.teacher-detail li{position:relative;padding-left:12px}
.teacher-detail li::before{content:"·";position:absolute;left:0;font-weight:800}
.teacher-reset{position:absolute;right:7%;bottom:5%;z-index:12;border:0;background:transparent;color:var(--teacher-blue);font:600 12px Pretendard,sans-serif;cursor:pointer;padding:10px}
.teacher-reset span{margin-right:5px;font-size:17px}.teacher-reset:hover{text-decoration:underline}
.teacher-reset[hidden]{display:none}
.has-selected-teacher .teacher-person{left:var(--teacher-back-left);top:var(--teacher-back-top);z-index:1;opacity:.15;filter:grayscale(1);transform:translateX(-50%) scale(.94)}
.has-selected-teacher .teacher-person:hover{opacity:.36}
.has-selected-teacher .teacher-person.is-selected{left:50%;top:7%;width:34%;z-index:10;opacity:1;filter:grayscale(0);transform:translateX(-50%) scale(1.06);pointer-events:none!important}
.has-selected-teacher .teacher-person.is-selected img{opacity:1;mask-image:linear-gradient(#000 0%,#000 82%,transparent 100%);-webkit-mask-image:linear-gradient(#000 0%,#000 82%,transparent 100%)}
.has-selected-teacher .teacher-identity,.has-selected-teacher .teacher-detail{opacity:1;transform:translateY(0);pointer-events:none;transition-delay:210ms}
.has-selected-teacher .teacher-detail-actions a{pointer-events:auto}
.has-selected-teacher .teacher-stage-hint{opacity:0;pointer-events:none}
.teacher-mobile-selector{display:none}
@media(min-width:760px) and (max-width:1023px){.teacher-detail{right:3.5%;width:29%}.teacher-identity{left:4%;width:27%}.teacher-identity h3{font-size:31px}.teacher-identity h3 span{font-size:13px;margin-left:6px;padding-left:6px}.teacher-detail-actions{gap:7px;margin-bottom:12px}.teacher-detail-actions a{padding:7px 12px;font-size:10px}.teacher-detail ul{font-size:12px}.teacher-composition{height:480px}}
@media(max-width:759px){
 .teacher-head-target,.has-selected-teacher .teacher-head-target:not(.is-selected){display:block;left:var(--mobile-left);top:calc(var(--mobile-top) + 3%);width:var(--mobile-head-width);height:auto;aspect-ratio:1;min-width:44px;min-height:44px;z-index:20}
 .has-selected-teacher .teacher-head-target.is-selected{display:none}
 .teachers-section{padding:54px 0 35px}
 .teachers-heading h2{font-size:clamp(27px,6.7vw,42px);margin-bottom:15px}.teachers-heading p{font-size:12px}.teachers-eyebrow{font-size:9px;margin-bottom:12px}
 .teacher-composition{height:auto;min-height:330px;margin-top:12px;padding-bottom:0;display:flex;flex-direction:column}
 .teacher-portraits{position:relative;inset:auto;width:100%;height:clamp(300px,86vw,380px);order:0;overflow:hidden}
 .teacher-person{height:auto;aspect-ratio:5/7;top:var(--mobile-top);width:var(--mobile-width);left:var(--mobile-left);opacity:1;pointer-events:auto;transform:translateX(-50%);z-index:var(--mobile-depth)}
 .teacher-person img{mask-image:linear-gradient(#000 0%,#000 76%,transparent 100%);-webkit-mask-image:linear-gradient(#000 0%,#000 76%,transparent 100%)}
 .teacher-hover-label{display:none!important}
 .teacher-stage-hint{bottom:9px;font-size:11px;z-index:6}
 .has-selected-teacher .teacher-person{left:var(--mobile-left);top:var(--mobile-top);width:var(--mobile-width);height:auto;opacity:.38;pointer-events:auto;z-index:var(--mobile-depth);transform:translateX(-50%)}
 .has-selected-teacher .teacher-person.is-selected{width:var(--mobile-width);height:auto;left:var(--mobile-left);top:var(--mobile-top);opacity:1;transform:translateX(-50%);pointer-events:none}
 .teacher-identity,.teacher-detail{position:relative;left:auto;right:auto;top:auto;width:auto;margin:0 25px;transform:none;display:none}
 .has-selected-teacher .teacher-identity,.has-selected-teacher .teacher-detail{display:block;animation:teacher-detail-in 350ms ease both;transition-delay:0ms}
 .teacher-identity{order:1;margin-top:-12px;z-index:11;text-align:center}.teacher-identity h3{font-size:31px;line-height:1.3}.teacher-identity h3 span{font-family:Pretendard,sans-serif;font-size:13px;font-weight:700;margin-left:8px;padding-left:8px;border-left-width:2px}.teacher-identity i{width:40px;margin:13px auto 0;height:2px}.teacher-identity i::after{display:none}
 .teacher-detail{order:2;padding-top:18px;text-align:center}.teacher-detail-actions{justify-content:center;margin-bottom:16px;gap:8px}.teacher-detail-actions a{font-size:12px;padding:8px 17px}.teacher-detail ul{font-size:13px;line-height:1.7;text-align:left;width:fit-content;max-width:100%;margin:0 auto}.teacher-detail li{padding-left:12px}
 .teacher-reset{position:relative;order:3;right:auto;bottom:auto;align-self:center;font-size:11px;margin-top:16px;padding:7px 15px;background:#f1f3ff;border-radius:30px}
 .teacher-mobile-selector{display:flex;gap:7px;padding:20px 20px 0;margin:0 auto;max-width:570px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity}.teacher-mobile-selector::-webkit-scrollbar{display:none}.teacher-mobile-selector button{flex:1 0 70px;scroll-snap-align:center;border:1px solid #0028f926;border-radius:13px;background:#fff;color:var(--teacher-blue);padding:11px 9px;font-family:Pretendard,sans-serif;cursor:pointer;transition:background 180ms,color 180ms}.teacher-mobile-selector strong{display:block;font-size:12px}.teacher-mobile-selector span{display:block;font-size:9px;margin-top:4px;white-space:nowrap}.teacher-mobile-selector button.is-selected{background:var(--teacher-blue);color:white;border-color:var(--teacher-blue)}
 .teacher-mobile-selector button:focus-visible{outline:2px solid var(--teacher-blue);outline-offset:2px}
}
@keyframes teacher-detail-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes teacher-label-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.teacher-person,.teacher-identity,.teacher-detail,.teacher-hover-label,.teacher-detail-actions a,.teacher-mobile-selector button{transition:none!important;animation:none!important}.teacher-person:hover{transform:translateX(-50%)}.has-selected-teacher .teacher-person.is-selected{transform:translateX(-50%)}}
