/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   지니어스 영수학원  |  Clean Premium v4
   원칙: 여백이 고급이다. 색보다 구조로 말한다.
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* ── 토큰 ── */
:root {
  --blue:   #1549CC;
  --blue-d: #0F35A0;
  --blue-s: #EEF2FC;
  --org:    #FF5F00;
  --org-s:  #FFF0E6;
  --ink:    #0C1B30;
  --ink-60: rgba(12,27,48,.6);
  --ink-30: rgba(12,27,48,.3);
  --line:   #E6EAF2;
  --bg:     #F8FAFD;
  --white:  #ffffff;

  --f-sans: 'Noto Sans KR', system-ui, sans-serif;
  --f-disp: 'Bebas Neue', 'Noto Sans KR', sans-serif;

  --r8:  8px;
  --r16: 16px;
  --r24: 24px;
  --r99: 999px;

  --s1: 0 1px 4px rgba(12,27,48,.06), 0 4px 16px rgba(12,27,48,.07);
  --s2: 0 4px 14px rgba(12,27,48,.08), 0 18px 52px rgba(12,27,48,.10);
  --s3: 0 8px 24px rgba(12,27,48,.10), 0 32px 80px rgba(12,27,48,.12);

  --ease: cubic-bezier(.16,1,.3,1);
  --t:   .35s;
}

/* ── 리셋 ── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; }
body { font-family:var(--f-sans); color:var(--ink); background:var(--white); line-height:1.7; overflow-x:hidden; }
a { text-decoration:none; color:inherit; }
img { display:block; max-width:100%; height:auto; }
/* 갤러리는 background-image 방식 사용 — img 태그 없음 */
ul { list-style:none; }
button { cursor:pointer; border:none; background:none; font-family:inherit; }

