/* /notice/competitive — 경쟁전 개막 글(2026-10-09). 글보다 영상·그림이 먼저 보이게. 방사형 빛줄기는 쓰지 않는다(둥근 글로우만) */
:root{--c-br:#C98A5B;--c-si:#C3CCDD;--c-go:#F5C542;--c-pl:#4FE3C1;--c-di:#7DB4FF;--c-ch:#FF5C8A}
.kr h1,.kr h2,.kr h3{word-break:keep-all}
.k-eyebrow{font:500 12px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--yolk)}
.k-title{font:900 clamp(36px,6.4vw,104px)/1.02 'Noto Sans KR',var(--display);letter-spacing:-.045em;margin:14px 0 0}
.k-sub{color:var(--fg-2);font-size:clamp(15px,1.3vw,19px);margin:16px 0 0;max-width:34em}
.k-head{margin-bottom:clamp(32px,5vw,64px)}
.k-sec{position:relative;padding-block:clamp(90px,12vw,180px)}

/* ── hero: 경쟁 시네마틱 몽타주 ── */
.khero{position:relative;height:100svh;min-height:680px;overflow:hidden;display:flex;align-items:flex-end;isolation:isolate}
.montage{position:absolute;inset:0;z-index:-2}
.montage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.12);transition:opacity 1.4s ease,transform 7s linear}
.montage video.on{opacity:1;transform:scale(1)}
.khero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,var(--bg) 2%,rgba(6,6,8,.55) 40%,rgba(6,6,8,.15) 70%,rgba(6,6,8,.5)),radial-gradient(70% 60% at 50% 110%,rgba(255,92,138,.35),transparent 70%)}
.khero .in{width:100%;padding:0 var(--gutter) clamp(28px,5vw,60px)}
.khero h1{font-size:clamp(46px,11.6vw,230px);line-height:.84;margin:18px 0 0}
.khero h1 .l2{display:block}
.khero .ko{font:900 clamp(26px,3.6vw,54px)/1.15 'Noto Sans KR',var(--display);letter-spacing:-.035em;margin:18px 0 0}
.khero .bar{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:clamp(18px,3vw,32px)}
.khero .acts{display:flex;gap:10px;flex-wrap:wrap}
.cd{display:flex;gap:clamp(6px,1vw,12px);align-items:flex-end}
.cd > div{min-width:clamp(58px,6vw,92px);padding:12px 10px 10px;border-radius:16px;background:rgba(13,13,18,.55);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);text-align:center}
.cd b{display:block;font:800 clamp(28px,3.6vw,52px)/1 var(--display);font-stretch:110%;font-variant-numeric:tabular-nums}
.cd small{font:500 10px var(--mono);letter-spacing:.14em;color:var(--fg-3)}
.cd .lbl{min-width:auto;background:none;border:0;backdrop-filter:none;text-align:left;padding:0 6px 6px 0}
.cd .lbl small{display:block;color:var(--yolk)}
.cd .lbl span{font:700 14px 'Noto Sans KR',var(--text)}
.dots{position:absolute;right:var(--gutter);top:50%;transform:translateY(-50%);display:grid;gap:10px;z-index:2}
.dots i{width:4px;height:28px;border-radius:4px;background:rgba(255,255,255,.2);overflow:hidden;position:relative}
.dots i.on::after{content:"";position:absolute;inset:0;background:var(--yolk);transform-origin:top;animation:dotfill 4.6s linear forwards}
@keyframes dotfill{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@media (max-width:700px){.dots{display:none}.khero .bar{flex-direction:column;align-items:flex-start}}

.marquee.tilt.pink{background:linear-gradient(90deg,var(--yolk),var(--rose));}

/* ── 어떤 곳: 겹쳐 쌓이는 영상 카드 ── */
.stack{display:grid;gap:clamp(14px,2vw,24px)}
.scard{position:sticky;top:calc(80px + var(--i) * 22px);height:min(78vh,720px);border-radius:clamp(22px,2.6vw,36px);overflow:hidden;isolation:isolate;box-shadow:0 -20px 60px rgba(0,0,0,.55);background:#000}
.scard video,.scard > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.scard::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(6,6,8,.92),rgba(6,6,8,.35) 60%,rgba(6,6,8,.1)),linear-gradient(0deg,rgba(6,6,8,.8),transparent 50%)}
.scard .body{position:absolute;left:0;bottom:0;padding:clamp(24px,4vw,56px);max-width:720px}
.scard .no{font:800 clamp(80px,13vw,200px)/.8 var(--display);font-stretch:120%;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.55);display:block;margin-bottom:10px}
.scard h3{font:900 clamp(30px,4.6vw,68px)/1.08 'Noto Sans KR',var(--display);letter-spacing:-.04em;margin:0 0 14px}
.scard p{margin:0;color:var(--fg-2);font-size:clamp(15px,1.3vw,19px);max-width:30em}
.scard p b{color:var(--fg)}
.path{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 18px}
.path span{padding:9px 14px;border-radius:99px;background:rgba(255,255,255,.1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.16);font:700 14px 'Noto Sans KR',var(--text)}
.path span.go{background:var(--yolk);color:#000;border-color:var(--yolk);box-shadow:0 0 0 0 rgba(255,194,61,.6);animation:pulse 2s infinite}
.path i{font-style:normal;color:var(--fg-3)}
@keyframes pulse{70%{box-shadow:0 0 0 14px rgba(255,194,61,0)}100%{box-shadow:0 0 0 0 rgba(255,194,61,0)}}
.scard .big-n{display:flex;gap:clamp(18px,3vw,40px);margin-top:20px}
.scard .big-n div b{display:block;font:800 clamp(40px,5vw,72px)/1 var(--display);font-stretch:110%;color:var(--yolk)}
.scard .big-n div span{font:600 13px 'Noto Sans KR',var(--text);color:var(--fg-2)}
.scard .badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.scard .badges span{padding:8px 14px;border-radius:99px;font:800 13px 'Noto Sans KR',var(--text);background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2)}
@media (max-width:700px){.scard{height:76svh;top:calc(70px + var(--i) * 14px)}.scard::after{background:linear-gradient(0deg,rgba(6,6,8,.95) 35%,rgba(6,6,8,.2))}}

