/**
 * ============================================================
 *  디자인 토큰 세트 15종
 * ============================================================
 *  CSS 커스텀 프로퍼티로 정의. 하나의 토큰 세트만 교체하면
 *  같은 레이아웃+전환이 완전히 다른 분위기로 변환됨.
 *
 *  사용법:
 *  <section data-mv-slider data-mv-token="corporate-blue">
 *
 *  변수 목록:
 *  --mv-h        : 슬라이더 높이
 *  --mv-bg       : 배경색 (이미지 로딩 전)
 *  --mv-overlay  : 오버레이 그라데이션
 *  --mv-t1       : 대제목 크기
 *  --mv-t1-w     : 대제목 굵기
 *  --mv-t1-c     : 대제목 색상
 *  --mv-t1-ls    : 대제목 자간
 *  --mv-t2       : 부제목 크기
 *  --mv-t2-w     : 부제목 굵기
 *  --mv-t2-c     : 부제목 색상
 *  --mv-t2-mt    : 부제목 상단 여백
 *  --mv-font-en  : 영문 폰트
 *  --mv-font-ko  : 한글 폰트
 *  --mv-accent   : 포인트 색상
 *  --mv-panel-bg : 패널 배경
 *  --mv-box-bg   : 포인트 박스 배경
 *  --mv-dot-c    : 닷 활성 색상
 *  --mv-arrow-c  : 화살표 색상
 *  --mv-btn-border: 버튼 테두리
 *  --mv-curtain  : 커튼 색상
 * ============================================================
 */


/* ═══════════════════════════════════════════
   T01. CORPORATE-BLUE — 기업/금융 (신뢰, 안정)
   ═══════════════════════════════════════════ */
[data-mv-token="corporate-blue"] {
    --mv-h: 800px;
    --mv-bg: #0a1628;
    --mv-overlay: linear-gradient(135deg, rgba(10,22,40,0.8), rgba(10,22,40,0.3));
    --mv-t1: 48px; --mv-t1-w: 700; --mv-t1-c: #fff; --mv-t1-ls: 1px;
    --mv-t2: 18px; --mv-t2-w: 300; --mv-t2-c: rgba(180,200,230,0.8); --mv-t2-mt: 16px;
    --mv-font-en: "Montserrat", sans-serif;
    --mv-font-ko: "Noto Sans KR", sans-serif;
    --mv-accent: #2b6cb0;
    --mv-panel-bg: rgba(10,22,40,0.4);
    --mv-box-bg: #1a4a8a;
    --mv-dot-c: #4a9eff;
    --mv-curtain: rgba(10,22,40,0.7);
    --mv-btn-border: rgba(74,158,255,0.4);
}

@media(max-width:1200px) { [data-mv-token="corporate-blue"] { --mv-h: 600px; --mv-t1: 38px; } }
@media(max-width:992px)  { [data-mv-token="corporate-blue"] { --mv-h: 480px; --mv-t1: 30px; --mv-t2: 16px; } }
@media(max-width:768px)  { [data-mv-token="corporate-blue"] { --mv-h: 380px; --mv-t1: 26px; --mv-t2: 14px; } }
@media(max-width:576px)  { [data-mv-token="corporate-blue"] { --mv-h: 320px; --mv-t1: 22px; } }


/* ═══════════════════════════════════════════
   T02. MINIMAL-DARK — 미니멀 다크
   ═══════════════════════════════════════════ */
[data-mv-token="minimal-dark"] {
    --mv-h: 100vh;
    --mv-bg: #0a0a0a;
    --mv-overlay: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0.2));
    --mv-t1: 56px; --mv-t1-w: 200; --mv-t1-c: rgba(255,255,255,0.15); --mv-t1-ls: 8px;
    --mv-t2: 15px; --mv-t2-w: 300; --mv-t2-c: rgba(255,255,255,0.5); --mv-t2-mt: 24px;
    --mv-font-en: "Montserrat", sans-serif;
    --mv-font-ko: "Noto Sans KR", sans-serif;
    --mv-accent: #fff;
    --mv-panel-bg: rgba(0,0,0,0.2);
    --mv-dot-c: #fff;
    --mv-curtain: rgba(0,0,0,0.6);
    --mv-btn-border: rgba(255,255,255,0.2);
}

@media(max-width:992px)  { [data-mv-token="minimal-dark"] { --mv-t1: 40px; --mv-t1-ls: 5px; } }
@media(max-width:768px)  { [data-mv-token="minimal-dark"] { --mv-t1: 32px; } }