/* ── 레이아웃 ── */
.container { max-width:1120px; margin:0 auto; padding:0 40px; }
.sec       { padding:128px 0; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   FLOATING BUTTONS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.fabs {
  position:fixed; bottom:28px; right:24px;
  z-index:990; display:flex; flex-direction:column; gap:10px; align-items:flex-end;
}
.fabs a {
  display:inline-flex; align-items:center; gap:8px;
  padding:11px 20px; border-radius:var(--r99);
  font-size:.82rem; font-weight:700;
  box-shadow:0 6px 24px rgba(0,0,0,.16);
  transition:transform var(--t) var(--ease), box-shadow var(--t);
  white-space:nowrap;
}
.fabs a:hover { transform:translateY(-3px) translateX(-3px); }
.fab-k { background:#FEE500; color:#2A1000; }
.fab-c { background:var(--blue); color:#fff; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   HEADER
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.hdr {
  position:fixed; inset:0 0 auto; z-index:900;
  padding:20px 0;
  transition:background var(--t), box-shadow var(--t), padding var(--t);
}
.hdr.on {
  background:rgba(255,255,255,.95);
  backdrop-filter:blur(20px) saturate(1.8);
  box-shadow:0 1px 0 var(--line), var(--s1);
  padding:13px 0;
}
.hdr-inner {
  max-width:1120px; margin:0 auto; padding:0 40px;
  display:flex; align-items:center; gap:28px;
}

/* 로고 */
.logo { display:flex; align-items:center; gap:11px; flex-shrink:0; }
.logo-g {
  width:42px; height:42px; border-radius:12px;
  background:linear-gradient(145deg, var(--blue), var(--blue-d));
  color:#fff; font-family:var(--f-disp);
  font-size:1.5rem; letter-spacing:0;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 16px rgba(21,73,204,.38);
  flex-shrink:0;
}
.logo-g.sm { width:38px; height:38px; font-size:1.3rem; }
.logo-name {
  font-size:1.05rem; font-weight:800;
  color:#fff; letter-spacing:-.02em;
}
.logo-name em { font-style:normal; font-weight:400; opacity:.75; }
.hdr.on .logo-name { color:var(--blue); }
.hdr.on .logo-name em { color:var(--ink-60); }

/* 네비 */
.gnav { display:flex; gap:2px; margin-left:auto; }
.gnav a {
  padding:7px 14px; border-radius:var(--r8);
  font-size:.875rem; font-weight:500;
  color:rgba(255,255,255,.8);
  transition:color var(--t), background var(--t);
}
.gnav a:hover { color:#fff; background:rgba(255,255,255,.14); }
.hdr.on .gnav a { color:var(--ink-60); }
.hdr.on .gnav a:hover { color:var(--blue); background:var(--blue-s); }

/* 헤더 CTA */
.hdr-btn {
  padding:10px 22px; border-radius:var(--r99);
  background:var(--org); color:#fff;
  font-size:.82rem; font-weight:700;
  box-shadow:0 4px 16px rgba(255,95,0,.32);
  transition:all var(--t); flex-shrink:0;
}
.hdr-btn:hover { background:#e05300; transform:translateY(-2px); box-shadow:0 8px 22px rgba(255,95,0,.4); }

/* 버거 */
.brg { display:none; flex-direction:column; gap:6px; padding:5px; z-index:999; }
.brg span { display:block; width:22px; height:2px; background:#fff; border-radius:2px; transition:all var(--t); }
.hdr.on .brg span { background:var(--ink); }
.brg.open span:nth-child(1) { transform:translateY(8px) rotate(45deg); }
.brg.open span:nth-child(2) { opacity:0; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   HERO
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.hero {
  position:relative;
  min-height:100svh;
  display:flex; align-items:center;
  overflow:hidden;
}

/* 배경: 짙은 남색 + 미세한 텍스처 */
.hero-bg {
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse 80% 60% at 70% 40%, rgba(30,80,220,.35) 0%, transparent 60%),
    radial-gradient(ellipse 50% 70% at 10% 80%, rgba(255,95,0,.18) 0%, transparent 55%),
    linear-gradient(160deg, #080F2E 0%, #112057 45%, #0D1A4A 100%);
}
.hero-noise {
  position:absolute; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  opacity:.5;
}

.hero-location {
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.18);
  color:rgba(255,255,255,.82);
  padding:7px 18px; border-radius:var(--r99);
  font-size:.8rem; font-weight:600; letter-spacing:.02em;
  margin-bottom:28px;
  backdrop-filter:blur(8px);
}

/* 히어로 헤드라인 — 크고 여백 많게 */
.hero-h1 {
  display:flex; flex-direction:column;
  font-weight:900; color:#fff;
  line-height:1.1; letter-spacing:-.04em;
  margin-bottom:24px;
}
.hero-h1 .line1 { font-size:clamp(2.2rem, 5vw, 3.8rem); }
.hero-h1 .line2 {
  font-size:clamp(4rem, 10vw, 8rem);
  line-height:.95;
}
/* "꼭 맞는" — 컬러 포인트만 하나 */
.hero-h1 .line2 em {
  font-style:normal;
  color:transparent;
  -webkit-text-stroke:2px rgba(255,255,255,.7);
  position:relative;
}
.hero-h1 .line3 {
  font-size:clamp(1.9rem, 4vw, 3.2rem);
  color:rgba(255,255,255,.55);
}

.hero-sub {
  font-size:.97rem; color:rgba(255,255,255,.65);
  line-height:1.82; margin-bottom:32px;
  max-width:460px;
}

.hero-actions { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:36px; }

/* 버튼 시스템 */
.btn-kakao {
  display:inline-flex; align-items:center; gap:9px;
  padding:15px 30px; border-radius:var(--r99);
  background:#FEE500; color:#2A1000;
  font-size:.95rem; font-weight:800;
  box-shadow:0 6px 22px rgba(254,229,0,.42);
  transition:all var(--t);
}
.btn-kakao:hover { background:#f5d900; transform:translateY(-3px); box-shadow:0 12px 30px rgba(254,229,0,.52); }
.btn-kakao.lg { padding:18px 36px; font-size:1rem; }

.btn-tel {
  display:inline-flex; align-items:center; gap:9px;
  padding:15px 30px; border-radius:var(--r99);
  border:1.5px solid rgba(255,255,255,.38);
  color:rgba(255,255,255,.85);
  font-size:.95rem; font-weight:700;
  transition:all var(--t);
}
.btn-tel:hover { border-color:#fff; background:rgba(255,255,255,.1); transform:translateY(-3px); }

.btn-wl {
  display:inline-flex; align-items:center; gap:9px;
  padding:15px 30px; border-radius:var(--r99);
  border:2px solid rgba(255,255,255,.5); color:#fff;
  font-size:.95rem; font-weight:700;
  transition:all var(--t);
}
.btn-wl:hover { background:rgba(255,255,255,.12); transform:translateY(-3px); }
.btn-wl.lg { padding:18px 36px; font-size:1rem; }

.btn-blue {
  display:inline-flex; align-items:center; gap:7px;
  padding:12px 22px; border-radius:var(--r99);
  background:var(--blue); color:#fff;
  font-size:.85rem; font-weight:700;
  box-shadow:0 4px 14px rgba(21,73,204,.3);
  transition:all var(--t);
}
.btn-blue:hover { background:var(--blue-d); transform:translateY(-2px); }

.btn-kakao-sm {
  display:inline-flex; align-items:center; gap:7px;
  padding:12px 22px; border-radius:var(--r99);
  background:#FEE500; color:#2A1000;
  font-size:.85rem; font-weight:700;
  transition:all var(--t);
}
.btn-kakao-sm:hover { background:#f5d900; transform:translateY(-2px); }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   HERO 2단 레이아웃
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.hero-body {
  position:relative; z-index:2;
  max-width:1120px; margin:0 auto;
  padding:160px 40px 100px;
  width:100%;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:48px;
  align-items:center;
}
.hero-copy { position:relative; z-index:2; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   HERO FLOATING ZONE
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.hfz {
  position:relative;
  width:100%;
  height:460px;
  pointer-events:none;
  user-select:none;
}

/* ── 카드 공통 ── */
.hf-card {
  position:absolute;
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(24px) saturate(1.8);
  -webkit-backdrop-filter:blur(24px) saturate(1.8);
  border:1px solid rgba(255,255,255,.16);
  border-radius:24px;
  padding:22px 26px;
  color:#fff;
  width:210px;
  box-shadow:
    0 2px 0 rgba(255,255,255,.08) inset,
    0 12px 40px rgba(0,0,0,.28);
}

/* 수학 카드 — 왼쪽 중상단 */
.hf-math {
  top:40px;
  left:0;
  animation: floatA 5.5s ease-in-out infinite;
}
/* 영어 카드 — 오른쪽 하단 */
.hf-eng {
  bottom:50px;
  right:10px;
  animation: floatB 6s ease-in-out infinite .8s;
}

/* 카드 헤더 행 */
.hf-card-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:14px;
}
.hf-chip {
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
  background:rgba(21,73,204,.85);
  color:#fff;
  padding:4px 12px;
  border-radius:var(--r99);
  border:1px solid rgba(100,150,255,.4);
}
.hf-chip.eng {
  background:rgba(255,95,0,.85);
  border-color:rgba(255,160,80,.4);
}
.hf-score {
  font-family:var(--f-disp);
  font-size:1.3rem;
  font-weight:900;
  color:rgba(100,200,255,.9);
  letter-spacing:-.02em;
}
.hf-score.org { color:rgba(255,180,80,.9); }

/* 수식/단어 */
.hf-formula {
  font-family:var(--f-disp);
  font-size:1.55rem;
  letter-spacing:.02em;
  color:#fff;
  line-height:1.15;
  margin-bottom:4px;
}
.hf-formula.eng-word {
  font-size:1.45rem;
  letter-spacing:.04em;
}
.hf-formula-ans {
  font-size:.8rem;
  color:rgba(255,255,255,.5);
  margin-bottom:16px;
}

/* 진행 바 행 */
.hf-progress-row {
  display:flex;
  align-items:center;
  gap:8px;
  font-size:.68rem;
  color:rgba(255,255,255,.5);
  font-weight:600;
}
.hf-bar {
  flex:1;
  height:4px;
  background:rgba(255,255,255,.12);
  border-radius:4px;
  overflow:hidden;
}
.hf-bar-fill {
  height:100%;
  border-radius:4px;
  background:linear-gradient(90deg, rgba(80,140,255,.9), rgba(120,200,255,.8));
  transition:width .6s ease;
}
.hf-bar-fill.org {
  background:linear-gradient(90deg, rgba(255,120,40,.9), rgba(255,200,80,.8));
}

/* ── 성적 뱃지 ── */
.hf-badge {
  position:absolute;
  top:185px;
  right:20px;
  display:flex;
  align-items:center;
  gap:12px;
  background:rgba(255,255,255,.1);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border:1px solid rgba(255,255,255,.18);
  border-radius:18px;
  padding:14px 18px;
  box-shadow:0 8px 28px rgba(0,0,0,.22);
  animation:floatC 6s ease-in-out infinite 1.2s;
  white-space:nowrap;
}
.hf-badge-icon { font-size:1.6rem; line-height:1; }
.hf-badge-text strong {
  display:block;
  font-size:.85rem;
  font-weight:800;
  color:#fff;
}
.hf-badge-text span {
  font-size:.7rem;
  color:rgba(255,255,255,.5);
}

/* ── pill 태그 2개 ── */
.hf-pill {
  position:absolute;
  background:rgba(21,73,204,.4);
  backdrop-filter:blur(12px);
  border:1px solid rgba(100,160,255,.3);
  border-radius:var(--r99);
  color:rgba(255,255,255,.8);
  padding:8px 18px;
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.04em;
  white-space:nowrap;
}
.p1 { top:130px; left:20px; animation:floatB 5s ease-in-out infinite .4s; }
.p2 { top:295px; left:5px; animation:floatA 5.5s ease-in-out infinite 1s; }

/* ── 배경 대형 알파벳/기호 ── */
.hf-alpha {
  position:absolute;
  font-family:var(--f-disp);
  font-size:7rem;
  font-weight:900;
  line-height:1;
  letter-spacing:-.03em;
  color:#fff;
  pointer-events:none;
  animation:floatA 9s ease-in-out infinite;
}
.al1 { top:20px; right:30px; opacity:.06; font-size:9rem; }
.al2 { top:260px; right:60px; opacity:.05; font-size:6rem; animation:floatB 8s ease-in-out infinite .5s; }

/* ── 빛나는 점 ── */
.hf-dot {
  position:absolute;
  border-radius:50%;
  animation:twinkle 3s ease-in-out infinite;
}
.dot1 {
  width:7px; height:7px;
  background:radial-gradient(circle, rgba(120,200,255,1), rgba(60,120,255,.6));
  top:80px; right:50px;
  animation-delay:.3s;
  box-shadow:0 0 10px rgba(120,200,255,.8);
}
.dot2 {
  width:5px; height:5px;
  background:radial-gradient(circle, rgba(255,200,100,1), rgba(255,120,40,.6));
  top:360px; left:90px;
  animation-delay:1s;
  box-shadow:0 0 8px rgba(255,200,100,.8);
}
.dot3 {
  width:6px; height:6px;
  background:radial-gradient(circle, rgba(160,255,200,1), rgba(40,200,120,.6));
  top:440px; right:80px;
  animation-delay:1.6s;
  box-shadow:0 0 9px rgba(160,255,200,.8);
}

/* ── 키프레임 ── */
@keyframes floatA {
  0%, 100% { transform:translateY(0) rotate(-.8deg); }
  50%       { transform:translateY(-12px) rotate(.8deg); }
}
@keyframes floatB {
  0%, 100% { transform:translateY(0) rotate(1deg); }
  50%       { transform:translateY(-16px) rotate(-1deg); }
}
@keyframes floatC {
  0%, 100% { transform:translateY(0) scale(1); }
  40%       { transform:translateY(-9px) scale(1.01); }
  70%       { transform:translateY(-5px) scale(1); }
}
@keyframes twinkle {
  0%, 100% { opacity:.5; transform:scale(1); }
  50%       { opacity:1; transform:scale(1.5); }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   반응형: 태블릿 & 모바일
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* 태블릿: 플로팅존 유지, 레이아웃 조정 */
@media (max-width:1100px) {
  .hero-body {
    gap:28px;
    padding:130px 28px 80px;
    grid-template-columns: 1fr 0.85fr;
  }
  .hf-card { width:178px; padding:16px 18px; }
  .hf-formula { font-size:1.25rem; }
  .hf-formula.eng-word { font-size:1.15rem; }
  .hf-score { font-size:1rem; }
  .hf-badge { top:165px; right:4px; padding:11px 14px; }
  .hf-badge-icon { font-size:1.3rem; }
  .hf-badge-text strong { font-size:.8rem; }
  .hf-badge-text span { font-size:.65rem; }
  .p1 { top:120px; left:8px; font-size:.7rem; padding:6px 14px; }
  .p2 { top:270px; left:2px; font-size:.7rem; padding:6px 14px; }
  .al1 { font-size:6.5rem; right:8px; }
  .al2 { font-size:4.5rem; right:28px; }
  .hfz { height:410px; }
}

/* 모바일: 플로팅존 숨김 */
@media (max-width:767px) {
  .hero-body {
    grid-template-columns:1fr;
    padding:120px 24px 72px;
  }
  .hfz { display:none; }
}

/* 스크롤 힌트 */
.hero-scroll {
  position:absolute; bottom:40px; left:40px; z-index:2;
}
.scroll-dot {
  display:block; width:1px; height:60px;
  background:linear-gradient(to bottom, rgba(255,255,255,.6), transparent);
  animation:scrollAnim 2.4s ease-in-out infinite;
}
@keyframes scrollAnim {
  0%   { opacity:.5; transform:scaleY(1) translateY(0); transform-origin:top; }
  50%  { opacity:1; }
  100% { opacity:0; transform:scaleY(.2) translateY(40px); transform-origin:top; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   TICKER
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.ticker {
  background:var(--org); overflow:hidden; padding:11px 0;
}
.ticker-inner {
  display:flex; align-items:center; gap:36px;
  white-space:nowrap;
  animation:ticker 32s linear infinite;
  font-size:.82rem; font-weight:600; color:#fff;
}
.ticker-inner b { opacity:.45; }
.ticker-inner strong { font-weight:900; }
@keyframes ticker { from { transform:translateX(0) } to { transform:translateX(-50%) } }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SECTION COMMON
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sec-head  { margin-bottom:72px; }
.eyebrow {
  display:inline-block;
  font-size:.72rem; font-weight:800;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--blue); margin-bottom:14px;
}
.eyebrow.light { color:rgba(255,255,255,.5); }
.sec-title {
  font-size:clamp(2rem, 4vw, 3.2rem);
  font-weight:900; line-height:1.15;
  letter-spacing:-.04em; color:var(--ink);
}
.sec-title.light  { color:#fff; }
.sec-title .accent { color:var(--blue); }
.sec-desc { margin-top:16px; font-size:.97rem; color:var(--ink-60); line-height:1.8; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   INTRO
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.intro-sec { background:var(--bg); }
.intro-grid {
  display:grid; grid-template-columns:1fr 1.15fr;
  gap:88px; align-items:start;
}
.intro-text .eyebrow { color:var(--org); }
.intro-text h2 {
  font-size:clamp(2rem, 3.5vw, 2.8rem);
  font-weight:900; line-height:1.18;
  letter-spacing:-.04em; color:var(--ink);
  margin-bottom:20px;
}
.sec-body {
  font-size:.97rem; color:var(--ink-60);
  line-height:1.9; margin-bottom:24px;
}
.sec-body strong { color:var(--ink); font-weight:700; }
.text-link {
  font-size:.9rem; font-weight:700;
  color:var(--blue);
  display:inline-block;
  transition:letter-spacing var(--t);
}
.text-link:hover { letter-spacing:.02em; }

/* 강점 카드 — 미니멀 리스트 스타일 */
.intro-feats { display:flex; flex-direction:column; gap:0; }
.feat {
  display:flex; gap:22px; align-items:flex-start;
  padding:24px 0;
  border-bottom:1px solid var(--line);
  transition:transform var(--t);
  transition-delay:calc(var(--d));
}
.feat:first-child { border-top:1px solid var(--line); }
.feat:hover { transform:translateX(6px); }
.feat-num {
  font-family:var(--f-disp);
  font-size:1.5rem; color:var(--line);
  flex-shrink:0; line-height:1;
  padding-top:4px; min-width:36px;
  transition:color var(--t);
}
.feat:hover .feat-num { color:var(--blue); }
.feat-body h4 { font-size:.97rem; font-weight:800; color:var(--ink); margin-bottom:6px; }
.feat-body p  { font-size:.84rem; color:var(--ink-60); line-height:1.72; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   PROCESS (how we teach)
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.process-sec {
  background:linear-gradient(155deg, #081230 0%, #1549CC 58%, #1040B8 100%);
  position:relative; overflow:hidden;
}
/* 섬세한 라인 패턴 */
.process-sec::before {
  content:''; position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:48px 48px;
}
.process-list {
  position:relative; z-index:1;
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.1);
  border-radius:var(--r24);
  overflow:hidden;
}
.proc {
  background:rgba(8,18,48,.55);
  backdrop-filter:blur(10px);
  padding:32px 28px;
  transition:background var(--t);
  transition-delay:calc(var(--d));
}
.proc:hover { background:rgba(255,255,255,.1); }
.proc-step {
  font-family:var(--f-disp);
  font-size:.75rem; letter-spacing:.12em;
  color:rgba(255,255,255,.35);
  margin-bottom:14px;
}
.proc h4 {
  font-size:.97rem; font-weight:800; color:#fff;
  display:flex; align-items:center; gap:8px;
  margin-bottom:8px;
}
.proc h4 i { color:#FEE500; font-size:.82rem; }
.proc p { font-size:.83rem; color:rgba(255,255,255,.58); line-height:1.72; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   CURRICULUM
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.cur-sec { background:var(--white); }
.cur-tabs { display:flex; gap:8px; margin-bottom:40px; }
.ctab {
  padding:11px 28px; border-radius:var(--r99);
  font-size:.88rem; font-weight:700;
  color:var(--ink-60);
  background:var(--bg); border:1.5px solid var(--line);
  transition:all var(--t);
}
.ctab:hover { color:var(--blue); border-color:var(--blue); background:var(--blue-s); }
.ctab.on { background:var(--blue); color:#fff; border-color:var(--blue); box-shadow:0 4px 16px rgba(21,73,204,.28); }

.cur-panel  { display:none; }
.cur-panel.on { display:block; }
.cp-grid {
  display:grid; grid-template-columns:3fr 2fr;
  gap:52px; align-items:center;
  background:var(--bg); border-radius:var(--r24);
  padding:48px 52px; border:1.5px solid var(--line);
}
.cp-main h3 { font-size:1.7rem; font-weight:900; color:var(--ink); margin-bottom:6px; letter-spacing:-.03em; }
.cp-lead { font-size:.9rem; color:var(--ink-60); margin-bottom:24px; }
.cp-list li {
  display:flex; align-items:flex-start; gap:12px;
  font-size:.9rem; color:var(--ink-60); margin-bottom:13px; line-height:1.6;
}
.cp-list li::before {
  content:'';
  width:6px; height:6px; border-radius:50%;
  background:var(--blue); flex-shrink:0; margin-top:7px;
}
.cp-card {
  border-radius:var(--r24); padding:32px 28px;
  text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:10px;
}
.cp-card.blue  { background:linear-gradient(145deg,var(--blue),var(--blue-d)); color:#fff; box-shadow:0 12px 40px rgba(21,73,204,.32); }
.cp-card.orange { background:linear-gradient(145deg,var(--org),#D94F00); color:#fff; box-shadow:0 12px 40px rgba(255,95,0,.3); }
.cp-card i      { font-size:2rem; color:#FEE500; }
.cp-card.orange i { color:rgba(255,255,255,.9); }
.cp-card strong { font-size:1.1rem; font-weight:800; }
.cp-card p      { font-size:.83rem; opacity:.75; line-height:1.65; }
.cp-card p em   { font-style:normal; font-weight:700; opacity:1; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SCHOOLS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.schools-sec { background:var(--bg); }
.school-rows { display:flex; flex-direction:column; gap:24px; margin-bottom:40px; }
.school-row {
  display:flex; align-items:flex-start; gap:24px;
  padding:28px 32px;
  background:var(--white); border:1.5px solid var(--line);
  border-radius:var(--r16); box-shadow:var(--s1);
  transition:box-shadow var(--t);
  transition-delay:var(--d, 0s);
}
.school-row:hover { box-shadow:var(--s2); }

.school-tag {
  flex-shrink:0; padding:6px 16px; border-radius:var(--r99);
  font-size:.72rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  margin-top:2px;
}
.elem-tag { background:var(--blue-s); color:var(--blue); }
.mid-tag  { background:var(--org-s);  color:var(--org);  }
.high-tag { background:#EDE9FE;       color:#5B21B6;      }

.school-list { display:flex; flex-wrap:wrap; gap:10px; }
.school-item {
  display:inline-flex; align-items:center; gap:8px;
  padding:9px 18px; border-radius:var(--r99);
  background:var(--bg); border:1.5px solid var(--line);
  font-size:.88rem; font-weight:600; color:var(--ink-60);
  position:relative;
}
.main-item { background:var(--blue-s); border-color:var(--blue); color:var(--ink); font-weight:800; }
.main-item.mid  { background:var(--org-s);  border-color:var(--org); }
.main-item.high { background:#EDE9FE; border-color:#5B21B6; }
.main-dot { width:8px; height:8px; border-radius:50%; background:var(--blue); flex-shrink:0; }
.main-dot.orange { background:var(--org); }
.main-dot.purple { background:#5B21B6; }
.main-badge {
  font-size:.6rem; font-weight:900; letter-spacing:.08em;
  padding:3px 8px; border-radius:var(--r99);
  background:var(--blue); color:#fff;
}
.main-badge.orange { background:var(--org); }
.main-badge.purple { background:#5B21B6; }
.school-note { font-size:.9rem; color:var(--ink-60); text-align:center; }
.school-note a { color:var(--blue); font-weight:700; }
.school-note a:hover { text-decoration:underline; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   FACILITY  v5 — background-image + padding-top trick
   절대 깨지지 않는 방식
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.facility-sec { background:var(--bg); }

/* ── 5셀 그리드: 왼쪽 세로 큰칸 + 오른쪽 2×2 + 텍스트 ── */
.fac-grid {
  display:grid;
  grid-template-columns: 1.1fr 1fr 1fr;
  grid-template-rows: 240px 240px;
  gap:12px;
}

/* ── 공통 셀 ── */
.fac-item {
  border-radius:14px;
  overflow:hidden;
  cursor:pointer;
  position:relative;
  background-color:#d0d8e8;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  transition:filter .4s, transform .4s var(--ease);
}
.fac-item:hover { filter:brightness(.88); transform:scale(1.015); }

/* ── 왼쪽 세로 전체 ── */
.fac-tall {
  grid-column:1;
  grid-row:1 / 3;
}

/* ── 텍스트 카드 ── */
.fac-txt {
  border-radius:14px;
  background:var(--blue);
  display:flex;
  align-items:center;
}
.fac-txt-inner {
  padding:28px 24px;
  display:flex;
  flex-direction:column;
  gap:13px;
  width:100%;
}
.fac-txt-inner h3 {
  font-size:1.3rem;
  font-weight:900;
  color:#fff;
  line-height:1.25;
  letter-spacing:-.03em;
}
.fac-txt-inner ul {
  display:flex;
  flex-direction:column;
  gap:8px;
}
.fac-txt-inner li {
  display:flex;
  align-items:center;
  gap:8px;
  font-size:.78rem;
  font-weight:600;
  color:rgba(255,255,255,.85);
}
.fac-txt-inner li i {
  font-size:.65rem;
  color:rgba(255,255,255,.5);
  flex-shrink:0;
}

/* ── 호버 캡션 오버레이 ── */
.fac-item::after {
  content:attr(data-cap);
  position:absolute;
  bottom:0; left:0; right:0;
  padding:40px 16px 14px;
  background:linear-gradient(to top, rgba(8,15,40,.82), transparent);
  color:#fff;
  font-size:.82rem;
  font-weight:700;
  opacity:0;
  transition:opacity .3s;
}
.fac-item:hover::after { opacity:1; }

/* ── JS로 이미지 주입 (보험용) ── */
.fac-item[data-img] { background-image:var(--bg-img, none); }

/* ── 태블릿 ── */
@media (max-width:1024px) {
  .fac-grid {
    grid-template-rows: 200px 200px;
    gap:10px;
  }
}

/* ── 모바일 ── */
@media (max-width:768px) {
  .fac-grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 180px 180px 180px;
    gap:8px;
  }
  .fac-tall {
    grid-column:1 / -1;
    grid-row:1;
  }
  .fac-txt {
    grid-column:1 / -1;
  }
}

/* ── 소형 ── */
@media (max-width:480px) {
  .fac-grid {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    gap:8px;
  }
  .fac-tall { grid-column:1; grid-row:auto; }
  .fac-item { height:200px; }
  .fac-txt  { height:auto; min-height:160px; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   TRUST
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.trust-sec {
  background:linear-gradient(155deg, #081230 0%, #1549CC 58%, #1040B8 100%);
  position:relative;
}
.trust-sec::before {
  content:''; position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:48px 48px;
}
.trust-grid {
  position:relative; z-index:1;
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:20px;
}
.trust-item {
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r16); padding:30px 24px;
  transition:background var(--t), transform var(--t);
  transition-delay:calc(var(--d));
}
.trust-item:hover { background:rgba(255,255,255,.13); transform:translateY(-4px); }
.ti-icon {
  width:46px; height:46px; border-radius:12px;
  background:rgba(255,255,255,.1);
  color:rgba(255,255,255,.85); font-size:1.15rem;
  display:flex; align-items:center; justify-content:center;
  margin-bottom:16px;
}
.trust-item h4 { font-size:.97rem; font-weight:800; color:#fff; margin-bottom:8px; }
.trust-item p  { font-size:.82rem; color:rgba(255,255,255,.58); line-height:1.75; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   CTA
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.cta-sec {
  background:linear-gradient(120deg, var(--org) 0%, #FF8000 100%);
  padding:80px 40px;
}
.cta-inner {
  max-width:1120px; margin:0 auto;
  display:flex; align-items:center;
  justify-content:space-between; gap:40px; flex-wrap:wrap;
}
.cta-tag {
  display:inline-block;
  background:rgba(255,255,255,.2); color:#fff;
  padding:5px 16px; border-radius:var(--r99);
  font-size:.72rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  margin-bottom:12px;
}
.cta-text h2  { font-size:clamp(1.8rem,3.5vw,2.6rem); font-weight:900; color:#fff; line-height:1.18; margin-bottom:10px; letter-spacing:-.03em; }
.cta-text p   { font-size:.97rem; color:rgba(255,255,255,.82); }
.cta-text strong { color:#fff; font-weight:800; }
.cta-btns { display:flex; gap:14px; flex-wrap:wrap; flex-shrink:0; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   CONTACT
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.contact-sec { background:var(--bg); }
.contact-grid { display:grid; grid-template-columns:1fr 1.8fr; gap:52px; align-items:start; }
.contact-info { display:flex; flex-direction:column; gap:22px; }
.ci { display:flex; align-items:flex-start; gap:14px; font-size:.9rem; }
.ci > i, .ci > svg { color:var(--blue); margin-top:3px; flex-shrink:0; font-size:1rem; width:18px; }
.ci b { display:block; font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-30); margin-bottom:4px; }
.ci p { color:var(--ink); line-height:1.65; }
.ci a { color:var(--blue); font-weight:700; }
.ci a:hover { text-decoration:underline; }
.contact-btns { display:flex; gap:10px; flex-wrap:wrap; padding-top:4px; }
.map-wrap { display:flex; flex-direction:column; gap:12px; }
.map-frame { border-radius:var(--r16); overflow:hidden; box-shadow:var(--s3); }
.map-frame iframe { display:block; }
.map-links {
  display:flex; gap:10px; flex-wrap:wrap;
}
.map-btn {
  display:inline-flex; align-items:center; gap:7px;
  padding:11px 20px; border-radius:var(--r99);
  font-size:.83rem; font-weight:700;
  transition:all var(--t);
  flex:1; justify-content:center;
  min-width:160px;
}
.map-btn i { font-size:.9rem; }
.kakao-map {
  background:#FEE500; color:#1a1000;
  box-shadow:0 4px 14px rgba(254,229,0,.35);
}
.kakao-map:hover { background:#f5d800; transform:translateY(-2px); box-shadow:0 8px 20px rgba(254,229,0,.45); }
.naver-map {
  background:#03C75A; color:#fff;
  box-shadow:0 4px 14px rgba(3,199,90,.3);
}
.naver-map:hover { background:#02b350; transform:translateY(-2px); box-shadow:0 8px 20px rgba(3,199,90,.4); }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   FOOTER
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.footer { background:var(--ink); }
.ft-grid {
  max-width:1120px; margin:0 auto;
  padding:52px 40px 40px;
  display:grid; grid-template-columns:auto 1fr auto;
  gap:48px; align-items:center;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.ft-brand { display:flex; align-items:center; gap:12px; }
.ft-brand strong { display:block; font-size:1rem; font-weight:800; color:#fff; }
.ft-brand p { font-size:.78rem; color:rgba(255,255,255,.38); }
.ft-info p { font-size:.82rem; color:rgba(255,255,255,.42); margin-bottom:6px; line-height:1.55; }
.ft-kakao {
  display:inline-flex; align-items:center; gap:8px;
  padding:11px 20px; border-radius:var(--r99);
  background:#FEE500; color:#2A1000;
  font-size:.82rem; font-weight:700;
  white-space:nowrap; transition:all var(--t);
}
.ft-kakao:hover { background:#f5d900; transform:translateY(-2px); }
.ft-copy { max-width:1120px; margin:0 auto; padding:18px 40px; font-size:.75rem; color:rgba(255,255,255,.2); }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   CONSULT FORM
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.consult-sec { background:var(--white); }

.consult-wrap {
  display:grid;
  grid-template-columns:1fr 1.55fr;
  gap:72px;
  align-items:start;
}

/* ── 왼쪽 안내 ── */
.consult-info .eyebrow { color:var(--org); }
.consult-info .sec-title { margin-bottom:20px; }
.consult-desc {
  font-size:.97rem; color:var(--ink-60);
  line-height:1.9; margin-bottom:36px;
}
.consult-desc strong { color:var(--ink); font-weight:700; }

.consult-promises { display:flex; flex-direction:column; gap:14px; }
.cp-item {
  display:flex; align-items:center; gap:12px;
  font-size:.9rem; color:var(--ink-60);
}
.cp-icon { font-size:1.1rem; line-height:1; flex-shrink:0; }
.cp-item strong { color:var(--ink); font-weight:700; }

/* ── 폼 카드 ── */
.consult-form-wrap {
  background:var(--white);
  border:1.5px solid var(--line);
  border-radius:var(--r24);
  padding:44px 40px;
  box-shadow:var(--s2);
  position:relative;
}
.consult-form { display:flex; flex-direction:column; gap:20px; }

/* 행: 2컬럼 나란히 */
.cf-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

/* 개별 필드 */
.cf-field {
  display:flex; flex-direction:column; gap:7px;
  position:relative;
}
.cf-field label {
  font-size:.78rem; font-weight:800;
  color:var(--ink); letter-spacing:.02em;
  text-transform:uppercase;
}
.req { color:var(--org); }

/* input / textarea / select 공통 */
.cf-field input,
.cf-field textarea,
.cf-field select {
  width:100%;
  padding:13px 16px;
  border:1.5px solid var(--line);
  border-radius:10px;
  font-family:var(--f-sans);
  font-size:.92rem; color:var(--ink);
  background:var(--bg);
  transition:border-color var(--t), box-shadow var(--t);
  outline:none;
  -webkit-appearance:none; appearance:none;
}
.cf-field input::placeholder,
.cf-field textarea::placeholder { color:var(--ink-30); }
.cf-field input:focus,
.cf-field textarea:focus,
.cf-field select:focus {
  border-color:var(--blue);
  background:var(--white);
  box-shadow:0 0 0 3px rgba(21,73,204,.1);
}
.cf-field input.err,
.cf-field textarea.err,
.cf-field select.err {
  border-color:#EF4444;
  box-shadow:0 0 0 3px rgba(239,68,68,.1);
}
.cf-field textarea { resize:vertical; min-height:100px; line-height:1.7; }

/* select 래퍼 */
.cf-select-wrap { position:relative; }
.cf-select-wrap select { padding-right:36px; cursor:pointer; }
.cf-select-wrap i {
  position:absolute; right:14px; top:50%;
  transform:translateY(-50%);
  font-size:.72rem; color:var(--ink-30);
  pointer-events:none;
}

/* 에러 메시지 */
.cf-err {
  font-size:.75rem; font-weight:600;
  color:#EF4444;
  display:none;
  margin-top:-3px;
}
.cf-err.show { display:block; }

/* 체크박스 과목 선택 */
.cf-checks {
  display:flex; gap:10px; flex-wrap:wrap;
}
.cf-check {
  cursor:pointer;
}
.cf-check input[type="checkbox"] { display:none; }
.cf-check span {
  display:inline-flex; align-items:center; gap:6px;
  padding:10px 18px;
  border:1.5px solid var(--line);
  border-radius:var(--r99);
  font-size:.85rem; font-weight:700;
  color:var(--ink-60);
  background:var(--bg);
  transition:all var(--t);
  user-select:none;
}
.cf-check input:checked + span {
  background:var(--blue-s);
  border-color:var(--blue);
  color:var(--blue);
}
.cf-check span:hover {
  border-color:var(--blue);
  color:var(--blue);
}

/* 개인정보 동의 */
.cf-agree {
  display:flex; align-items:flex-start; gap:10px;
  cursor:pointer;
  font-size:.83rem; color:var(--ink-60); line-height:1.6;
}
.cf-agree input[type="checkbox"] {
  width:18px; height:18px; flex-shrink:0;
  accent-color:var(--blue); cursor:pointer;
  margin-top:1px;
}
.cf-agree em { font-style:normal; color:var(--ink-30); font-size:.78rem; }

/* 제출 버튼 */
.cf-submit {
  display:flex; align-items:center; justify-content:center; gap:10px;
  width:100%; padding:17px;
  background:#FEE500; color:#1a1000;
  border-radius:var(--r99);
  font-family:var(--f-sans);
  font-size:1rem; font-weight:800;
  box-shadow:0 6px 22px rgba(254,229,0,.42);
  transition:all var(--t);
  cursor:pointer; border:none;
  margin-top:4px;
}
.cf-submit:hover {
  background:#f5d800;
  transform:translateY(-2px);
  box-shadow:0 12px 32px rgba(254,229,0,.52);
}
.cf-submit:active { transform:translateY(0); }

/* 완료 메시지 */
.cf-done {
  display:none;
  flex-direction:column; align-items:center;
  text-align:center; gap:14px;
  padding:20px 0;
}
.cf-done.show { display:flex; }
.cf-done-icon { font-size:3.2rem; line-height:1; }
.cf-done h3 { font-size:1.4rem; font-weight:900; color:var(--ink); }
.cf-done p  { font-size:.93rem; color:var(--ink-60); line-height:1.8; }
.cf-done strong { color:var(--blue); }

/* ── 반응형 ── */
@media (max-width:1024px) {
  .consult-wrap { grid-template-columns:1fr; gap:48px; }
  .consult-info .sec-title { font-size:2rem; }
  .consult-promises { flex-direction:row; flex-wrap:wrap; gap:18px; }
}
@media (max-width:768px) {
  .consult-form-wrap { padding:32px 24px; }
  .cf-row { grid-template-columns:1fr; gap:16px; }
  .consult-promises { flex-direction:column; gap:12px; }
}
@media (max-width:480px) {
  .consult-form-wrap { padding:24px 18px; border-radius:var(--r16); }
  .cf-checks { gap:8px; }
  .cf-check span { padding:9px 14px; font-size:.82rem; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   REVIEWS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.review-sec { background: var(--bg); }

.review-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.rv-card {
  background: var(--white);
  border: 1.5px solid var(--line);
  border-radius: var(--r24);
  padding: 28px 26px 24px;
  box-shadow: var(--s1);
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: transform var(--t) var(--ease), box-shadow var(--t);
  transition-delay: var(--d, 0s);
}
.rv-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--s2);
}

/* top row: stars + tag */
.rv-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.rv-stars {
  display: flex;
  gap: 3px;
  color: #FBBF24;
  font-size: .8rem;
}
.rv-tag {
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--blue);
  background: var(--blue-s);
  padding: 4px 12px;
  border-radius: var(--r99);
  white-space: nowrap;
}

/* quote text */
.rv-text {
  font-size: .875rem;
  color: var(--ink-60);
  line-height: 1.82;
  flex: 1;
  /* 따옴표 장식 */
  position: relative;
  padding-top: 22px;
}
.rv-text::before {
  content: '\201C';
  position: absolute;
  top: -4px;
  left: -2px;
  font-size: 2.8rem;
  line-height: 1;
  font-family: Georgia, serif;
  color: var(--blue-s);
  font-weight: 900;
}

/* author */
.rv-author {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.rv-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .95rem;
  font-weight: 800;
  color: var(--ink);
  flex-shrink: 0;
}
.rv-author strong {
  display: block;
  font-size: .88rem;
  font-weight: 800;
  color: var(--ink);
  margin-bottom: 2px;
}
.rv-author span {
  font-size: .75rem;
  color: var(--ink-30);
  font-weight: 500;
}

/* 반응형 — 리뷰 */
@media (max-width: 1024px) {
  .review-grid { grid-template-columns: repeat(2, 1fr); gap:16px; }
}
@media (max-width: 600px) {
  .review-grid { grid-template-columns: 1fr; gap:14px; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   LIGHTBOX
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.lb { position:fixed; inset:0; z-index:9999; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .3s; }
.lb.open { opacity:1; pointer-events:all; }
.lb-bg { position:absolute; inset:0; background:rgba(5,10,30,.93); backdrop-filter:blur(14px); }
.lb-wrap { position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; max-width:90vw; }
#lbImg { max-width:82vw; max-height:74vh; object-fit:contain; border-radius:var(--r16); box-shadow:0 28px 80px rgba(0,0,0,.65); }
#lbCap { margin-top:14px; font-size:.9rem; font-weight:600; color:rgba(255,255,255,.75); text-align:center; }
.lb-x { position:absolute; top:-46px; right:0; color:#fff; font-size:1.1rem; width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.12); display:flex; align-items:center; justify-content:center; transition:background .2s; }
.lb-x:hover { background:rgba(255,255,255,.24); }
.lb-arr { position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.12); color:#fff; font-size:.95rem; display:flex; align-items:center; justify-content:center; transition:background .2s; }
.lb-arr:hover { background:rgba(255,255,255,.24); }
.lp { left:-60px; }
.ln { right:-60px; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   ANIMATIONS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.slide-up {
  opacity:0; transform:translateY(30px);
  animation:su .9s var(--ease) forwards;
}
.hero-location { animation-delay:.05s; }
.hero-h1       { animation-delay:.15s; }
.hero-sub      { animation-delay:.28s; }
.hero-actions  { animation-delay:.38s; }
@keyframes su { to { opacity:1; transform:translateY(0); } }

.reveal {
  opacity:0; transform:translateY(24px);
  transition:opacity .7s var(--ease), transform .7s var(--ease);
  transition-delay:var(--d, 0s);
}
.reveal.in { opacity:1; transform:translateY(0); }

/* ── 갤러리/시설은 reveal 완전 무효화 ── */
.fac-item,
.fac-txt,
.fac-grid {
  opacity:1 !important;
  transform:none !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   RESPONSIVE
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (max-width:1024px) {
  .sec { padding:80px 0; }
  .sec-head { margin-bottom:44px; }

  /* intro */
  .intro-grid { grid-template-columns:1fr; gap:44px; }

  /* curriculum */
  .cp-grid { grid-template-columns:1fr; padding:32px 28px; gap:0; }
  .cp-aside { display:none; }

  /* process */
  .process-list { grid-template-columns:repeat(2,1fr); }

  /* trust */
  .trust-grid { grid-template-columns:repeat(2,1fr); gap:16px; }
  .trust-item { padding:24px 20px; }

  /* contact */
  .contact-grid { grid-template-columns:1fr; gap:36px; }

  /* footer */
  .ft-grid { grid-template-columns:1fr 1fr; row-gap:20px; }
  .ft-kakao { grid-column:1/-1; }

  /* gallery — 구 코드 제거됨 */
}

@media (max-width:768px) {
  .sec { padding:64px 0; }
  .sec-head { margin-bottom:36px; }
  .container { padding:0 20px; }
  .hdr-inner { padding:0 20px; }

  /* nav drawer */
  .gnav {
    position:fixed; inset:0;
    background:rgba(8,15,46,.97);
    flex-direction:column; align-items:center; justify-content:center;
    gap:4px; transform:translateX(-100%);
    transition:transform var(--t) var(--ease); z-index:800;
  }
  .gnav.open { transform:translateX(0); }
  .gnav a { font-size:1.2rem; padding:12px 24px; color:#fff !important; }
  .hdr-btn { display:none; }
  .brg { display:flex; }

  /* hero */
  .hero-body { padding:100px 20px 64px; grid-template-columns:1fr; }
  .hfz { display:none; }
  .hero-h1 .line2 { font-size:clamp(3rem,13vw,5.5rem); }
  .hero-sub { font-size:.9rem; margin-bottom:28px; }
  .hero-actions { flex-direction:column; align-items:stretch; gap:10px; }
  .btn-kakao, .btn-tel { justify-content:center; padding:14px 24px; }

  /* intro */
  .intro-grid { gap:36px; }
  .feat { padding:20px 0; gap:16px; }

  /* process */
  .process-list { grid-template-columns:1fr; }
  .proc { padding:22px 20px; }

  /* curriculum */
  .cur-tabs { flex-wrap:wrap; gap:8px; }
  .ctab { padding:9px 20px; font-size:.83rem; }
  .cp-grid { padding:24px 20px; }
  .cp-main h3 { font-size:1.4rem; }

  /* schools */
  .school-row { flex-direction:column; gap:12px; padding:18px 20px; }
  .school-list { gap:8px; }
  .school-item { padding:8px 14px; font-size:.83rem; }

  /* gallery — 구 코드 제거됨 */

  /* trust */
  .trust-grid { grid-template-columns:1fr 1fr; gap:12px; }
  .trust-item { padding:20px 16px; }
  .ti-icon { width:40px; height:40px; font-size:1rem; margin-bottom:12px; }
  .trust-item h4 { font-size:.9rem; }
  .trust-item p { font-size:.78rem; }

  /* reviews */
  .rv-card { padding:20px 18px 18px; }
  .rv-text { font-size:.83rem; }

  /* cta */
  .cta-sec { padding:56px 20px; }
  .cta-inner { flex-direction:column; text-align:center; gap:28px; }
  .cta-btns { justify-content:center; flex-direction:column; align-items:center; }
  .btn-kakao.lg, .btn-wl.lg { padding:16px 32px; }

  /* contact */
  .contact-grid { gap:28px; }

  /* footer */
  .ft-grid { grid-template-columns:1fr; text-align:center; padding:36px 20px 24px; }
  .ft-brand { justify-content:center; }
  .ft-copy { padding:14px 20px; font-size:.7rem; }

  /* lightbox */
  .lp { left:-40px; } .ln { right:-40px; }
  #lbImg { max-width:92vw; }

  /* fabs — 아이콘만 표시 */
  .fabs { bottom:20px; right:14px; gap:8px; }
  .fabs a {
    width:50px; height:50px; padding:0;
    justify-content:center; border-radius:50%;
    overflow:hidden;
  }
  .fabs a i { font-size:1.15rem; }
  .fabs a svg { width:20px; height:20px; }
  .fabs .fab-k span, .fabs .fab-c span { display:none; }
  /* 텍스트 노드 숨김: 버튼 텍스트 축소 */
  .fab-k { font-size:0; gap:0; }
  .fab-c { font-size:0; gap:0; }
  .fab-k i, .fab-k svg { font-size:1.15rem; }
  .fab-c i, .fab-c svg { font-size:1.15rem; }
}

@media (max-width:480px) {
  .sec { padding:56px 0; }
  .hero-h1 .line1, .hero-h1 .line3 { font-size:1.75rem; }
  .hero-h1 .line2 { font-size:clamp(2.8rem, 12vw, 4rem); }
  .sec-title { font-size:clamp(1.65rem, 6vw, 1.9rem); }
  .trust-grid { grid-template-columns:1fr 1fr; }
  /* gallery — 구 코드 제거됨 */
  .school-row { padding:16px; }
  .review-grid { grid-template-columns:1fr; }
}