/* ── 등급 문양 ── */
.tiers-sec{overflow:hidden;isolation:isolate}
.tiers-sec > img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.45}
.tiers-sec::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,var(--bg),rgba(6,6,8,.3) 30%,rgba(6,6,8,.3) 70%,var(--bg))}
.ladder{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(6px,1.2vw,18px);align-items:end;padding-top:clamp(40px,12vw,190px)}
.tier{text-align:center;position:relative;--lift:calc(var(--k) * clamp(10px,2.2vw,34px));transform:translateY(calc(-1 * var(--lift)))}
.tier .emb{position:relative;width:100%;aspect-ratio:1;display:grid;place-items:center}
.tier .emb::before{content:"";position:absolute;inset:12%;border-radius:50%;background:radial-gradient(circle,var(--c) 0%,transparent 68%);opacity:.38;filter:blur(18px);animation:breathe 3.2s ease-in-out infinite;animation-delay:calc(var(--k) * -.5s)}
.tier img{position:relative;width:min(100%,220px);filter:drop-shadow(0 18px 30px rgba(0,0,0,.6));animation:floaty 4s ease-in-out infinite;animation-delay:calc(var(--k) * -.6s);transition:transform .5s var(--ease)}
.tier:hover img{transform:scale(1.12) rotate(-4deg)}
.tier b{display:block;font:900 clamp(15px,1.6vw,24px) 'Noto Sans KR',var(--text);color:var(--c);margin-top:6px}
.tier small{font:500 10px var(--mono);letter-spacing:.14em;color:var(--fg-3)}
.tier.top b{text-shadow:0 0 24px var(--c)}
@keyframes floaty{0%,100%{translate:0 0}50%{translate:0 -10px}}
@keyframes breathe{0%,100%{opacity:.25;scale:.9}50%{opacity:.5;scale:1.08}}
.updown{display:flex;justify-content:center;gap:10px;margin-top:clamp(28px,4vw,48px);flex-wrap:wrap}
.updown span{padding:12px 20px;border-radius:99px;font:800 15px 'Noto Sans KR',var(--text);background:rgba(13,13,18,.7);border:1px solid var(--line);backdrop-filter:blur(10px)}
.updown .up{color:#4fe3c1;border-color:rgba(79,227,193,.4)}
.updown .dn{color:var(--rose);border-color:rgba(255,92,138,.4)}
@media (max-width:700px){.ladder{padding-top:0;grid-template-columns:repeat(3,1fr);row-gap:28px}.tier{--lift:0px}}

/* ── 경기 날: 그림 타일 ── */
.night{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(8px,1vw,14px)}
.ntile{position:relative;aspect-ratio:9/16;border-radius:22px;overflow:hidden;isolation:isolate;background:#000;transition:transform .6s var(--ease)}
.ntile:nth-child(even){margin-top:clamp(20px,4vw,60px)}
.ntile:hover{transform:translateY(-8px)}
.ntile video,.ntile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.2s var(--ease)}
.ntile:hover video,.ntile:hover img{transform:scale(1.06)}
.ntile::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(6,6,8,.92) 8%,transparent 55%)}
.ntile .t{position:absolute;left:14px;top:14px;font:600 11px var(--mono);letter-spacing:.1em;padding:6px 10px;border-radius:99px;background:rgba(6,6,8,.6);backdrop-filter:blur(8px);color:var(--yolk)}
.ntile .t.live{background:var(--rose);color:#fff}
.ntile .t.live::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#fff;margin-right:6px;vertical-align:middle;animation:blink 1.2s infinite}
.ntile .c{position:absolute;left:0;right:0;bottom:0;padding:16px}
.ntile .c b{display:block;font:900 clamp(17px,1.5vw,22px)/1.25 'Noto Sans KR',var(--text);letter-spacing:-.02em}
.ntile .c span{font-size:13px;color:var(--fg-2);line-height:1.45;display:block;margin-top:4px}
@media (max-width:900px){.night{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:62%;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter);scrollbar-width:none}.ntile{scroll-snap-align:start}.ntile:nth-child(even){margin-top:0}}
.free{display:flex;align-items:center;gap:12px;margin-top:clamp(20px,3vw,32px);color:var(--fg-2);font-size:15px}
.free b{color:var(--fg)}
.free::before{content:"✓";display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:rgba(79,227,193,.15);color:#4fe3c1;font-weight:800;flex:none}

/* ── 중계 샘플 ── */
.sample{isolation:isolate;overflow:hidden}
.sample > img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.35;filter:blur(2px)}
.sample::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,var(--bg),rgba(6,6,8,.55) 25%,rgba(6,6,8,.55) 75%,var(--bg))}
.phones{display:grid;grid-template-columns:repeat(2,minmax(0,340px));gap:clamp(24px,5vw,90px);justify-content:center;align-items:start}
.phone{margin:0}
.phone:nth-child(2){margin-top:clamp(0px,6vw,90px)}
.phone .scr{position:relative;aspect-ratio:390/844;border-radius:42px;overflow:hidden;background:#000;box-shadow:0 0 0 8px #15151c,0 0 0 9px rgba(255,255,255,.1),0 40px 120px -20px var(--glow,rgba(255,92,138,.45))}
.phone video{width:100%;height:100%;object-fit:cover}
.phone .snd{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);z-index:2;display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:99px;background:var(--yolk);color:#000;font:800 13px 'Noto Sans KR',var(--text);box-shadow:0 10px 30px rgba(0,0,0,.4);animation:pulse 2s infinite;white-space:nowrap}
.phone .snd svg{width:16px;height:16px}
.phone figcaption{margin-top:22px;text-align:center}
.phone figcaption b{display:block;font:900 20px/1.3 'Noto Sans KR',var(--text);letter-spacing:-.02em}
.phone figcaption span{color:var(--fg-3);font-size:13px}
@media (max-width:640px){.phones{grid-template-columns:minmax(0,300px)}.phone:nth-child(2){margin-top:20px}}

/* ── 배치고사: 문양 계단 ── */
.exam-hero{display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,4vw,60px);align-items:end;margin-bottom:clamp(36px,5vw,64px)}
.exam-date{font:800 clamp(80px,14vw,220px)/.8 var(--display);font-stretch:118%;letter-spacing:-.05em}
.exam-date small{display:block;font:700 clamp(16px,1.6vw,22px) 'Noto Sans KR',var(--text);letter-spacing:0;color:var(--rose);margin-top:14px}
@media (max-width:700px){.exam-hero{grid-template-columns:1fr}}
.climb{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(6px,1vw,14px);align-items:end;padding-top:clamp(60px,15vw,220px)}
.climb svg.line{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.climb svg.line path{fill:none;stroke:url(#lg);stroke-width:3;stroke-linecap:round;stroke-dasharray:6 10}
.step{position:relative;text-align:center;transform:translateY(calc(-1 * var(--k) * clamp(14px,3vw,46px)))}
.step img{width:min(100%,150px);filter:drop-shadow(0 12px 24px rgba(0,0,0,.6));animation:floaty 4s ease-in-out infinite;animation-delay:calc(var(--k) * -.7s)}
.step .time{display:inline-block;margin-top:8px;padding:7px 12px;border-radius:99px;background:rgba(255,255,255,.08);border:1px solid var(--line);font:600 12px var(--mono)}
.step b{display:block;font:900 clamp(16px,1.6vw,22px) 'Noto Sans KR',var(--text);color:var(--c);margin-top:8px}
.step small{color:var(--fg-3);font-size:12px}
@media (max-width:700px){.climb{padding-top:10px;grid-template-columns:repeat(5,minmax(96px,1fr));overflow-x:auto;padding-bottom:10px;scrollbar-width:none}.step{transform:none}.climb svg.line{display:none}}
.judge{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:clamp(40px,6vw,72px)}
.judge div{position:relative;padding:26px 24px;border-radius:24px;overflow:hidden;background:var(--bg-2);border:1px solid var(--line)}
.judge .ic{font:900 46px/1 var(--display);display:block;margin-bottom:14px}
.judge b{display:block;font:900 22px/1.3 'Noto Sans KR',var(--text);margin-bottom:6px}
.judge p{margin:0;color:var(--fg-2);font-size:14px}
.judge .ok{background:linear-gradient(160deg,rgba(79,227,193,.22),var(--bg-2) 60%)}.judge .ok .ic{color:#4fe3c1}
.judge .pk{background:linear-gradient(160deg,rgba(255,194,61,.22),var(--bg-2) 60%)}.judge .pk .ic{color:var(--yolk)}
.judge .no{background:linear-gradient(160deg,rgba(255,92,138,.2),var(--bg-2) 60%)}.judge .no .ic{color:var(--rose)}
@media (max-width:760px){.judge{grid-template-columns:1fr}}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}
.facts div{padding:20px 22px;border-radius:20px;border:1px solid var(--line)}
.facts b{display:block;font:800 17px/1.35 'Noto Sans KR',var(--text);margin-bottom:6px}
.facts span{color:var(--fg-2);font-size:13.5px;line-height:1.55;display:block}
@media (max-width:900px){.facts{grid-template-columns:1fr}}

/* ── 한 주 ── */
.week{display:grid;grid-template-columns:repeat(6,1fr) 1.6fr;gap:8px}
.day{position:relative;padding:18px 14px;border-radius:20px;background:var(--bg-2);border:1px solid var(--line);display:flex;flex-direction:column;gap:7px;min-height:200px;overflow:hidden}
.day h4{margin:0 0 8px;font:900 26px 'Noto Sans KR',var(--text)}
.day .en{font:500 10px var(--mono);letter-spacing:.14em;color:var(--fg-3)}
.day i{font-style:normal;align-self:flex-start;padding:6px 10px;border-radius:99px;background:var(--bg-3);font:600 13px var(--mono)}
.day.fri i,.day.sat i{background:rgba(255,194,61,.15);color:var(--yolk)}
.day .ball{position:absolute;right:-14px;bottom:-14px;width:54px;height:54px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#bbb 60%,#666);opacity:.1}
.day.sun{isolation:isolate;border-color:rgba(255,92,138,.5);justify-content:flex-end}
.day.sun img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.day.sun::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(6,6,8,.95) 30%,rgba(6,6,8,.2))}
.day.sun h4{margin:0}
.day.sun .chips{display:flex;flex-wrap:wrap;gap:6px}
.day.sun .chips span{padding:6px 10px;border-radius:99px;background:rgba(255,92,138,.22);border:1px solid rgba(255,92,138,.45);font:700 12px 'Noto Sans KR',var(--text)}
@media (max-width:900px){.week{grid-template-columns:repeat(3,1fr)}.day{min-height:150px}.day.sun{grid-column:1/-1;min-height:220px}}
.tl{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:clamp(28px,4vw,48px);border-top:2px solid var(--line);position:relative}
.tl::before{content:"";position:absolute;left:0;top:-2px;height:2px;width:var(--p,0%);background:linear-gradient(90deg,var(--yolk),var(--rose))}
.tl div{padding:22px 18px 0 0;position:relative}
.tl div::before{content:"";position:absolute;left:0;top:-8px;width:14px;height:14px;border-radius:50%;background:var(--bg);border:2px solid var(--yolk)}
.tl .mono{color:var(--fg-3);display:block;margin-top:6px}
.tl b{display:block;font:900 20px/1.3 'Noto Sans KR',var(--text);margin-top:10px}
.tl span{color:var(--fg-2);font-size:14px}
.safe{margin-top:clamp(28px,4vw,40px);display:flex;gap:10px;flex-wrap:wrap}
.safe span{padding:12px 18px;border-radius:16px;background:var(--bg-2);border:1px solid var(--line);font:600 14px 'Noto Sans KR',var(--text);color:var(--fg-2)}
.safe span b{color:var(--fg)}
@media (max-width:700px){.tl{grid-template-columns:1fr;border-top:0;border-left:2px solid var(--line);padding-left:18px}.tl::before{display:none}.tl div{padding:0 0 22px}.tl div::before{left:-27px;top:4px}}

/* ── 마지막 ── */
.kcta{position:relative;min-height:92svh;display:grid;place-items:center;text-align:center;overflow:hidden;isolation:isolate;padding:120px var(--gutter)}
.kcta video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.kcta::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 60% at 50% 50%,rgba(6,6,8,.35),rgba(6,6,8,.9)),linear-gradient(0deg,var(--bg),transparent 30%)}
.kcta h2{font:900 clamp(40px,7vw,120px)/1.02 'Noto Sans KR',var(--display);letter-spacing:-.05em;margin:0 0 20px}
.kcta p{color:var(--fg-2);margin:0 0 30px;font-size:clamp(15px,1.3vw,19px)}
.kcta .row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ── 테마곡 버튼 ── */
.music{position:fixed;right:clamp(14px,2vw,28px);bottom:clamp(14px,2vw,28px);z-index:60;display:inline-flex;align-items:center;gap:12px;padding:10px 18px 10px 10px;border-radius:99px;background:rgba(13,13,18,.78);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line);font:700 13px 'Noto Sans KR',var(--text);transition:border-color .3s}
.music:hover{border-color:var(--yolk)}
.music .eq{width:32px;height:32px;border-radius:50%;background:var(--yolk);display:grid;grid-auto-flow:column;align-items:end;justify-content:center;gap:2px;padding:9px 0}
.music .eq i{width:3px;height:4px;background:#000;border-radius:1px}
.music.on .eq i{animation:eq .9s ease-in-out infinite}
.music.on .eq i:nth-child(2){animation-delay:-.3s}.music.on .eq i:nth-child(3){animation-delay:-.6s}.music.on .eq i:nth-child(4){animation-delay:-.15s}
@keyframes eq{0%,100%{height:4px}50%{height:14px}}
.music small{display:block;font:500 10px var(--mono);color:var(--fg-3);letter-spacing:.08em}
@media (max-width:600px){.music{padding:8px 14px 8px 8px;gap:8px;font-size:12px}.music small{display:none}}
@media (prefers-reduced-motion:reduce){.music.on .eq i,.tier img,.step img,.tier .emb::before,.path span.go,.phone .snd{animation:none}.montage video{transition:opacity .3s}}
.khero .stores{margin-top:18px}.khero .play-badge{background:rgba(0,0,0,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}@media (max-width:700px){.khero .stores .mono{display:none}.khero .play-badge{padding:9px 16px 9px 12px}.khero .play-badge b{font-size:15px}}
@media (max-width:700px){.khero .in{padding-bottom:86px}.music{padding:8px}.music > span:last-child{display:none}}
