/* =========================================================
   2YOON Ballet & Dance — 강렬한 디자인 (핑크 + 화이트, 핑크 그라데이션)
   소개 페이지(ballet/index) 전용. 핑크·화이트 유지.
   ========================================================= */
:root{
  --dx-navy:#ad1457;
  --dx-navy-2:#d6336c;
  --dx-gold:#ffd9e6;
  --dx-gold-soft:#ffe8f0;
  --dx-ink:#2a1420;
}

/* ---------- 공통 타이포 ---------- */
.dx-eyebrow{font-family:"Noto Sans KR",sans-serif;font-size:12px;font-weight:700;letter-spacing:.32em;text-transform:uppercase;color:var(--dx-gold)}
.dx-title{font-family:"Noto Sans KR",sans-serif;font-weight:900;letter-spacing:-.035em;line-height:1.18;word-break:keep-all}
.dx-hl{position:relative;display:inline-block;z-index:0}
.dx-hl::after{content:"";position:absolute;left:-2px;right:-2px;bottom:.06em;height:.34em;background:var(--dx-gold);opacity:.85;z-index:-1;transform-origin:left;transform:scaleX(0);animation:dxHl .9s .5s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes dxHl{to{transform:scaleX(1)}}

/* ---------- 히어로 ---------- */
.dx-hero{position:relative;min-height:calc(100vh - 124px);min-height:calc(100svh - 124px);display:flex;align-items:flex-end;overflow:hidden;background:var(--dx-navy);color:#fff;margin-top:-1px}
.dx-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.06);animation:dxZoom 14s ease-out forwards}
@keyframes dxZoom{to{transform:scale(1)}}
.dx-hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(120,10,60,.35) 0%,rgba(120,10,60,.55) 45%,rgba(120,10,60,.96) 100%)}
.dx-hero-word{position:absolute;z-index:1;right:-2vw;top:40px;font-family:"Noto Sans KR",sans-serif;font-weight:900;font-size:clamp(90px,17vw,260px);line-height:.85;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.22);white-space:nowrap;pointer-events:none;user-select:none}
.dx-hero .wrap{position:relative;z-index:2;width:100%;padding-bottom:clamp(48px,8vh,96px);padding-top:110px}
.dx-hero .dx-eyebrow{color:var(--dx-gold-soft);text-shadow:0 1px 8px rgba(0,0,0,.5)}
.dx-hero h1{font-size:clamp(38px,6.4vw,84px);color:#fff;margin:18px 0 22px}
.dx-hero h1 .dx-hl::after{opacity:.9}
.dx-hero-sub{font-size:clamp(15px,1.4vw,18px);color:rgba(255,255,255,.82);line-height:1.8;max-width:560px;word-break:keep-all}
.dx-hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}
.dx-btn{display:inline-flex;align-items:center;gap:10px;padding:16px 30px;border-radius:999px;font-size:15px;font-weight:700;text-decoration:none;transition:transform .2s,background .2s,color .2s}
.dx-btn:hover{transform:translateY(-2px)}
.dx-btn-gold{background:var(--dx-gold);color:var(--dx-navy)}
.dx-btn-gold:hover{background:#fff}
.dx-btn-line{border:1.5px solid rgba(255,255,255,.6);color:#fff}
.dx-btn-line:hover{background:#fff;color:var(--dx-navy)}
.dx-scroll{position:absolute;z-index:2;right:30px;bottom:30px;font-size:11px;letter-spacing:.3em;color:rgba(255,255,255,.6);writing-mode:vertical-rl}
.dx-scroll::after{content:"";display:block;width:1px;height:56px;background:rgba(255,255,255,.4);margin:12px auto 0;animation:dxLine 1.8s infinite}
@keyframes dxLine{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ---------- 흐르는 띠 ---------- */
.dx-marquee{background:var(--dx-gold);color:var(--dx-navy);overflow:hidden;white-space:nowrap;padding:16px 0;border-top:1px solid rgba(0,0,0,.06)}
.dx-marquee-track{display:inline-flex;gap:0;animation:dxMarq 26s linear infinite}
.dx-marquee span{font-family:"Noto Sans KR",sans-serif;font-weight:900;font-size:clamp(18px,2.2vw,26px);letter-spacing:-.01em;padding:0 22px}
.dx-marquee span i{font-style:normal;opacity:.45;padding-left:44px}
@keyframes dxMarq{to{transform:translateX(-50%)}}

/* ---------- 포인트 01~04 ---------- */
.dx-points{background:#fff;padding:clamp(80px,10vw,140px) 0}
.dx-points-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:clamp(50px,6vw,80px)}
.dx-points-head h2{font-size:clamp(30px,4.4vw,56px);color:var(--dx-ink);margin-top:14px}
.dx-points-head p{max-width:380px;color:#6b7280;font-size:15px;line-height:1.8;word-break:keep-all}
.dx-point{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(30px,5vw,80px);align-items:center;margin-bottom:clamp(60px,8vw,110px)}
.dx-point:last-child{margin-bottom:0}
.dx-point:nth-child(even) .dx-point-img{order:2}
.dx-point-img{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:4/3;background:#e9edf3}
.dx-point-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s}
.dx-point:hover .dx-point-img img{transform:scale(1.04)}
.dx-point-img::after{content:"";position:absolute;inset:auto 0 0 0;height:6px;background:var(--dx-gold);transform:scaleX(.18);transform-origin:left;transition:transform .6s}
.dx-point:hover .dx-point-img::after{transform:scaleX(1)}
.dx-point-num{font-family:"Noto Sans KR",sans-serif;font-weight:900;font-size:clamp(64px,8vw,110px);line-height:1;color:transparent;-webkit-text-stroke:1.5px var(--dx-navy-2);opacity:.9}
.dx-point-tag{display:inline-block;margin:18px 0 10px;font-size:12px;font-weight:700;letter-spacing:.24em;color:var(--dx-gold)}
.dx-point h3{font-size:clamp(24px,2.8vw,36px);color:var(--dx-ink);margin-bottom:18px}
.dx-point-line{width:100%;max-width:340px;height:1px;background:#d6dbe3;margin-bottom:20px}
.dx-point p{color:#4b5563;font-size:15.5px;line-height:1.9;word-break:keep-all;max-width:440px}

/* ---------- 선생님 띠 ---------- */
.dx-team{background:var(--dx-navy);color:#fff;padding:clamp(80px,10vw,130px) 0}
.dx-team-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:40px}
.dx-team-head h2{font-size:clamp(30px,4.2vw,52px);color:#fff;margin-top:14px}
.dx-team-head a{color:var(--dx-gold-soft);font-weight:700;font-size:14px;text-decoration:none;border-bottom:1px solid rgba(241,220,166,.5);padding-bottom:4px}
.dx-team-row{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.dx-member{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:3/4;background:#1c3a63;text-decoration:none;display:block}
.dx-member img{width:100%;height:100%;object-fit:cover;object-position:center 18%;display:block;filter:grayscale(.35);transition:filter .5s,transform .7s}
.dx-member:hover img{filter:none;transform:scale(1.05)}
.dx-member::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(120,10,60,.92))}
.dx-member b{position:absolute;z-index:1;left:16px;bottom:34px;font-size:18px;font-weight:800;color:#fff;letter-spacing:-.02em}
.dx-member small{position:absolute;z-index:1;left:16px;bottom:14px;font-size:12px;color:var(--dx-gold-soft)}

/* ---------- 숫자 ---------- */
.dx-stats{background:var(--dx-navy-2);color:#fff;padding:clamp(60px,7vw,90px) 0}
.dx-stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.dx-stat{border-left:1px solid rgba(255,255,255,.18);padding:6px 0 6px 24px}
.dx-stat strong{display:block;font-family:"Noto Sans KR",sans-serif;font-weight:900;font-size:clamp(40px,5vw,64px);letter-spacing:-.04em;color:var(--dx-gold);line-height:1}
.dx-stat span{display:block;margin-top:12px;font-size:14px;color:rgba(255,255,255,.75)}

/* ---------- 기존 섹션 다듬기 ---------- */
.bo-about h2,.bo-director-info h3{font-weight:900!important;letter-spacing:-.03em}
.testi-card{border-top:3px solid var(--dx-gold)!important}

/* ---------- 휴대폰 ---------- */
@media(max-width:900px){
  .dx-team-row{grid-template-columns:repeat(3,1fr)}
  .dx-stats-row{grid-template-columns:repeat(2,1fr);row-gap:34px}
}
@media(max-width:720px){
  .dx-hero{min-height:calc(100svh - 110px)}
  .dx-hero .wrap{padding-top:90px}
  .dx-hero-word{top:30px;font-size:28vw}
  .dx-scroll{display:none}
  .dx-btn{padding:14px 24px;font-size:14px}
  .dx-point{grid-template-columns:1fr;gap:22px}
  .dx-point:nth-child(even) .dx-point-img{order:0}
  .dx-point-num{font-size:64px}
  .dx-team-row{grid-template-columns:repeat(2,1fr);gap:10px}
  .dx-member b{font-size:16px}
}
@media(prefers-reduced-motion:reduce){
  .dx-hero-bg,.dx-marquee-track,.dx-scroll::after{animation:none}
  .dx-hl::after{animation:none;transform:none}
}

/* Ballet & Dance 전용 */
.dx-hero{background:linear-gradient(135deg,#f06595 0%,#d6336c 45%,#ad1457 100%)}
.dx-hero::before{background:radial-gradient(circle at 80% 20%,rgba(255,255,255,.22),rgba(255,255,255,0) 45%),linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(90,8,45,.35) 100%)}
.dx-hero-word{-webkit-text-stroke:1.5px rgba(255,255,255,.28)}
.dx-hero-motif{position:absolute;z-index:1;right:2vw;bottom:0;height:80%;opacity:.45;pointer-events:none}
.dx-hero-motif svg{height:100%;width:auto}
.dx-hl::after{background:#8a0d44;opacity:.75}
.dx-hero .dx-eyebrow{color:#fff;text-shadow:none;opacity:.9}
.dx-btn-gold{background:#fff;color:#ad1457}
.dx-btn-gold:hover{background:#ffe8f0}
.dx-marquee{background:#fff;color:#d6336c;border-bottom:1px solid #f6d3df}
.dx-points{background:#fff}
.dx-points .dx-eyebrow,.dx-point-tag{color:#d6336c}
.dx-point-num{-webkit-text-stroke:1.5px #d6336c}
.dx-point-img::after{background:linear-gradient(90deg,#f06595,#ad1457)}
.dx-icon-card{aspect-ratio:4/3;border-radius:28px;background:linear-gradient(135deg,#fff0f5,#ffd9e6);display:flex;align-items:center;justify-content:center}
.dx-icon-card svg{width:38%;height:auto}
.dx-team{background:#fff5f8;color:#2a1420}
.dx-team-head h2{color:#2a1420}
.dx-team .dx-eyebrow{color:#d6336c}
.dx-team-head a{color:#d6336c;border-bottom-color:rgba(214,51,108,.4)}
.dx-member{border-radius:22px;background:#ffd9e6}
.dx-member img{filter:none}
.dx-member::after{background:linear-gradient(180deg,transparent 55%,rgba(173,20,87,.85))}
.dx-member small{color:#ffe8f0}
.dx-stats{background:linear-gradient(135deg,#f06595,#ad1457)}
.dx-stat strong{color:#fff}
.dx-stat{border-left-color:rgba(255,255,255,.35)}
.dx-team-row{grid-template-columns:repeat(5,1fr)}
@media(max-width:900px){.dx-team-row{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.dx-team-row{grid-template-columns:repeat(2,1fr)}.dx-hero-motif{opacity:.25;right:-10vw}}

/* 첫 화면 오른쪽: 사진이 오른쪽 절반을 채우고 왼쪽으로 분홍 배경에 스며듦 */
.dx-hero-photo{position:absolute;z-index:0;top:0;right:0;bottom:0;width:58%;-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.55) 22%,#000 48%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.55) 22%,#000 48%)}
.dx-hero-photo img{width:100%;height:100%;object-fit:cover;object-position:18% 38%;display:block;transform:scale(1.06);animation:dxZoom 14s ease-out forwards}
.dx-hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(214,51,108,.12),rgba(173,20,87,.28))}
.dx-hero-glow{position:absolute;z-index:0;border-radius:50%;filter:blur(10px);pointer-events:none}
.dx-hero-glow.g1{width:420px;height:420px;right:24vw;top:-120px;background:radial-gradient(circle,rgba(255,255,255,.28),rgba(255,255,255,0) 70%)}
.dx-hero-glow.g2{width:360px;height:360px;right:-80px;bottom:-120px;background:radial-gradient(circle,rgba(255,217,230,.35),rgba(255,217,230,0) 70%)}
.dx-hero .wrap{max-width:1140px}
.dx-hero h1,.dx-hero-sub{max-width:min(620px,52vw)}
@media(max-width:900px){.dx-hero-photo{width:75%;opacity:.7}.dx-hero h1,.dx-hero-sub{max-width:none}}
@media(max-width:720px){.dx-hero-photo{width:100%;opacity:.5;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 45%,rgba(0,0,0,.35) 100%);mask-image:linear-gradient(180deg,#000 0%,#000 45%,rgba(0,0,0,.35) 100%)}.dx-hero-photo img{object-position:46% 35%}}

/* 첫 화면 문구 */
.dx-hero h1.dx-title{font-size:clamp(30px,5.12vw,67px)}
.dx-hero-sub.hs-u{font-size:clamp(15px,1.3vw,17px);font-weight:500;color:rgba(255,255,255,.92);line-height:1.75;margin:0 0 16px;max-width:min(620px,52vw)}
.dx-hero-sub.hs-u:last-of-type{margin-bottom:0}
@media(max-width:900px){.dx-hero-sub.hs-u{max-width:none}}

/* 프로그램 소개: 사진 위에 글 */
.pg-card{container-type:inline-size;position:relative;border-radius:26px;overflow:hidden;aspect-ratio:1450/1085;margin-bottom:clamp(28px,4vw,48px);background:#f6e3ea;box-shadow:0 30px 70px -40px rgba(120,10,60,.45)}
.pg-card:last-child{margin-bottom:0}
.pg-card>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.pg-card:hover>img{transform:scale(1.03)}
.pg-card::before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse 70% 60% at 0% 0%,rgba(255,255,255,.72),rgba(255,255,255,0) 70%);pointer-events:none}
.pg-card.pg-dark::before{background:radial-gradient(ellipse 70% 60% at 0% 0%,rgba(40,10,25,.55),rgba(40,10,25,0) 70%)}
.pg-text{position:absolute;z-index:2;left:6%;top:4%;width:44%}
.pg-num{font-family:"Noto Sans KR",sans-serif;font-weight:900;font-size:6.6cqw;line-height:.95;color:transparent;-webkit-text-stroke:1.6px #d6336c;letter-spacing:-.02em}
.pg-tag{display:block;margin:.6cqw 0 .4cqw;font-size:max(11px,1.25cqw);font-weight:800;letter-spacing:.22em;color:#d6336c}
.pg-text h3{font-family:"Noto Sans KR",sans-serif;font-weight:900;font-size:3.45cqw;letter-spacing:-.03em;line-height:1.2;color:#2a1420;margin:0 0 1.6cqw;white-space:nowrap}
.pg-text p{font-size:max(14px,1.4cqw);line-height:1.75;max-width:none;white-space:nowrap;text-shadow:0 0 12px rgba(255,255,255,.9),0 0 3px rgba(255,255,255,.8);color:#4a3a42;word-break:keep-all;margin:0}
.pg-dark .pg-num{-webkit-text-stroke-color:#ffb3cd}
.pg-dark .pg-tag{color:#ffb3cd}
.pg-dark .pg-text h3{color:#fff}
.pg-dark .pg-text p{color:rgba(255,255,255,.92);text-shadow:0 1px 10px rgba(40,10,25,.7)}
@media(max-width:720px){
  .pg-card{aspect-ratio:auto;background:#fff;border-radius:20px}
  .pg-card>img{position:relative;aspect-ratio:1450/1085;height:auto}
  .pg-card::before{display:none}
  .pg-text{position:relative;left:auto;top:auto;width:auto;padding:22px 22px 26px}
  .pg-num{font-size:52px}
  .pg-tag{margin:8px 0 6px;font-size:12px}
  .pg-text h3{font-size:24px;white-space:normal;margin-bottom:12px}
  .pg-text p{font-size:14.5px;max-width:none;white-space:normal;text-shadow:none}
  .pg-br{display:none}
  .pg-dark{background:#3a1626}
}
.nw{white-space:nowrap}
#director .dr2-tags{flex-wrap:nowrap;gap:6px}#director .dr2-tags span{font-size:12px;padding:8px 10px;white-space:nowrap;letter-spacing:-.02em}@media(max-width:1180px){#director .dr2-tags{flex-wrap:wrap}}

/* 수업 현장 사진 */
.cm-sec{background:#fff7fa;padding:clamp(80px,10vw,130px) 0}
.cm-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:clamp(36px,5vw,56px)}
.cm-head h2{font-size:clamp(30px,4.2vw,52px);color:#2a1420;margin-top:14px}
.cm-head p{color:#7a6670;font-size:15px;line-height:1.8;margin:0}
.cm-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(150px,15vw,210px);grid-auto-flow:dense;gap:12px}
.cm-grid figure{margin:0;border-radius:16px;overflow:hidden;background:#f6e3ea;cursor:zoom-in}
.cm-grid img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.cm-grid figure:hover img{transform:scale(1.05)}
.cm-big{grid-column:span 2;grid-row:span 2}.cm-tall{grid-row:span 2}.cm-wide{grid-column:span 2}
.cm-more{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:36px}
.cm-x{display:none}.cm-sec.all .cm-x{display:block}
.cm-more .cm-open{padding:15px 30px;border-radius:999px;border:none;background:#d6336c;color:#fff;font-weight:700;font-size:14.5px;cursor:pointer;font-family:inherit}
.cm-more a{display:inline-block;padding:15px 30px;border-radius:999px;border:1.5px solid #d6336c;color:#d6336c;font-weight:700;font-size:14.5px;text-decoration:none;transition:background .25s,color .25s}
.cm-more a:hover{background:#d6336c;color:#fff}
@media(max-width:720px){.cm-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:130px;gap:8px}.cm-grid figure{border-radius:12px}}

/* 수료증 */
.ct-sec{background:linear-gradient(180deg,#fff7fa,#fff);padding:clamp(80px,10vw,130px) 0;overflow:hidden}
.ct-wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,90px);align-items:center}
.ct-text h2{font-size:clamp(30px,4.2vw,52px);color:#2a1420;margin:14px 0 20px}
.ct-lead{color:#6b5a62;font-size:16px;line-height:1.85;margin:0 0 28px;word-break:keep-all}
.ct-list{list-style:none;margin:0;padding:0;border-top:1px solid #f0d4de}
.ct-list li{display:flex;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid #f0d4de;font-size:15.5px;color:#3a2a32}
.ct-list b{font-size:13px;font-weight:900;color:#d6336c;letter-spacing:.06em}
.ct-img{position:relative;justify-self:center;width:min(100%,420px)}
.ct-img img{width:100%;display:block;border-radius:6px;box-shadow:0 40px 80px -30px rgba(120,10,60,.45),0 0 0 1px rgba(0,0,0,.04);transform:rotate(2.5deg);transition:transform .5s}
.ct-img:hover img{transform:rotate(0) scale(1.02)}
.ct-img::before{content:"";position:absolute;inset:6% -6% -4% 8%;background:#f6d6e2;border-radius:24px;transform:rotate(-4deg);z-index:-1}
.ct-img{z-index:0}
.ct-badge{position:absolute;z-index:2;left:-18px;top:28px;background:#d6336c;color:#fff;font-size:13px;font-weight:800;padding:9px 16px;border-radius:999px;box-shadow:0 12px 24px -10px rgba(173,20,87,.6)}
@media(max-width:820px){.ct-wrap{grid-template-columns:1fr}.ct-img{width:min(86%,360px)}.ct-badge{left:-8px}}
.ct-sec .dx-eyebrow{color:#d6336c}
/* 선생님 카드: 이름·전공이 길어도 겹치지 않게 아래에서 차례로 쌓기 */
.dx-member{display:flex!important;flex-direction:column;justify-content:flex-end;padding:0 16px 14px}
.dx-member img{position:absolute;inset:0}
.dx-member b,.dx-member small{position:relative!important;left:auto!important;bottom:auto!important;z-index:1}
.dx-member b{margin-bottom:4px;line-height:1.25}
.dx-member small{line-height:1.45;word-break:keep-all}