/* ═══════════════════════════════════════════
   T03. WARM-WOOD — 따뜻한 우드/카페
   ═══════════════════════════════════════════ */
[data-mv-token="warm-wood"] {
    --mv-h: 750px;
    --mv-bg: #1a0f08;
    --mv-overlay: linear-gradient(to right, rgba(26,15,8,0.75), rgba(26,15,8,0.2));
    --mv-t1: 44px; --mv-t1-w: 600; --mv-t1-c: #f5e6d3; --mv-t1-ls: 2px;
    --mv-t2: 16px; --mv-t2-w: 300; --mv-t2-c: rgba(245,230,211,0.7); --mv-t2-mt: 16px;
    --mv-font-en: "Playfair Display", serif;
    --mv-font-ko: "Noto Serif KR", serif;
    --mv-accent: #c88407;
    --mv-panel-bg: rgba(26,15,8,0.35);
    --mv-box-bg: rgba(200,132,7,0.8);
    --mv-dot-c: #c88407;
    --mv-curtain: rgba(26,15,8,0.7);
    --mv-btn-border: rgba(200,132,7,0.4);
}

@media(max-width:992px)  { [data-mv-token="warm-wood"] { --mv-h: 500px; --mv-t1: 34px; } }
@media(max-width:768px)  { [data-mv-token="warm-wood"] { --mv-h: 380px; --mv-t1: 28px; } }


/* ═══════════════════════════════════════════
   T04. TECH-NEON — 테크/IT/스타트업
   ═══════════════════════════════════════════ */
[data-mv-token="tech-neon"] {
    --mv-h: 100vh;
    --mv-bg: #05051a;
    --mv-overlay: linear-gradient(135deg, rgba(5,5,26,0.85), rgba(5,5,26,0.3));
    --mv-t1: 52px; --mv-t1-w: 800; --mv-t1-c: #fff; --mv-t1-ls: -1px;
    --mv-t2: 16px; --mv-t2-w: 300; --mv-t2-c: rgba(130,180,255,0.7); --mv-t2-mt: 18px;
    --mv-font-en: "Inter", "Roboto", sans-serif;
    --mv-font-ko: "Noto Sans KR", sans-serif;
    --mv-accent: #6366f1;
    --mv-panel-bg: rgba(99,102,241,0.08);
    --mv-box-bg: rgba(99,102,241,0.9);
    --mv-dot-c: #818cf8;
    --mv-curtain: rgba(99,102,241,0.5);
    --mv-btn-border: rgba(99,102,241,0.5);
}

@media(max-width:992px)  { [data-mv-token="tech-neon"] { --mv-t1: 38px; } }
@media(max-width:768px)  { [data-mv-token="tech-neon"] { --mv-t1: 30px; } }


/* ═══════════════════════════════════════════
   T05. NATURE-GREEN — 자연/건강/오가닉
   ═══════════════════════════════════════════ */
[data-mv-token="nature-green"] {
    --mv-h: 800px;
    --mv-bg: #0a1a0a;
    --mv-overlay: linear-gradient(to right, rgba(10,26,10,0.7), rgba(10,26,10,0.2));
    --mv-t1: 46px; --mv-t1-w: 600; --mv-t1-c: #e8f5e1; --mv-t1-ls: 1px;
    --mv-t2: 16px; --mv-t2-w: 300; --mv-t2-c: rgba(200,230,190,0.8); --mv-t2-mt: 16px;
    --mv-font-en: "Lora", serif;
    --mv-font-ko: "Noto Sans KR", sans-serif;
    --mv-accent: #68b354;
    --mv-panel-bg: rgba(10,26,10,0.3);
    --mv-box-bg: rgba(104,179,84,0.85);
    --mv-dot-c: #8ed670;
    --mv-curtain: rgba(104,179,84,0.4);
    --mv-btn-border: rgba(104,179,84,0.5);
}

@media(max-width:992px)  { [data-mv-token="nature-green"] { --mv-h: 500px; --mv-t1: 34px; } }
@media(max-width:768px)  { [data-mv-token="nature-green"] { --mv-h: 380px; --mv-t1: 28px; } }


/* ═══════════════════════════════════════════
   T06. LUXURY-GOLD — 고급/프리미엄
   ═══════════════════════════════════════════ */
