/* ═══════════════════════════════
       CSS 변수 — W(최대너비) 20% 확대
    ═══════════════════════════════ */
    :root {
      --bg:    #04080f;
      --bg2:   #070e1c;
      --bg3:   #0b1325;
      --blue:  #1a6fff;
      --blue2: #4d9aff;
      --cyan:  #00cfff;
      --gold:  #f0b429;
      --gold2: #ffe08a;
      --red:   #ff3737;
      --wh:    #ffffff;
      --gr:    #7a96b8;
      --gr2:   #3a5070;
      --W:     1032px; /* 860 × 1.2 = 1032 */
    }

    /* ── 전체 폰트 20% 확대: html font-size를 120%로 ── */
    html { font-size: 120%; scroll-behavior:smooth; }

    *, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
    body { font-family:'Noto Sans KR',sans-serif; background:var(--bg); color:var(--wh); overflow-x:hidden; }

    /* ═══════════════════════════════
       키프레임
    ═══════════════════════════════ */
    @keyframes fadeUp    { from{opacity:0;transform:translateY(44px)} to{opacity:1;transform:none} }
    @keyframes fadeIn    { from{opacity:0} to{opacity:1} }
    @keyframes pulse     { 0%,100%{opacity:1} 50%{opacity:.28} }
    @keyframes float     { 0%,100%{transform:translateY(0) rotate(-1deg)} 50%{transform:translateY(-14px) rotate(1deg)} }
    @keyframes shimmer   { 0%{background-position:-200% center} 100%{background-position:200% center} }
    @keyframes ticker    { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
    @keyframes scanline  { 0%{transform:translateY(-100%)} 100%{transform:translateY(100vh)} }
    @keyframes glow      { 0%,100%{filter:drop-shadow(0 0 8px var(--gold))} 50%{filter:drop-shadow(0 0 28px var(--gold)) drop-shadow(0 0 56px rgba(240,180,41,.5))} }
    @keyframes glowRed   { 0%,100%{box-shadow:0 0 8px rgba(255,55,55,.3)} 50%{box-shadow:0 0 22px rgba(255,55,55,.75)} }
    @keyframes glowBlue  { 0%,100%{box-shadow:0 0 12px rgba(26,111,255,.2)} 50%{box-shadow:0 0 32px rgba(26,111,255,.55),0 0 64px rgba(0,207,255,.2)} }
    @keyframes ringCW    { to{transform:translate(-50%,-50%) rotate(360deg)} }
    @keyframes ringCCW   { to{transform:translate(-50%,-50%) rotate(-360deg)} }
    @keyframes scrollB   { 0%,100%{transform:translateX(-50%) translateY(0)} 50%{transform:translateX(-50%) translateY(8px)} }
    @keyframes ripple    { 0%{transform:scale(0);opacity:.6} 100%{transform:scale(4);opacity:0} }
    @keyframes sweep     { 0%{left:-60%} 100%{left:140%} }
    @keyframes borderRun { 0%{background-position:0% 50%} 100%{background-position:200% 50%} }
    @keyframes popIn     { 0%{opacity:0;transform:scale(.5) rotate(-8deg)} 70%{transform:scale(1.08)} 100%{opacity:1;transform:scale(1) rotate(0)} }
    @keyframes neonGold  { 0%,100%{text-shadow:0 0 10px var(--gold),0 0 20px rgba(240,180,41,.4)} 50%{text-shadow:0 0 20px var(--gold),0 0 40px rgba(240,180,41,.7),0 0 60px rgba(240,180,41,.3)} }
    @keyframes bgShift   { 0%,100%{background-position:0% 50%} 50%{background-position:100% 50%} }
    @keyframes winPulse  { 0%,100%{transform:scale(1)} 40%{transform:scale(1.12)} }
    @keyframes flicker   { 0%,100%{opacity:1} 93%{opacity:.4} 94%{opacity:1} 96%{opacity:.6} }
    @keyframes countUp   { from{opacity:0;transform:translateY(18px) scale(.82)} to{opacity:1;transform:none} }
    @keyframes lineGrow  { from{transform:scaleX(0)} to{transform:scaleX(1)} }
    @keyframes cardIn    { from{opacity:0;transform:translateY(48px)} to{opacity:1;transform:translateY(0)} }
    @keyframes scanCard  { 0%{transform:translateY(-100%)} 100%{transform:translateY(200%)} }

    /* ═══════════════════════════════
       Reveal — 스크롤 진입
    ═══════════════════════════════ */
    .rv { opacity:0; transform:translateY(36px); transition:opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1); }
    .rv.fl { transform:translateX(-48px); }
    .rv.fr { transform:translateX(48px); }
    .rv.fs { transform:scale(.88); opacity:0; }
    .rv.on { opacity:1!important; transform:none!important; }
    .d1{transition-delay:.08s} .d2{transition-delay:.16s} .d3{transition-delay:.24s}
    .d4{transition-delay:.32s} .d5{transition-delay:.40s}

    /* ═══════════════════════════════
       HERO — 패딩·로고·텍스트 20% 확대
    ═══════════════════════════════ */
    .hero {
      position:relative; min-height:100svh;
      display:flex; flex-direction:column; align-items:center; justify-content:center;
      text-align:center; padding:86px 6% 65px; overflow:hidden;
      /* 96 = 80×1.2, 72 = 60×1.2 */
    }
    .hero-bg {
      position:absolute; inset:0; pointer-events:none;
      background:
        radial-gradient(ellipse 80% 60% at 50% 0%,  rgba(26,111,255,.22),transparent 65%),
        radial-gradient(ellipse 60% 50% at 20% 80%, rgba(0,207,255,.1),transparent 60%),
        radial-gradient(ellipse 50% 40% at 80% 70%, rgba(240,180,41,.07),transparent 60%),
        var(--bg);
    }
    #particleCanvas { position:absolute; inset:0; pointer-events:none; z-index:0; }
    .scanline { position:absolute; inset:0; pointer-events:none; z-index:1; overflow:hidden; }
    .scanline::after { content:''; position:absolute; left:0; right:0; height:2px; background:linear-gradient(transparent,rgba(26,111,255,.1),transparent); animation:scanline 4s linear infinite; }
    .hero-grid {
      position:absolute; inset:0; pointer-events:none;
      background-image:linear-gradient(rgba(26,111,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(26,111,255,.05) 1px,transparent 1px);
      background-size:72px 72px; /* 60×1.2 */
      mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,black 30%,transparent 100%);
    }
    .hero-ring { position:absolute; border-radius:50%; pointer-events:none; top:50%; left:50%; }
    /* 링 크기 20% 확대: 500→600, 760→912, 1060→1272 */
    .r1 { width:600px; height:600px; transform:translate(-50%,-50%); border:1px solid rgba(26,111,255,.14); animation:ringCW 18s linear infinite, glowBlue 4s ease-in-out infinite; }
    .r2 { width:912px; height:912px; transform:translate(-50%,-50%); border:1px dashed rgba(0,207,255,.07); animation:ringCCW 30s linear infinite; }
    .r3 { width:1272px; height:1272px; transform:translate(-50%,-50%); border:1px solid rgba(240,180,41,.04); animation:ringCW 48s linear infinite; }
    .r1::before { content:''; position:absolute; top:0; left:50%; transform:translateX(-50%); width:10px; height:10px; border-radius:50%; background:var(--blue2); box-shadow:0 0 14px var(--blue2),0 0 28px rgba(77,154,255,.5); }
    .r2::before { content:''; position:absolute; bottom:0; right:30%; width:7px; height:7px; border-radius:50%; background:var(--cyan); box-shadow:0 0 12px var(--cyan); }
    .vline { position:absolute; left:5%; top:15%; bottom:15%; width:1px; background:linear-gradient(transparent,rgba(26,111,255,.4),rgba(0,207,255,.6),rgba(26,111,255,.4),transparent); animation:flicker 6s ease-in-out infinite; }
    .vline::after { content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:7px; height:7px; background:var(--cyan); border-radius:50%; box-shadow:0 0 14px var(--cyan),0 0 28px rgba(0,207,255,.4); animation:pulse 1.5s ease-in-out infinite; }
    .vline-r { position:absolute; right:5%; top:20%; bottom:20%; width:1px; background:linear-gradient(transparent,rgba(240,180,41,.25),rgba(240,180,41,.45),rgba(240,180,41,.25),transparent); }
    .hero-content { position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; gap:clamp(13px,2.25vw,23px); }

    /* LIVE 배지 */
    .live-badge {
      display:inline-flex; align-items:center; gap:10px;
      border:1px solid rgba(255,55,55,.4); background:rgba(255,55,55,.08);
      border-radius:4px; padding:6px 17px;
      font-size:clamp(14px,1.56vw,17px); /* ×1.2 */
      font-weight:700; letter-spacing:.12em; color:var(--red);
      animation:fadeUp .5s ease both,glowRed 2s ease-in-out infinite .5s;
    }
    .live-dot { width:8px; height:8px; border-radius:50%; background:var(--red); animation:pulse 1.1s ease-in-out infinite; box-shadow:0 0 7px var(--red); }

    /* 로고 */
    .logo-wrap { animation:float 4s ease-in-out infinite, fadeIn .8s .1s ease both; filter:drop-shadow(0 0 30px rgba(26,111,255,.6)) drop-shadow(0 0 60px rgba(26,111,255,.25)); }
    .logo-wrap img { width:clamp(173px,31.5vw,302px); height:auto; } /* 160→192, 280→336 */

    /* 타이틀 */
    .hero-kicker {
      font-family:'Bebas Neue',sans-serif;
      font-size:clamp(18px,2.4vw,26px); letter-spacing:.14em;
      color:var(--blue2); animation:fadeUp .6s .15s ease both;
    }
    .hero-hl {
      font-family:'Bebas Neue',sans-serif;
      font-size:clamp(47px,9.7vw,104px);
      line-height:1; letter-spacing:.04em; animation:fadeUp .7s .2s ease both;
    }
    /* 한글 제목은 Bebas Neue 가 없으므로 굵은 고딕으로 받쳐 줍니다 */
    .hero-hl .line1, .hero-hl .line2 { word-break:keep-all; }
    .hero-hl .line1 { display:block; color:var(--wh); }
    .hero-hl .line2 { display:block; background:linear-gradient(90deg,var(--gold),var(--gold2),var(--gold)); background-size:200% auto; -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; animation:shimmer 2.5s linear infinite, glow 3s ease-in-out infinite; }

    /* 서브 */
    .hero-sub {
      font-size:clamp(15px,1.94vw,21px);
      color:var(--gr); line-height:1.9; max-width:624px; /* 520→624 */
      animation:fadeUp .7s .35s ease both;
    }
    .hero-sub strong { color:var(--wh); }

    /* CTA */
    .cta-group { display:flex; flex-direction:column; align-items:center; gap:12px; animation:fadeUp .7s .5s ease both; }
    .btn-main {
      position:relative; overflow:hidden;
      display:inline-flex; align-items:center; gap:12px;
      padding:clamp(14px,1.8vw,18px) clamp(31px,4.5vw,52px);
      font-size:clamp(17px,1.94vw,21px);
      font-weight:900; letter-spacing:.04em;
      color:var(--bg); text-decoration:none; border-radius:6px;
      background:linear-gradient(90deg,var(--gold),#ff9f1c,var(--gold)); background-size:200% auto;
      animation:shimmer 2s linear infinite;
      transition:transform .2s,box-shadow .2s;
      box-shadow:0 4px 32px rgba(240,180,41,.45); cursor:pointer; border:none;
    }
    .btn-main::before { content:''; position:absolute; top:0; left:-60%; width:40%; height:100%; background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent); transform:skewX(-15deg); animation:sweep 2.5s ease-in-out infinite; }
    .btn-main:hover { transform:translateY(-3px) scale(1.04); box-shadow:0 10px 44px rgba(240,180,41,.7); }
    .btn-main .arr { font-size:1.2em; transition:transform .2s; }
    .btn-main:hover .arr { transform:translateX(4px); }
    .ripple-el { position:absolute; border-radius:50%; background:rgba(255,255,255,.35); animation:ripple .6s linear; pointer-events:none; }
    .cta-note { font-size:clamp(14px,1.56vw,17px); color:var(--gr); } /* ×1.2 */

    /* 시청자 바 */
    .viewer-bar { display:flex; gap:clamp(10px,1.5vw,19px); flex-wrap:wrap; justify-content:center; animation:fadeUp .7s .65s ease both; }
    .vcard {
      display:flex; align-items:center; gap:10px;
      background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1);
      border-radius:6px; padding:clamp(8px,1.2vw,13px) clamp(14px,2vw,22px); /* ×1.2 */
      transition:border-color .3s,background .3s,transform .3s;
    }
    .vcard:hover { border-color:rgba(26,111,255,.4); background:rgba(26,111,255,.06); transform:translateY(-2px); }
    .vcard-dot { width:7px; height:7px; border-radius:50%; background:var(--red); animation:pulse 1s ease-in-out infinite; box-shadow:0 0 6px var(--red); }
    .vcard-ch  { font-size:clamp(14px,1.56vw,17px); color:var(--gr); } /* ×1.2 */
    .vcard-num { font-size:clamp(17px,1.92vw,20px); font-weight:700; color:var(--wh); } /* ×1.2 */

    .scroll-hint { position:absolute; bottom:34px; left:50%; display:flex; flex-direction:column; align-items:center; gap:7px; font-size:14px; letter-spacing:.1em; color:var(--gr); opacity:.5; animation:scrollB 2s ease-in-out infinite 1.5s, fadeIn 1s 1.2s ease both; }
    .scroll-hint-line { width:1px; height:48px; background:linear-gradient(var(--gr),transparent); }

    /* ═══════════════════════════════
       TICKER
    ═══════════════════════════════ */
    .ticker-wrap { overflow:hidden; background:rgba(26,111,255,.12); border-top:1px solid rgba(26,111,255,.25); border-bottom:1px solid rgba(26,111,255,.25); padding:13px 0; white-space:nowrap; }
    .ticker-inner { display:inline-flex; gap:0; animation:ticker 18s linear infinite; }
    .ticker-inner:hover { animation-play-state:paused; }
    .ticker-item {
      display:inline-flex; align-items:center; gap:12px; padding:0 48px;
      font-size:clamp(16px,1.68vw,19px); /* ×1.2 */
      font-weight:700; letter-spacing:.06em; color:var(--cyan); transition:color .2s;
    }
    .ticker-item:hover { color:var(--gold); }
    .ticker-sep { color:rgba(0,207,255,.3); }

    /* ═══════════════════════════════════════════
       공통 섹션
    ═══════════════════════════════════════════ */
    .sec-wrap { max-width:var(--W); margin:0 auto; padding:clamp(72px,9vw,120px) 6%; } /* ×1.2 */
    .eyebrow { display:inline-flex; align-items:center; gap:11px; margin-bottom:12px; }
    .eyebrow-dot { width:10px; height:10px; border-radius:50%; }
    .eyebrow-text { font-size:clamp(13px,1.3vw,16px); font-weight:700; letter-spacing:.15em; text-transform:uppercase; } /* ×1.2 */
    .sec-title {
      font-family:'Bebas Neue',sans-serif;
      font-size:clamp(41px,6vw,70px); /* ×1.2 */
      line-height:1.1; letter-spacing:.03em;
      margin-bottom:clamp(38px,5vw,62px);
    }
    .sec-title .gold { color:var(--gold); }
    .sec-title .cyan { color:var(--cyan); }

    /* ═══════════════════════════════════════════
       ① 카운터 배너
    ═══════════════════════════════════════════ */
    .counter-band {
      position:relative; overflow:hidden;
      background:var(--bg);
      padding: clamp(72px,8vw,120px) 0; /* ×1.2 */
    }
    .counter-band::before {
      content:''; position:absolute; inset:0; pointer-events:none;
      background-image:
        linear-gradient(rgba(26,111,255,.04) 1px,transparent 1px),
        linear-gradient(90deg,rgba(26,111,255,.04) 1px,transparent 1px);
      background-size:62px 62px; /* 52×1.2 */
    }
    .counter-band-glow {
      position:absolute; inset:0; pointer-events:none;
      background:
        radial-gradient(ellipse 55% 80% at 15% 50%,rgba(26,111,255,.07),transparent 70%),
        radial-gradient(ellipse 45% 70% at 85% 50%,rgba(240,180,41,.05),transparent 70%);
    }
    .counter-band-topline {
      position:absolute; top:0; left:0; right:0; height:2px;
      background:linear-gradient(90deg,transparent,var(--blue) 20%,var(--cyan) 50%,var(--gold) 80%,transparent);
      background-size:200% 100%; animation:bgShift 6s ease-in-out infinite;
    }
    .counter-grid {
      max-width:1200px; margin:0 auto; /* 1000×1.2 */
      display:grid; grid-template-columns:repeat(4,1fr);
      padding:0 6%;
      gap:2px; position:relative; z-index:2;
    }
    .ctr-cell {
      text-align:center;
      padding:clamp(34px,4vw,62px) clamp(19px,2vw,34px); /* ×1.2 */
      position:relative;
      border:1px solid rgba(255,255,255,.05);
      background:rgba(255,255,255,.02);
      transition:background .4s,border-color .4s,transform .4s;
    }
    .ctr-cell:hover { background:rgba(26,111,255,.06); border-color:rgba(26,111,255,.2); transform:translateY(-6px); z-index:3; }
    .ctr-cell::before {
      content:''; position:absolute; top:0; left:0; right:0; height:3px;
      border-radius:0; transform:scaleX(0); transform-origin:left;
      transition:transform .8s cubic-bezier(.22,1,.36,1) .2s;
    }
    .ctr-cell.on::before { transform:scaleX(1); }
    .ctr-cell:nth-child(1)::before { background:linear-gradient(90deg,var(--gold),var(--gold2)); }
    .ctr-cell:nth-child(2)::before { background:linear-gradient(90deg,var(--cyan),var(--blue2)); }
    .ctr-cell:nth-child(3)::before { background:linear-gradient(90deg,var(--blue),var(--cyan)); }
    .ctr-cell:nth-child(4)::before { background:linear-gradient(90deg,var(--red),#ff8080); }
    .ctr-cell .orb {
      position:absolute; border-radius:50%; pointer-events:none;
      width:240px; height:240px; top:50%; left:50%; /* 200×1.2 */
      transform:translate(-50%,-50%);
      opacity:0; transition:opacity .4s;
    }
    .ctr-cell:hover .orb { opacity:1; }
    .ctr-cell:nth-child(1) .orb { background:radial-gradient(circle,rgba(240,180,41,.09),transparent 70%); }
    .ctr-cell:nth-child(2) .orb { background:radial-gradient(circle,rgba(0,207,255,.08),transparent 70%); }
    .ctr-cell:nth-child(3) .orb { background:radial-gradient(circle,rgba(26,111,255,.09),transparent 70%); }
    .ctr-cell:nth-child(4) .orb { background:radial-gradient(circle,rgba(255,55,55,.08),transparent 70%); }

    .ctr-num {
      display:block;
      font-family:'Bebas Neue',sans-serif;
      font-size:clamp(86px,10vw,144px); /* 72→86, 120→144 */
      line-height:.9; letter-spacing:.02em;
      color:var(--gold); animation:neonGold 3s ease-in-out infinite;
      position:relative; z-index:1;
    }
    .ctr-num .u { font-size:.4em; color:var(--gold2); vertical-align:middle; }
    .ctr-label { font-size:clamp(16px,1.6vw,19px); color:var(--wh); margin-top:17px; font-weight:700; letter-spacing:.04em; position:relative; z-index:1; } /* ×1.2 */
    .ctr-sub { font-size:clamp(12px,1.2vw,14px); color:var(--gr2); margin-top:6px; position:relative; z-index:1; } /* ×1.2 */

    /* ═══════════════════════════════════════════
       ② LIVE 방송 채널
    ═══════════════════════════════════════════ */
    .live-sec { background:var(--bg); }
    .live-header {
      display:flex; align-items:flex-end; justify-content:space-between;
      margin-bottom:clamp(29px,3.5vw,43px); gap:19px; /* ×1.2 */
    }
    .live-all-btn {
      flex-shrink:0; align-self:center;
      display:inline-flex; align-items:center; gap:7px;
      font-size:clamp(14px,1.4vw,17px); /* ×1.2 */
      font-weight:700; color:var(--blue2); text-decoration:none;
      border:1px solid rgba(77,154,255,.3); border-radius:5px;
      padding:8px 19px; background:rgba(26,111,255,.08); /* ×1.2 */
      transition:background .2s,border-color .2s,transform .2s;
    }
    .live-all-btn:hover { background:rgba(26,111,255,.2); border-color:var(--blue2); transform:translateX(2px); }

    .live-big-title {
      font-family: 'Gothic A1', sans-serif;
      font-size:clamp(62px,9vw,70px); /* 52→62, 100→120 */
      line-height:.95; letter-spacing:-.01em; margin-bottom:0;
    }
    .live-big-title .cyan { color:var(--cyan); }

    /* 3열 그리드 */
    .ch-grid {
      display:grid; grid-template-columns:repeat(3,1fr);
      gap:clamp(17px,2.2vw,26px); /* ×1.2 */
    }

    .ch-card {
      background:var(--bg2); border:1px solid rgba(255,255,255,.07);
      border-radius:19px; overflow:hidden; /* 16→19 */
      display:flex; flex-direction:column; position:relative; opacity:0;
      transition:transform .4s cubic-bezier(.22,1,.36,1), border-color .4s, box-shadow .4s;
    }
    .ch-card.card-visible { animation:cardIn .7s cubic-bezier(.22,1,.36,1) forwards; }
    .ch-card:nth-child(1).card-visible { animation-delay:.08s; }
    .ch-card:nth-child(2).card-visible { animation-delay:.2s; }
    .ch-card:nth-child(3).card-visible { animation-delay:.32s; }
    .ch-card:hover { transform:translateY(-12px); border-color:rgba(26,111,255,.45); box-shadow:0 28px 76px rgba(26,111,255,.18); }
    .ch-card::before {
      content:''; position:absolute; top:0; left:0; right:0; height:3px;
      background:linear-gradient(90deg,var(--blue),var(--cyan));
      transform:scaleX(0); transform-origin:left;
      transition:transform .45s cubic-bezier(.22,1,.36,1); z-index:5;
    }
    .ch-card:hover::before { transform:scaleX(1); }
    .ch-card.featured { border-color:rgba(240,180,41,.22); box-shadow:0 4px 32px rgba(240,180,41,.06); }
    .ch-card.featured::before { background:linear-gradient(90deg,var(--gold),var(--gold2),var(--gold)); background-size:200% auto; animation:shimmer 2.5s linear infinite; transform:scaleX(1); }
    .ch-card.featured:hover { border-color:rgba(240,180,41,.5); box-shadow:0 28px 76px rgba(240,180,41,.15); }

    .ch-thumb { aspect-ratio:16/9; position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center; }
    .ch-thumb-bg-1 { background:linear-gradient(135deg,#060e24,#0f2060); }
    .ch-thumb-bg-2 { background:linear-gradient(135deg,#14042a,#300e58); }
    .ch-thumb-bg-3 { background:linear-gradient(135deg,#041a10,#0c3820); }
    .ch-thumb::before { content:''; position:absolute; inset:0; background:repeating-linear-gradient(45deg,transparent,transparent 18px,rgba(255,255,255,.018) 18px,rgba(255,255,255,.018) 19px); }
    .ch-thumb::after { content:''; position:absolute; inset:0; background:linear-gradient(to top,rgba(7,14,28,.85) 0%,transparent 55%); pointer-events:none; z-index:1; }
    .ch-thumb .scan-el { position:absolute; left:0; right:0; height:96px; z-index:2; background:linear-gradient(transparent,rgba(0,207,255,.04),transparent); animation:scanCard 3s linear infinite; } /* 80→96 */

    .ch-icon {
      font-size:clamp(55px,7vw,82px); /* 46→55, 68→82 */
      position:relative; z-index:3;
      transition:transform .4s cubic-bezier(.34,1.56,.64,1),filter .3s;
    }
    .ch-card:hover .ch-icon { transform:scale(1.18) translateY(-7px); }
    .ch-card:nth-child(1) .ch-icon { filter:drop-shadow(0 0 20px rgba(240,180,41,.6)); }
    .ch-card:nth-child(2) .ch-icon { filter:drop-shadow(0 0 20px rgba(77,154,255,.5)); }
    .ch-card:nth-child(3) .ch-icon { filter:drop-shadow(0 0 20px rgba(0,207,255,.5)); }
    .ch-card:nth-child(1):hover .ch-icon { filter:drop-shadow(0 0 30px rgba(240,180,41,.85)); }
    .ch-card:nth-child(2):hover .ch-icon { filter:drop-shadow(0 0 30px rgba(77,154,255,.85)); }
    .ch-card:nth-child(3):hover .ch-icon { filter:drop-shadow(0 0 30px rgba(0,207,255,.85)); }

    .ch-live-badge {
      position:absolute; top:14px; left:14px; z-index:4;
      display:flex; align-items:center; gap:5px;
      background:var(--red); border-radius:4px;
      padding:5px 12px; font-size:13px; font-weight:900; letter-spacing:.07em;
      animation:glowRed 2s ease-in-out infinite;
    }
    .ch-live-badge .dot { width:6px; height:6px; border-radius:50%; background:#fff; animation:pulse 1s ease-in-out infinite; }

    .ch-viewers {
      position:absolute; bottom:14px; right:14px; z-index:4;
      background:rgba(0,0,0,.75); backdrop-filter:blur(6px);
      border-radius:4px; padding:5px 14px;
      font-size:clamp(14px,1.4vw,17px); font-weight:700; color:var(--wh); /* ×1.2 */
      border:1px solid rgba(255,255,255,.1);
    }

    .ch-body {
      padding:clamp(19px,2.5vw,26px); /* 16→19, 22→26 */
      display:flex; flex-direction:column; gap:13px; flex:1;
    }

    .ch-name {
      font-family:'Black Han Sans',sans-serif;
      font-size:clamp(24px,2.8vw,34px); /* 20→24, 28→34 */
      letter-spacing:-.01em; line-height:1; transition:color .25s;
    }
    .ch-card:hover .ch-name { color:var(--blue2); }
    .ch-card.featured .ch-name { color:var(--gold2); }

    .ch-now {
      display:flex; align-items:flex-start; gap:8px;
      font-size:clamp(13px,1.35vw,16px); color:var(--gr); line-height:1.5; /* ×1.2 */
    }
    .ch-now-dot { width:6px; height:6px; border-radius:50%; margin-top:5px; background:var(--cyan); box-shadow:0 0 7px var(--cyan); flex-shrink:0; animation:pulse 1.4s ease-in-out infinite; }
    .ch-now strong { color:var(--wh); font-weight:700; }

    .ch-divider { height:1px; background:linear-gradient(to right,rgba(255,255,255,.06),rgba(255,255,255,.02)); }
    .ch-footer { display:flex; flex-direction:column; align-items:center; gap:15px; }
    .ch-tags { display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
    .ch-tag {
      font-size:clamp(11px,1.1vw,13px); font-weight:700; letter-spacing:.04em;
      background:rgba(26,111,255,.1); border:1px solid rgba(26,111,255,.22);
      border-radius:3px; padding:3px 8px; color:var(--blue2);
      transition:background .2s,border-color .2s;
    }
    .ch-card.featured .ch-tag { background:rgba(240,180,41,.08); border-color:rgba(240,180,41,.2); color:var(--gold2); }
    .ch-card:hover .ch-tag { background:rgba(26,111,255,.18); border-color:rgba(77,154,255,.45); }
    .ch-card.featured:hover .ch-tag { background:rgba(240,180,41,.16); border-color:rgba(240,180,41,.45); }

    .ch-enter-btn {
      align-self:stretch;
      display:inline-flex; align-items:center; justify-content:center; gap:6px;
      padding:12px 19px; border-radius:6px; /* ×1.2 */
      background:rgba(26,111,255,.12); border:1px solid rgba(26,111,255,.3);
      font-size:clamp(13px,1.3vw,16px); font-weight:700; color:var(--blue2); /* ×1.2 */
      text-decoration:none; cursor:pointer; white-space:nowrap;
      transition:background .2s,border-color .2s,box-shadow .2s,transform .2s;
    }
    .ch-card.featured .ch-enter-btn { background:rgba(240,180,41,.12); border-color:rgba(240,180,41,.35); color:var(--gold2); }
    .ch-enter-btn:hover { background:rgba(26,111,255,.26); border-color:var(--blue2); box-shadow:0 4px 19px rgba(26,111,255,.22); transform:translateY(-1px); }
    .ch-card.featured .ch-enter-btn:hover { background:rgba(240,180,41,.24); border-color:var(--gold); box-shadow:0 4px 19px rgba(240,180,41,.22); }
    .ch-enter-btn .arr { transition:transform .2s; }
    .ch-enter-btn:hover .arr { transform:translateX(3px); }

    /* ═══════════════════════════════════════════
       ④ 풀스크린 CTA
    ═══════════════════════════════════════════ */
    .cta-sec {
      position:relative; overflow:hidden;
      padding:clamp(86px,11vw,154px) 6%; /* ×1.2 */
      text-align:center;
      background:linear-gradient(135deg,#050b1a,#0b1628,#060f1c);
    }
    .cta-ring { position:absolute; border-radius:50%; pointer-events:none; top:50%; left:50%; }
    /* 링 크기 ×1.2: 380→456, 660→792, 960→1152 */
    .cta-r1 { width:456px; height:456px; transform:translate(-50%,-50%); border:1px solid rgba(240,180,41,.09); animation:ringCW 22s linear infinite; }
    .cta-r2 { width:792px; height:792px; transform:translate(-50%,-50%); border:1px dashed rgba(26,111,255,.07); animation:ringCCW 36s linear infinite; }
    .cta-r3 { width:1152px; height:1152px; transform:translate(-50%,-50%); border:1px solid rgba(0,207,255,.03); animation:ringCW 55s linear infinite; }
    .cta-glow {
      position:absolute; inset:0; pointer-events:none;
      background:
        radial-gradient(ellipse 55% 80% at 50% 50%,rgba(26,111,255,.09),transparent 70%),
        radial-gradient(ellipse 30% 40% at 25% 30%,rgba(240,180,41,.05),transparent 60%),
        radial-gradient(ellipse 30% 40% at 75% 70%,rgba(0,207,255,.05),transparent 60%);
    }
    .cta-grid {
      position:absolute; inset:0; pointer-events:none;
      background-image:linear-gradient(rgba(26,111,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(26,111,255,.03) 1px,transparent 1px);
      background-size:62px 62px; /* 52×1.2 */
      mask-image:radial-gradient(ellipse 65% 65% at 50% 50%,black 10%,transparent 100%);
    }
    .cta-inner { position:relative; z-index:2; max-width:696px; margin:0 auto; } /* 580×1.2 */
    .cta-pills { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-bottom:34px; } /* ×1.2 */
    .cta-pill {
      font-size:clamp(13px,1.3vw,16px); font-weight:700; letter-spacing:.05em; /* ×1.2 */
      background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1);
      border-radius:20px; padding:6px 19px; color:var(--gr); /* ×1.2 */
      transition:border-color .2s,color .2s,background .2s;
    }
    .cta-pill:hover { border-color:rgba(240,180,41,.45); color:var(--gold2); background:rgba(240,180,41,.06); }
    .cta-hl {
      font-family:'Bebas Neue',sans-serif;
      font-size:clamp(48px,8.5vw,101px); /* 40→48, 84→101 */
      line-height:.95; letter-spacing:.03em; margin-bottom:22px;
    }
    .cta-hl .wh { display:block; color:var(--wh); }
    .cta-hl .gd { display:block; background:linear-gradient(90deg,var(--gold),var(--gold2),var(--gold)); background-size:200% auto; -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; animation:shimmer 2.5s linear infinite, glow 3s ease-in-out infinite; }
    .cta-sub { font-size:clamp(17px,1.8vw,20px); color:var(--gr); line-height:1.9; margin-bottom:clamp(34px,5vw,58px); } /* ×1.2 */
    .cta-sub strong { color:var(--wh); }
    .cta-benefits { display:grid; grid-template-columns:1fr 1fr; gap:clamp(12px,1.5vw,17px); margin-bottom:clamp(38px,5vw,62px); } /* ×1.2 */
    .cta-card {
      display:flex; align-items:flex-start; gap:16px; /* ×1.2 */
      background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.07);
      border-radius:14px; padding:clamp(17px,2vw,24px) clamp(17px,2vw,22px); /* ×1.2 */
      text-align:left; transition:background .25s,border-color .25s,transform .25s; opacity:0;
    }
    .cta-card.pop { animation:popIn .5s cubic-bezier(.34,1.56,.64,1) forwards; }
    .cta-card:hover { background:rgba(240,180,41,.06); border-color:rgba(240,180,41,.28); transform:translateY(-3px); }
    .cta-card-icon { font-size:clamp(26px,3vw,34px); flex-shrink:0; margin-top:1px; } /* ×1.2 */
    .cta-card-title { font-size:clamp(16px,1.6vw,18px); font-weight:700; margin-bottom:4px; } /* ×1.2 */
    .cta-card-desc { font-size:clamp(13px,1.3vw,16px); color:var(--gr); } /* ×1.2 */
    .cta-btns { display:flex; flex-direction:column; align-items:center; gap:14px; }
    .cta-fine { font-size:clamp(13px,1.3vw,16px); color:var(--gr); } /* ×1.2 */

    /* ═══════════ FOOTER ═══════════ */
    footer {
      max-width:var(--W); margin:0 auto;
      border-top:1px solid rgba(255,255,255,.05);
      padding:clamp(29px,4vw,48px) 6%; /* ×1.2 */
      display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center;
    }
    footer img { width:clamp(108px,15%,144px); height:auto; opacity:.35; } /* ×1.2 */
    .foot-txt { font-size:clamp(13px,1.3vw,16px); color:rgba(122,150,184,.28); line-height:1.8; } /* ×1.2 */

    /* ═══════════════════════════════════════════
       ③ 인기 슬롯 게임 소개 (이미지 카드)
    ═══════════════════════════════════════════ */
    .games-sec { background:var(--bg2); }
    .games-grid {
      display:grid; grid-template-columns:repeat(3,1fr);
      gap:clamp(17px,2.2vw,26px);
    }
    .game-card {
      background:var(--bg3); border:1px solid rgba(255,255,255,.07);
      border-radius:18px; overflow:hidden; display:flex; flex-direction:column;
      transition:transform .4s cubic-bezier(.22,1,.36,1),border-color .4s,box-shadow .4s;
    }
    .game-card:hover { transform:translateY(-10px); border-color:rgba(240,180,41,.4); box-shadow:0 24px 64px rgba(240,180,41,.14); }
    .game-thumb { position:relative; aspect-ratio:4/3; overflow:hidden; }
    .game-thumb img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s cubic-bezier(.22,1,.36,1); }
    .game-card:hover .game-thumb img { transform:scale(1.07); }
    .game-thumb::after { content:''; position:absolute; inset:0; background:linear-gradient(to top,rgba(11,19,37,.85),transparent 55%); pointer-events:none; }
    .game-badge {
      position:absolute; top:12px; left:12px; z-index:2;
      background:rgba(240,180,41,.92); color:var(--bg);
      font-size:12px; font-weight:900; letter-spacing:.04em;
      padding:4px 11px; border-radius:4px;
    }
    .game-name {
      position:absolute; bottom:12px; left:14px; right:14px; z-index:2;
      font-family:'Black Han Sans','Noto Sans KR',sans-serif;
      font-size:clamp(20px,2.4vw,26px); color:var(--wh); line-height:1.1;
    }
    .game-body { padding:clamp(16px,2vw,22px); display:flex; flex-direction:column; gap:14px; flex:1; }
    .game-desc { font-size:clamp(13px,1.35vw,15px); color:var(--gr); line-height:1.7; flex:1; }
    .game-links { display:flex; gap:9px; }
    .game-link {
      flex:1; text-align:center; text-decoration:none;
      padding:10px 8px; border-radius:6px; font-size:clamp(12px,1.3vw,14px); font-weight:700;
      transition:background .2s,border-color .2s,transform .2s,box-shadow .2s;
    }
    .game-link.play { background:linear-gradient(90deg,var(--gold),#ff9f1c); color:var(--bg); box-shadow:0 3px 14px rgba(240,180,41,.3); }
    .game-link.play:hover { transform:translateY(-2px); box-shadow:0 6px 22px rgba(240,180,41,.5); }
    .game-link.analyze { background:rgba(26,111,255,.12); border:1px solid rgba(26,111,255,.3); color:var(--blue2); }
    .game-link.analyze:hover { background:rgba(26,111,255,.24); border-color:var(--blue2); transform:translateY(-2px); }

    /* ═══════════════════════════════════════════
       ④ 프라그마틱 슬롯 특징 및 주요 기능
    ═══════════════════════════════════════════ */
    .feat-sec { background:var(--bg); }
    .feat-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(14px,1.8vw,20px); }
    .feat-card {
      display:flex; align-items:flex-start; gap:18px;
      background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.07);
      border-radius:14px; padding:clamp(22px,2.6vw,30px);
      transition:background .3s,border-color .3s,transform .3s;
    }
    .feat-card:hover { background:rgba(26,111,255,.06); border-color:rgba(26,111,255,.28); transform:translateY(-4px); }
    .feat-icon {
      flex-shrink:0; width:56px; height:56px; border-radius:12px;
      display:flex; align-items:center; justify-content:center; font-size:28px;
      background:rgba(26,111,255,.1); border:1px solid rgba(26,111,255,.22);
    }
    .feat-card:nth-child(2) .feat-icon { background:rgba(240,180,41,.1); border-color:rgba(240,180,41,.24); }
    .feat-card:nth-child(3) .feat-icon { background:rgba(0,207,255,.1); border-color:rgba(0,207,255,.24); }
    .feat-card:nth-child(4) .feat-icon { background:rgba(255,55,55,.08); border-color:rgba(255,55,55,.22); }
    .feat-title { font-size:clamp(17px,1.9vw,21px); font-weight:700; color:var(--wh); margin-bottom:8px; }
    .feat-title .hl { color:var(--gold); }
    .feat-desc { font-size:clamp(13px,1.4vw,15px); color:var(--gr); line-height:1.8; }
    .feat-desc strong { color:var(--blue2); font-weight:700; }

    /* ═══════════════════════════════════════════
       ⑤ FAQ
    ═══════════════════════════════════════════ */
    .faq-sec { background:var(--bg2); }
    .faq-list { display:flex; flex-direction:column; gap:14px; max-width:860px; }
    .faq-item {
      background:var(--bg3); border:1px solid rgba(255,255,255,.08);
      border-radius:12px; overflow:hidden; transition:border-color .3s;
    }
    .faq-item[open] { border-color:rgba(26,111,255,.35); }
    .faq-item summary {
      list-style:none; cursor:pointer; padding:clamp(18px,2.2vw,24px);
      display:flex; align-items:center; justify-content:space-between; gap:16px;
    }
    .faq-item summary::-webkit-details-marker { display:none; }
    .faq-q {
      font-size:clamp(15px,1.7vw,19px); font-weight:700; color:var(--wh);
      line-height:1.4; margin:0; display:flex; align-items:flex-start; gap:11px;
    }
    .faq-q .qmark { color:var(--gold); font-family:'Bebas Neue',sans-serif; font-size:1.35em; line-height:1; flex-shrink:0; }
    .faq-toggle {
      flex-shrink:0; width:28px; height:28px; border-radius:50%;
      background:rgba(26,111,255,.12); border:1px solid rgba(26,111,255,.3);
      display:flex; align-items:center; justify-content:center; color:var(--blue2);
      font-size:18px; transition:transform .3s,background .3s;
    }
    .faq-item[open] .faq-toggle { transform:rotate(45deg); background:rgba(26,111,255,.24); }
    .faq-a {
      padding:0 clamp(18px,2.2vw,24px) clamp(20px,2.4vw,26px) clamp(41px,4vw,52px);
      font-size:clamp(14px,1.5vw,16px); color:var(--gr); line-height:1.85;
    }
    .faq-a strong { color:var(--wh); }
    .faq-a a { color:var(--gold2); text-decoration:none; border-bottom:1px solid rgba(255,224,138,.4); }
    .faq-a a:hover { color:var(--gold); }

    /* ═══════════ 반응형 ═══════════ */
    @media(max-width:768px){
      .games-grid { grid-template-columns:1fr 1fr; }
      .feat-grid { grid-template-columns:1fr; }
      .counter-grid { grid-template-columns:1fr 1fr; }
      .cta-benefits { grid-template-columns:1fr; }
      .ch-grid { grid-template-columns:1fr; }
      .live-big-title { font-size: clamp(20px, 5.5vw, 40px); white-space: nowrap; }
    }
    @media(max-width:480px){
      .counter-grid { grid-template-columns:1fr; }
      .games-grid { grid-template-columns:1fr; }
    }

    /* ═══════════════════════════════════════════
       관리자 편집 대응 — 강조 태그
       (문구 안의 <em> 을 원본의 .gold / .cyan 과 같은 색으로)
    ═══════════════════════════════════════════ */
    .sec-title em          { font-style:normal; color:var(--gold); }
    .feat-sec .sec-title em{ font-style:normal; color:var(--cyan); }
    .live-big-title em     { font-style:normal; color:var(--cyan); }
    .feat-title em         { font-style:normal; color:var(--gold); }
    .cta-hl em             { font-style:normal; }

    /* ═══════════════════════════════════════════
       추가 섹션 — 원본 타이포 규칙을 그대로 따릅니다
         · 섹션 설명문 = 원본 .hero-sub 와 동일
         · 카드 설명문 = 원본 .ch-now 와 동일
    ═══════════════════════════════════════════ */
    .sec-desc {
      font-size:clamp(17px,2.16vw,23px);   /* = .hero-sub */
      color:var(--gr); line-height:1.9;
      max-width:760px; margin-bottom:clamp(38px,5vw,62px);
    }
    .sec-desc strong { color:var(--wh); }

    .game-desc {
      font-size:clamp(13px,1.35vw,16px);   /* = .ch-now */
      color:var(--gr); line-height:1.5;
    }
    .feat-desc {
      font-size:clamp(13px,1.4vw,16px);
      color:var(--gr); line-height:1.8;
    }
    .feat-desc strong { color:var(--blue2); font-weight:700; }

    /* FAQ — 질문은 .ch-name 급 굵기, 답변은 .hero-sub 톤 */
    .faq-q {
      font-size:clamp(15px,1.7vw,19px); font-weight:700;
      color:var(--wh); line-height:1.4;
    }
    .faq-a {
      font-size:clamp(14px,1.5vw,16px);
      color:var(--gr); line-height:1.85;
    }
    .faq-a strong { color:var(--wh); }

    /* 게임 카드 이미지가 없을 때 */
    .game-ph {
      position:absolute; inset:0;
      display:flex; align-items:center; justify-content:center;
      background:linear-gradient(135deg,#0b1325,#16233f);
    }
    /*  사진이 없는 카드 — 게임사 심볼을 크게, 카드마다 다른 색으로 */
    .game-ph b {
      font-size:clamp(48px,7vw,86px); line-height:1; font-weight:400;
      opacity:.62; filter:drop-shadow(0 6px 18px rgba(0,0,0,.55));
      transition:transform .5s cubic-bezier(.22,1,.36,1), opacity .4s;
    }
    .game-card:hover .game-ph b { transform:scale(1.12); opacity:.85; }
    .game-ph::after {
      content:""; position:absolute; inset:0;
      background:radial-gradient(ellipse 70% 60% at 50% 42%, rgba(255,255,255,.10), transparent 70%);
    }
    .game-ph.ph1 { background:linear-gradient(140deg,#2b1a52,#5b2f8f 55%,#1a1030); }
    .game-ph.ph2 { background:linear-gradient(140deg,#131a24,#3a4a5e 55%,#0d131b); }
    .game-ph.ph3 { background:linear-gradient(140deg,#4a1220,#96253a 55%,#2a0a12); }
    .game-ph.ph4 { background:linear-gradient(140deg,#3d2a0c,#a5761f 55%,#241806); }
    .game-ph.ph5 { background:linear-gradient(140deg,#12283d,#1f5c7a 55%,#0a1721); }
    .game-ph.ph6 { background:linear-gradient(140deg,#3a1330,#8f2f6a 55%,#210a1c); }

    /* 저작권 문구 안의 사이트명 = 관리자 진입 링크
       (파란색·밑줄 등 브라우저 기본 링크 모양을 완전히 없애 티가 나지 않게 합니다) */
    .foot-txt a.foot-adm,
    .foot-txt a.foot-adm:link,
    .foot-txt a.foot-adm:visited,
    .foot-txt a.foot-adm:active {
      color:inherit !important;
      text-decoration:none !important;
      border:0 !important; outline:0 !important;
      background:none !important;
      transition:color .25s, text-shadow .25s;
    }
    .foot-txt a.foot-adm:hover {
      color:var(--gold) !important;
      text-shadow:0 0 12px rgba(240,180,41,.45);
    }

    /* ═══════════════════════════════════════════
       제휴사이트 (메인 섹션)
       · 뒤에서 은은히 흐르는 배경으로 카드를 부각시킵니다
       · 카드는 이미지 중심 + 읽기 쉬운 정보 배치
    ═══════════════════════════════════════════ */
    .pt-sec {
      position:relative; overflow:hidden;
      background:linear-gradient(180deg,#070c1a 0%,#0a1024 45%,#070c1a 100%);
      border-top:1px solid rgba(255,255,255,.06);
      border-bottom:1px solid rgba(255,255,255,.06);
    }
    .pt-sec .sec-wrap {
      position:relative; z-index:2;
      padding-top:clamp(58px,6.5vw,92px); padding-bottom:clamp(58px,6.5vw,92px);
    }

    /* ── 움직이는 배경 ───────────────────────── */
    .pt-bg { position:absolute; inset:0; pointer-events:none; z-index:0; overflow:hidden; }
    .pt-orb {
      position:absolute; display:block; border-radius:50%;
      filter:blur(60px); opacity:.5; will-change:transform;
    }
    .pt-orb1 {
      width:46vw; height:46vw; max-width:620px; max-height:620px; left:-10%; top:-18%;
      background:radial-gradient(circle,rgba(93,63,211,.55),transparent 70%);
      animation:ptFloat1 22s ease-in-out infinite;
    }
    .pt-orb2 {
      width:40vw; height:40vw; max-width:540px; max-height:540px; right:-8%; top:10%;
      background:radial-gradient(circle,rgba(240,180,41,.28),transparent 70%);
      animation:ptFloat2 26s ease-in-out infinite;
    }
    .pt-orb3 {
      width:38vw; height:38vw; max-width:500px; max-height:500px; left:35%; bottom:-22%;
      background:radial-gradient(circle,rgba(0,207,255,.3),transparent 70%);
      animation:ptFloat3 30s ease-in-out infinite;
    }
    .pt-beam {
      position:absolute; left:-30%; right:-30%; height:180px; top:-200px;
      background:linear-gradient(180deg,transparent,rgba(120,160,255,.10),transparent);
      transform:rotate(-6deg);
      animation:ptBeam 11s linear infinite;
    }
    .pt-mesh {
      position:absolute; inset:-2px;
      background-image:
        linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);
      background-size:64px 64px;
      -webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 40%,#000 25%,transparent 100%);
      mask-image:radial-gradient(ellipse 80% 70% at 50% 40%,#000 25%,transparent 100%);
      animation:ptMesh 40s linear infinite;
    }
    @keyframes ptFloat1 { 0%,100%{transform:translate(0,0) scale(1)} 50%{transform:translate(9%,7%) scale(1.12)} }
    @keyframes ptFloat2 { 0%,100%{transform:translate(0,0) scale(1)} 50%{transform:translate(-8%,10%) scale(1.15)} }
    @keyframes ptFloat3 { 0%,100%{transform:translate(0,0) scale(1)} 50%{transform:translate(-10%,-8%) scale(1.1)} }
    @keyframes ptBeam  { 0%{top:-220px;opacity:0} 12%{opacity:1} 88%{opacity:1} 100%{top:120%;opacity:0} }
    @keyframes ptMesh  { to { background-position:64px 64px, 64px 64px; } }

    @media (prefers-reduced-motion: reduce) {
      .pt-orb, .pt-beam, .pt-mesh { animation:none !important; }
    }

    /* ── 헤더 ─────────────────────────────────── */
    .pt-head {
      display:flex; align-items:flex-end; justify-content:space-between;
      gap:19px; margin-bottom:14px;
    }
    .pt-head .sec-title { margin-bottom:0; }
    .pt-sec .sec-title em {
      font-style:normal;
      background:linear-gradient(90deg,#a78bfa,#f472b6 55%,#ffb84d);
      -webkit-background-clip:text; background-clip:text;
      -webkit-text-fill-color:transparent; color:transparent;
    }
    .pt-sec .live-all-btn {
      border-radius:999px; padding:11px 22px;
      background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.14);
      color:#dbe6f5;
    }
    .pt-sec .live-all-btn:hover {
      background:rgba(240,180,41,.14); border-color:rgba(240,180,41,.5); color:var(--gold2);
    }

    .pt-note {
      background:rgba(255,255,255,.035);
      border:1px solid rgba(255,255,255,.07);
      border-radius:14px;
      padding:clamp(16px,1.8vw,22px) clamp(18px,2vw,26px);
      margin-bottom:clamp(26px,3vw,38px);
      -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
    }
    .pt-note p { font-size:clamp(14px,1.45vw,16px); color:#c3d3e6; line-height:1.8; word-break:keep-all; }
    .pt-note strong { color:var(--wh); }

    /* ── 카드 ─────────────────────────────────── */
    .pt-grid {
      display:grid; gap:clamp(18px,2vw,26px);
      grid-template-columns:repeat(3, 1fr);   /* 한 줄에 3개 */
    }
    .pt-card {
      position:relative; display:flex; flex-direction:column;
      background:linear-gradient(180deg,#121a33 0%,#0c1223 100%);
      border:1px solid rgba(255,255,255,.09);
      border-radius:20px; overflow:hidden;
      box-shadow:0 12px 34px rgba(0,0,0,.4);
      transition:transform .38s cubic-bezier(.22,1,.36,1), box-shadow .38s, border-color .38s;
    }
    .pt-card:hover {
      transform:translateY(-9px);
      border-color:rgba(240,180,41,.55);
      box-shadow:0 28px 64px rgba(0,0,0,.55), 0 0 0 1px rgba(240,180,41,.25);
    }
    /* 상단 얇은 포인트 라인 */
    .pt-card::after {
      content:""; position:absolute; left:0; right:0; top:0; height:3px; z-index:3;
      background:linear-gradient(90deg,#a78bfa,#f472b6 45%,#ffb84d);
      transform:scaleX(0); transform-origin:left;
      transition:transform .45s cubic-bezier(.22,1,.36,1);
    }
    .pt-card:hover::after { transform:scaleX(1); }

    /* 배너는 잘리지 않게 전체가 보이도록 담습니다 */
    .pt-card__thumb {
      position:relative; display:block;
      padding:0; text-decoration:none;      /* 여백 없이 이미지를 꽉 채웁니다 */
    }
    .pt-card__frame {
      position:relative; display:flex; align-items:center; justify-content:center;
      aspect-ratio:16/9; overflow:hidden;
      background:#070c18; border:0; border-radius:19px 19px 0 0;
    }
    .pt-card__frame img {
      width:100%; height:100%; object-fit:contain; display:block;
      transition:transform .5s cubic-bezier(.22,1,.36,1);
    }
    .pt-card:hover .pt-card__frame img { transform:scale(1.05); }
    .pt-card__ph {
      position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
      background:linear-gradient(135deg,#0b1325,#1b2748);
      font-family:'Black Han Sans',sans-serif; font-size:30px; color:rgba(122,150,184,.5);
    }
    /* 이미지 위에 뜨는 안내 (마우스 올렸을 때만) */
    .pt-card__hover {
      position:absolute; inset:0; border-radius:19px 19px 0 0;
      display:flex; align-items:center; justify-content:center;
      background:rgba(6,10,22,.55); backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px);
      opacity:0; transition:opacity .3s;
    }
    .pt-card__hover b {
      font-size:13px; font-weight:700; color:#fff;
      border:1px solid rgba(255,255,255,.6); border-radius:999px; padding:8px 18px;
    }
    .pt-card:hover .pt-card__hover { opacity:1; }

    .pt-card__body { padding:14px 16px 16px; display:flex; flex-direction:column; gap:10px; flex:1; }
    .pt-card__top { display:flex; align-items:center; justify-content:space-between; gap:10px; }
    .pt-card__name {
      font-family:'Black Han Sans','Noto Sans KR',sans-serif;
      font-size:clamp(17px,1.6vw,20px); line-height:1.3; margin:0; letter-spacing:-.01em;
      min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
    }
    .pt-card__name a { color:var(--wh); text-decoration:none; transition:color .25s; }
    .pt-card:hover .pt-card__name a { color:var(--gold2); }
    .pt-card__code {
      flex-shrink:0; font-size:11px; font-weight:700; letter-spacing:.06em;
      color:#0a0f1e; background:linear-gradient(90deg,var(--gold2),var(--gold));
      border-radius:999px; padding:5px 11px; white-space:nowrap;
    }
    .pt-card__code b { font-weight:900; }
    .pt-card__desc {
      font-size:13px; color:#93a9c4; line-height:1.65; margin:0;
      display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
    }

    /* 혜택 태그 — 관리자에서 «|» 로 구분해 입력 */
    .pt-card__tags {
      display:flex; flex-wrap:wrap; gap:6px; margin:0; padding:0; list-style:none; flex:1;
      align-content:flex-start;
    }
    .pt-card__tags li {
      font-size:11.5px; font-weight:700; letter-spacing:-.01em;
      color:#dbe6f5;
      background:linear-gradient(180deg,rgba(167,139,250,.16),rgba(167,139,250,.07));
      border:1px solid rgba(167,139,250,.32);
      border-radius:7px; padding:5px 10px; white-space:nowrap;
      transition:border-color .25s, color .25s;
    }
    .pt-card:hover .pt-card__tags li { border-color:rgba(240,180,41,.42); color:#fff; }

    /*  margin-top:auto → 소개글·태그가 있든 없든
        버튼 줄이 항상 카드 맨 아래에 붙어 높이가 맞습니다. */
    .pt-card__btns { display:flex; gap:8px; margin-top:auto; padding-top:4px; }
    .pt-card__btn {
      flex:1; display:inline-flex; align-items:center; justify-content:center; gap:5px;
      text-align:center; padding:11px 6px; border-radius:10px;
      font-size:13px; font-weight:700; text-decoration:none; letter-spacing:-.01em;
      transition:transform .2s, box-shadow .2s, background .2s, border-color .2s, color .2s;
    }
    .pt-card__btn i { font-style:normal; transition:transform .2s; }
    /*  바로가기 버튼 — 금색이 천천히 흐르고, 광택이 스쳐 지나가며
        테두리가 은은하게 발광합니다. */
    .pt-card__btn.gold {
      position:relative; overflow:hidden; isolation:isolate;
      color:#0a0f1e;
      background:linear-gradient(90deg,#f0b429,#ffd76a 25%,#ff9f1c 50%,#ffd76a 75%,#f0b429);
      background-size:220% auto;
      animation:ptShine 3s linear infinite, ptGlow 2.6s ease-in-out infinite;
    }
    /* 좌 → 우로 스쳐 가는 하이라이트 */
    .pt-card__btn.gold::before {
      content:""; position:absolute; top:0; left:-65%; width:45%; height:100%; z-index:-1;
      background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);
      transform:skewX(-18deg);
      animation:ptSweep 3s ease-in-out infinite;
    }
    .pt-card__btn.gold:hover {
      transform:translateY(-2px);
      animation-duration:1.4s, 1.4s;
    }
    .pt-card__btn.gold:hover i { transform:translateX(3px); }

    @keyframes ptShine { 0%{background-position:0% 50%} 100%{background-position:220% 50%} }
    @keyframes ptSweep { 0%{left:-65%} 55%,100%{left:130%} }
    @keyframes ptGlow  {
      0%,100% { box-shadow:0 4px 16px rgba(240,180,41,.30); }
      50%     { box-shadow:0 6px 26px rgba(240,180,41,.62), 0 0 0 1px rgba(255,224,138,.35); }
    }
    @media (prefers-reduced-motion: reduce) {
      .pt-card__btn.gold { animation:none; }
      .pt-card__btn.gold::before { animation:none; opacity:0; }
    }
    .pt-card__btn.ghost {
      background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.15); color:#cbd9ea;
    }
    .pt-card__btn.ghost:hover {
      background:rgba(167,139,250,.18); border-color:rgba(167,139,250,.6); color:#fff; transform:translateY(-2px);
    }

    @media(max-width:900px){ .pt-grid { grid-template-columns:repeat(2,1fr); } }
    @media(max-width:768px){
      .pt-head { flex-direction:column; align-items:flex-start; gap:12px; }
    }
    @media(max-width:520px){ .pt-grid { grid-template-columns:1fr; } }