/* ===== TEUPIN LAYEU · CINEMATIC LAYER ===== */
.cx-grain{position:fixed;inset:-50%;z-index:9998;pointer-events:none;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:cxg 1s steps(6) infinite;mix-blend-mode:overlay}
@keyframes cxg{0%{transform:translate(0,0)}20%{transform:translate(-5%,3%)}40%{transform:translate(4%,-6%)}60%{transform:translate(-7%,-2%)}80%{transform:translate(3%,6%)}100%{transform:translate(0,0)}}
.cx-vig{position:fixed;inset:0;z-index:9997;pointer-events:none;background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.45) 100%)}
.cx-intro{position:fixed;inset:0;z-index:10000;background:#000;display:grid;place-items:center;cursor:pointer;animation:cxOut .9s ease 3.4s forwards}
.cx-intro .cx-flare{position:absolute;top:50%;left:-30%;width:60%;height:2px;background:linear-gradient(90deg,transparent,#e2c48a,#fff,#3fc1b6,transparent);filter:blur(1px);box-shadow:0 0 40px 8px rgba(226,196,138,.6);animation:cxFlare 2.2s cubic-bezier(.7,0,.3,1) .3s forwards;opacity:0}
.cx-intro .cx-t{text-align:center;color:#ece2cf;font-family:"Marcellus",Georgia,serif;padding:0 20px}
.cx-intro small{display:block;font:500 11px/1 "Jost",sans-serif;letter-spacing:.6em;color:#c9a465;opacity:0;animation:cxFade 1s ease .5s forwards}
.cx-intro h1{font-size:clamp(30px,6vw,78px);font-weight:400;letter-spacing:.9em;margin:22px 0;opacity:0;filter:blur(14px);animation:cxTitle 2.2s cubic-bezier(.2,.7,.2,1) .8s forwards;background:linear-gradient(100deg,#c9a465 20%,#fff6dd 45%,#c9a465 70%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
.cx-intro em{font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(18px,2.4vw,26px);color:#a9a397;opacity:0;animation:cxFade 1s ease 1.8s forwards}
.cx-intro .cx-skip{position:absolute;bottom:22px;right:24px;font:500 10px "Jost",sans-serif;letter-spacing:.3em;color:#a9a397}
@keyframes cxOut{to{opacity:0;visibility:hidden}}@keyframes cxFade{to{opacity:1}}
@keyframes cxTitle{0%{opacity:0;filter:blur(14px);letter-spacing:.9em;background-position:120% 0}60%{opacity:1;filter:blur(0)}100%{opacity:1;filter:blur(0);letter-spacing:.14em;background-position:-30% 0}}
@keyframes cxFlare{0%{left:-60%;opacity:0}20%{opacity:1}100%{left:110%;opacity:0}}
.cx-kbw{overflow:hidden!important}
.cx-kb{animation:cxKb 22s ease-in-out infinite alternate;transform-origin:var(--ox,50%) var(--oy,50%);will-change:transform}
@keyframes cxKb{from{transform:scale(1.02)}to{transform:scale(1.14) translate(var(--tx,1.5%),var(--ty,-1%))}}
.cx-rv{opacity:0;transform:translateY(40px);transition:opacity 1.1s cubic-bezier(.2,.7,.2,1),transform 1.1s cubic-bezier(.2,.7,.2,1),clip-path 1.4s cubic-bezier(.7,0,.2,1),filter 1.2s}
.cx-rv.cx-img{clip-path:inset(0 100% 0 0);transform:none;opacity:1;filter:brightness(2) saturate(0)}
.cx-rv.cx-in{opacity:1;transform:none;clip-path:inset(0 0 0 0);filter:none}
h2.cx-rv{filter:blur(10px);letter-spacing:.32em}h2.cx-rv.cx-in{filter:blur(0);letter-spacing:.02em;transition:all 1.6s cubic-bezier(.2,.7,.2,1)}
.btn{position:relative;overflow:hidden}.btn::after{content:"";position:absolute;top:0;left:-80%;width:50%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:cxSweep 4.5s ease-in-out infinite}
@keyframes cxSweep{0%,70%{left:-80%}100%{left:140%}}
.cx-dust{position:absolute;inset:0;z-index:1;pointer-events:none}
/* ===== JOURNEY MAP ===== */
.cj{position:relative;height:620vh;background:#04080a}
.cj-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.cj-map{position:absolute;inset:0;width:100%;height:100%;display:block}
.cj-pin::before,.cj-pin::after{content:"";position:absolute;left:0;right:0;height:7vh;background:#000;z-index:5;pointer-events:none}.cj-pin::before{top:0}.cj-pin::after{bottom:0}
.cj-scan{position:absolute;inset:0;z-index:4;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px);mix-blend-mode:overlay}
.cj-hud{position:absolute;inset:7vh 0;z-index:6;pointer-events:none;font-family:"Jost",sans-serif;color:#ece2cf}
.cj-top{position:absolute;top:18px;left:24px;right:24px;display:flex;justify-content:space-between;gap:12px;font-size:11px;letter-spacing:.32em;color:#c9a465;text-transform:uppercase}
.cj-coord{font-variant-numeric:tabular-nums;color:#3fc1b6;letter-spacing:.18em}
.cj-card{position:absolute;left:24px;bottom:96px;max-width:min(440px,calc(100% - 48px));padding:22px 24px;background:linear-gradient(135deg,rgba(13,17,19,.88),rgba(10,59,69,.55));border:1px solid rgba(201,164,101,.35);backdrop-filter:blur(6px);transition:opacity .5s,transform .5s}
.cj-card.sw{opacity:0;transform:translateY(16px)}
.cj-num{font-family:"Marcellus",serif;font-size:58px;line-height:.9;color:transparent;-webkit-text-stroke:1px #c9a465;float:right;margin-left:14px}
.cj-mode{font-size:11px;letter-spacing:.34em;color:#3fc1b6;font-weight:500}
.cj-card h3{font-family:"Marcellus",serif;font-weight:400;font-size:clamp(22px,2.6vw,30px);margin:6px 0 8px;color:#ece2cf;line-height:1.15}
.cj-card p{margin:0;font-size:14.5px;line-height:1.6;color:#cfc6b6;font-weight:300}
.cj-stats{position:absolute;right:24px;bottom:96px;display:flex;gap:22px;text-align:right}
.cj-stats b{display:block;font-family:"Marcellus",serif;font-weight:400;font-size:clamp(30px,4.4vw,56px);line-height:1;color:#e2c48a;font-variant-numeric:tabular-nums;text-shadow:0 0 24px rgba(226,196,138,.45)}
.cj-stats small{font-size:10px;letter-spacing:.32em;color:#a9a397}
.cj-prog{position:absolute;left:24px;right:24px;bottom:40px;height:2px;background:rgba(236,226,207,.15)}
.cj-prog i{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,#c9a465,#3fc1b6);box-shadow:0 0 12px #3fc1b6}
.cj-prog span{position:absolute;top:50%;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:#04080a;border:1px solid #c9a465;transition:background .4s,box-shadow .4s}
.cj-prog span.on{background:#e2c48a;box-shadow:0 0 14px #e2c48a}
.cj-prog em{position:absolute;top:14px;transform:translateX(-50%);font-style:normal;font-size:9px;letter-spacing:.2em;color:#a9a397;white-space:nowrap}
.cj-play{pointer-events:auto;position:absolute;top:52px;right:24px;background:rgba(201,164,101,.12);border:1px solid #c9a465;color:#e2c48a;font:500 11px "Jost",sans-serif;letter-spacing:.3em;padding:11px 16px;cursor:pointer}
.cj-play:hover{background:#c9a465;color:#04080a}
.cj-hero{position:absolute;left:0;right:0;top:30%;text-align:center;transition:opacity .6s;padding:0 20px}
.cj-hero small{font-size:11px;letter-spacing:.5em;color:#c9a465}
.cj-hero h2{font-family:"Marcellus",serif;font-weight:400;font-size:clamp(34px,6.5vw,86px);margin:14px 0;letter-spacing:.08em;background:linear-gradient(100deg,#c9a465 25%,#fff6dd 50%,#c9a465 75%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:cjShine 5s linear infinite}
.cj-hero p{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(18px,2.2vw,26px);color:#d8cfbf;margin:0}
.cj-hero .cue{display:block;margin-top:28px;font:500 10px "Jost";letter-spacing:.4em;color:#a9a397;animation:cjBob 1.6s ease-in-out infinite}
@keyframes cjShine{to{background-position:-250% 0}}@keyframes cjBob{50%{transform:translateY(8px)}}
.cj-final{position:absolute;left:0;right:0;top:16%;text-align:center;opacity:0;transform:scale(1.15);transition:opacity .9s,transform 1.4s cubic-bezier(.2,.7,.2,1)}
.cj-final.on{opacity:1;transform:none}
.cj-final small{font-size:11px;letter-spacing:.5em;color:#3fc1b6}
.cj-final h2{font-family:"Marcellus",serif;font-weight:400;font-size:clamp(30px,5.4vw,72px);letter-spacing:.12em;margin:10px 0;color:#fff6dd;text-shadow:0 0 40px rgba(226,196,138,.7)}
.cj-final a{pointer-events:auto;display:inline-block;margin-top:14px;padding:13px 24px;background:#c9a465;color:#04080a;text-decoration:none;font:500 12px "Jost";letter-spacing:.24em}
.cj text{font-family:"Jost",sans-serif}
@media(max-width:700px){.cj-card{bottom:150px;left:14px;right:14px;max-width:none;padding:16px}.cj-stats{right:14px;bottom:auto;top:52px;left:14px;justify-content:flex-start;text-align:left}.cj-play{top:auto;bottom:62px;right:14px;padding:8px 12px}.cj-num{font-size:40px}.cj-prog em{display:none}.cj-top{left:14px;right:14px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.cx-grain,.cx-intro{display:none}.cx-kb{animation:none}.cx-rv{opacity:1;transform:none;clip-path:none;filter:none}.cj{height:auto}.cj-pin{position:relative;height:90vh}}

.cj-media{position:absolute;left:24px;top:52px;width:min(380px,calc(100% - 48px));aspect-ratio:16/9;margin-bottom:0;border:1px solid rgba(201,164,101,.45);box-shadow:0 20px 60px rgba(0,0,0,.6),0 0 40px rgba(63,193,182,.15);overflow:hidden;background:#000}
.cj-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .9s;transform:scale(1.04)}.cj-media video.on{opacity:1}
.cj-media span{position:absolute;left:8px;bottom:6px;font-size:9px;letter-spacing:.16em;color:rgba(255,246,221,.8);text-shadow:0 1px 4px #000}
.cj-media::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 40px rgba(0,0,0,.6);pointer-events:none}
@media(max-width:700px){.cj-media{left:14px;top:108px;width:calc(100% - 28px);aspect-ratio:21/9}}
@media(max-height:680px){.cj-media{display:none}}