[data-mv-token="luxury-gold"] {
    --mv-h: 850px;
    --mv-bg: #0c0a06;
    --mv-overlay: linear-gradient(135deg, rgba(12,10,6,0.8), rgba(12,10,6,0.3));
    --mv-t1: 50px; --mv-t1-w: 300; --mv-t1-c: #d4af37; --mv-t1-ls: 6px;
    --mv-t2: 14px; --mv-t2-w: 300; --mv-t2-c: rgba(212,175,55,0.5); --mv-t2-mt: 20px;
    --mv-font-en: "Playfair Display", serif;
    --mv-font-ko: "Noto Serif KR", serif;
    --mv-accent: #d4af37;
    --mv-panel-bg: rgba(212,175,55,0.06);
    --mv-box-bg: rgba(212,175,55,0.15);
    --mv-dot-c: #d4af37;
    --mv-curtain: rgba(212,175,55,0.3);
    --mv-btn-border: rgba(212,175,55,0.4);
}

@media(max-width:992px)  { [data-mv-token="luxury-gold"] { --mv-h: 520px; --mv-t1: 36px; } }
@media(max-width:768px)  { [data-mv-token="luxury-gold"] { --mv-h: 400px; --mv-t1: 28px; } }


/* ═══════════════════════════════════════════
   T07. MEDICAL-CLEAN — 의료/헬스케어
   ═══════════════════════════════════════════ */
[data-mv-token="medical-clean"] {
    --mv-h: 750px;
    --mv-bg: #f0f4f8;
    --mv-overlay: linear-gradient(to bottom, rgba(240,244,248,0.3), rgba(240,244,248,0.1));
    --mv-t1: 42px; --mv-t1-w: 600; --mv-t1-c: #1a365d; --mv-t1-ls: 0px;
    --mv-t2: 16px; --mv-t2-w: 400; --mv-t2-c: rgba(26,54,93,0.6); --mv-t2-mt: 14px;
    --mv-font-en: "Noto Sans", sans-serif;
    --mv-font-ko: "Noto Sans KR", sans-serif;
    --mv-accent: #3182ce;
    --mv-panel-bg: rgba(255,255,255,0.6);
    --mv-box-bg: #3182ce;
    --mv-dot-c: #3182ce;
    --mv-curtain: rgba(49,130,206,0.3);
    --mv-btn-border: rgba(49,130,206,0.5);
}

@media(max-width:992px) { [data-mv-token="medical-clean"] { --mv-h: 480px; --mv-t1: 32px; } }
@media(max-width:768px) { [data-mv-token="medical-clean"] { --mv-h: 360px; --mv-t1: 26px; } }


/* ═══════════════════════════════════════════
   T08. FASHION-MONO — 패션/뷰티 모노톤
   ═══════════════════════════════════════════ */
[data-mv-token="fashion-mono"] {
    --mv-h: 100vh;
    --mv-bg: #111;
    --mv-overlay: linear-gradient(to bottom, rgba(0,0,0,0.2), rgba(0,0,0,0.6));
    --mv-t1: 64px; --mv-t1-w: 100; --mv-t1-c: #fff; --mv-t1-ls: 12px;
    --mv-t2: 12px; --mv-t2-w: 300; --mv-t2-c: rgba(255,255,255,0.4); --mv-t2-mt: 30px;
    --mv-font-en: "Cormorant Garamond", serif;
    --mv-font-ko: "Noto Serif KR", serif;
    --mv-accent: #fff;
    --mv-panel-bg: rgba(0,0,0,0.15);
    --mv-dot-c: #fff;
    --mv-curtain: rgba(0,0,0,0.5);
    --mv-btn-border: rgba(255,255,255,0.15);
}


/* ═══════════════════════════════════════════
   T09. EDUCATION-WARM — 교육/학원
   ═══════════════════════════════════════════ */
[data-mv-token="education-warm"] {
    --mv-h: 700px;
    --mv-bg: #1a1440;
    --mv-overlay: linear-gradient(135deg, rgba(26,20,64,0.75), rgba(26,20,64,0.25));
    --mv-t1: 40px; --mv-t1-w: 700; --mv-t1-c: #fff; --mv-t1-ls: 0;
    --mv-t2: 16px; --mv-t2-w: 400; --mv-t2-c: rgba(255,200,100,0.8); --mv-t2-mt: 14px;
    --mv-font-en: "Poppins", sans-serif;
    --mv-font-ko: "Noto Sans KR", sans-serif;
    --mv-accent: #f6ad55;
    --mv-panel-bg: rgba(246,173,85,0.1);
    --mv-box-bg: rgba(246,173,85,0.9);
    --mv-dot-c: #f6ad55;
    --mv-curtain: rgba(246,173,85,0.4);
    --mv-btn-border: rgba(246,173,85,0.5);
}

@media(max-width:992px) { [data-mv-token="education-warm"] { --mv-h: 460px; --mv-t1: 30px; } }
@media(max-width:768px) { [data-mv-token="education-warm"] { --mv-h: 360px; --mv-t1: 24px; } }


/* ═══════════════════════════════════════════
   T10. FOOD-APPETIZING — 음식/레스토랑
   ═══════════════════════════════════════════ */
[data-mv-token="food-appetizing"] {
    --mv-h: 780px;
    --mv-bg: #1a0800;
    --mv-overlay: linear-gradient(to right, rgba(26,8,0,0.8), rgba(26,8,0,0.15));
    --mv-t1: 44px; --mv-t1-w: 500; --mv-t1-c: #fff8f0; --mv-t1-ls: 1px;
    --mv-t2: 16px; --mv-t2-w: 300; --mv-t2-c: rgba(255,200,150,0.7); --mv-t2-mt: 14px;
    --mv-font-en: "Playfair Display", serif;
    --mv-font-ko: "Noto Sans KR", sans-serif;
    --mv-accent: #e53e3e;
    --mv-panel-bg: rgba(229,62,62,0.08);
    --mv-box-bg: rgba(229,62,62,0.85);
    --mv-dot-c: #fc8181;
    --mv-curtain: rgba(229,62,62,0.4);
    --mv-btn-border: rgba(229,62,62,0.5);
}

@media(max-width:992px) { [data-mv-token="food-appetizing"] { --mv-h: 500px; --mv-t1: 34px; } }
@media(max-width:768px) { [data-mv-token="food-appetizing"] { --mv-h: 380px; --mv-t1: 26px; } }


/* ═══════════════════════════════════════════
   T11. REAL-ESTATE — 부동산/건설/인테리어
   ═══════════════════════════════════════════ */
[data-mv-token="real-estate"] {
    --mv-h: 800px;
    --mv-bg: #12120f;
    --mv-overlay: linear-gradient(to right, rgba(18,18,15,0.7), rgba(18,18,15,0.2));
    --mv-t1: 46px; --mv-t1-w: 600; --mv-t1-c: #fff; --mv-t1-ls: 2px;
    --mv-t2: 15px; --mv-t2-w: 300; --mv-t2-c: rgba(255,255,255,0.6); --mv-t2-mt: 16px;
    --mv-font-en: "Montserrat", sans-serif;
    --mv-font-ko: "Noto Sans KR", sans-serif;
    --mv-accent: #957964;
    --mv-panel-bg: rgba(149,121,100,0.12);
    --mv-box-bg: rgba(149,121,100,0.85);
    --mv-dot-c: #c4a882;
    --mv-curtain: rgba(149,121,100,0.4);
    --mv-btn-border: rgba(149,121,100,0.5);
}


/* ═══════════════════════════════════════════
   T12. CREATIVE-GRADIENT — 크리에이티브/디자인 에이전시
   ═══════════════════════════════════════════ */
[data-mv-token="creative-gradient"] {
    --mv-h: 100vh;
    --mv-bg: #0f0f1a;
    --mv-overlay: linear-gradient(135deg, rgba(99,102,241,0.3), rgba(236,72,153,0.2), rgba(245,158,11,0.1));
    --mv-t1: 60px; --mv-t1-w: 800; --mv-t1-c: #fff; --mv-t1-ls: -2px;
    --mv-t2: 16px; --mv-t2-w: 300; --mv-t2-c: rgba(255,255,255,0.6); --mv-t2-mt: 20px;
    --mv-font-en: "Sora", "Inter", sans-serif;
    --mv-font-ko: "Noto Sans KR", sans-serif;
    --mv-accent: #ec4899;
    --mv-panel-bg: rgba(236,72,153,0.06);
    --mv-box-bg: linear-gradient(135deg, #6366f1, #ec4899);
    --mv-dot-c: #f472b6;
    --mv-curtain: rgba(236,72,153,0.4);
    --mv-btn-border: rgba(236,72,153,0.4);
}


/* ═══════════════════════════════════════════
   T13. LAW-AUTHORITY — 법률/컨설팅 (권위, 전문)
   ═══════════════════════════════════════════ */
[data-mv-token="law-authority"] {
    --mv-h: 750px;
    --mv-bg: #0f0d0a;
    --mv-overlay: linear-gradient(to right, rgba(15,13,10,0.85), rgba(15,13,10,0.3));
    --mv-t1: 42px; --mv-t1-w: 400; --mv-t1-c: #c9b896; --mv-t1-ls: 3px;
    --mv-t2: 15px; --mv-t2-w: 300; --mv-t2-c: rgba(201,184,150,0.6); --mv-t2-mt: 18px;
    --mv-font-en: "EB Garamond", serif;
    --mv-font-ko: "Noto Serif KR", serif;
    --mv-accent: #8b7355;
    --mv-panel-bg: rgba(139,115,85,0.1);
    --mv-box-bg: rgba(139,115,85,0.7);
    --mv-dot-c: #c9b896;
    --mv-curtain: rgba(15,13,10,0.6);
    --mv-btn-border: rgba(201,184,150,0.3);
}


/* ═══════════════════════════════════════════
   T14. EVENT-FESTIVE — 이벤트/프로모션/세일
   ═══════════════════════════════════════════ */
[data-mv-token="event-festive"] {
    --mv-h: 700px;
    --mv-bg: #1a0020;
    --mv-overlay: linear-gradient(135deg, rgba(26,0,32,0.6), rgba(26,0,32,0.1));
    --mv-t1: 54px; --mv-t1-w: 900; --mv-t1-c: #fff; --mv-t1-ls: -1px;
    --mv-t2: 18px; --mv-t2-w: 500; --mv-t2-c: #ffd700; --mv-t2-mt: 12px;
    --mv-font-en: "Oswald", sans-serif;
    --mv-font-ko: "Noto Sans KR", sans-serif;
    --mv-accent: #ffd700;
    --mv-panel-bg: rgba(255,215,0,0.06);
    --mv-box-bg: linear-gradient(135deg, #ff3366, #ff6b35);
    --mv-dot-c: #ffd700;
    --mv-curtain: rgba(255,51,102,0.5);
    --mv-btn-border: rgba(255,215,0,0.5);
}

@media(max-width:992px) { [data-mv-token="event-festive"] { --mv-h: 450px; --mv-t1: 38px; } }
@media(max-width:768px) { [data-mv-token="event-festive"] { --mv-h: 360px; --mv-t1: 30px; } }


/* ═══════════════════════════════════════════
   T15. MINIMAL-LIGHT — 미니멀 화이트
   ═══════════════════════════════════════════ */
[data-mv-token="minimal-light"] {
    --mv-h: 800px;
    --mv-bg: #fafafa;
    --mv-overlay: linear-gradient(to bottom, rgba(255,255,255,0.4), rgba(255,255,255,0.1));
    --mv-t1: 48px; --mv-t1-w: 600; --mv-t1-c: #1a1a1a; --mv-t1-ls: 1px;
    --mv-t2: 16px; --mv-t2-w: 400; --mv-t2-c: rgba(26,26,26,0.5); --mv-t2-mt: 16px;
    --mv-font-en: "Inter", sans-serif;
    --mv-font-ko: "Noto Sans KR", sans-serif;
    --mv-accent: #1a1a1a;
    --mv-panel-bg: rgba(255,255,255,0.6);
    --mv-box-bg: #1a1a1a;
    --mv-dot-c: #1a1a1a;
    --mv-curtain: rgba(255,255,255,0.7);
    --mv-btn-border: rgba(26,26,26,0.3);
}

@media(max-width:992px) { [data-mv-token="minimal-light"] { --mv-h: 500px; --mv-t1: 36px; } }
@media(max-width:768px) { [data-mv-token="minimal-light"] { --mv-h: 380px; --mv-t1: 28px; } }


/* ═══════════════════════════════════════════
   토큰 → 엔진 연결
   height와 font-family를 자동 적용
   ═══════════════════════════════════════════ */
[data-mv-token] {
    height: var(--mv-h, 800px);
    background: var(--mv-bg, #000);
    font-family: var(--mv-font-ko, "Noto Sans KR", sans-serif);
}

[data-mv-token] h1, [data-mv-token] h2,
[data-mv-token] .mv-btn {
    font-family: var(--mv-font-en, "Montserrat", sans-serif);
}

[data-mv-token] .mv-overlay {
    background: var(--mv-overlay);
}

[data-mv-token] .mv-dot.active {
    background: var(--mv-dot-c, #fff);
}

[data-mv-token] .mv-curtain {
    background: var(--mv-curtain, rgba(0,0,0,0.5));
}

[data-mv-token] .mv-btn {
    border-color: var(--mv-btn-border, rgba(255,255,255,0.4));
}