/* 임시 랜딩 — 시안 v1(09_랜딩페이지/마이웨이_임시랜딩_시안_v1.html) 그대로. 시안 안내 띠 · 「확인 중」 표시는 뺐다. */
:root{
  --navy:#141d33; --navy2:#1c2742; --navy3:#24325a; --cream:#ede6d6; --paper:#f6f1e6; --gold:#c9a25a; --gold2:#e2c07e; --ember:#ff8a3d;
  --ink:#1c2742; --sub:#646a7d; --line:#ddd4c2;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--navy);color:var(--cream);font-family:"Pretendard","Apple SD Gothic Neo","Malgun Gothic",sans-serif;-webkit-font-smoothing:antialiased;word-break:keep-all;overflow-wrap:break-word;font-size:17px;line-height:1.6}
.serif{font-family:"Gowun Batang","Nanum Myeongjo",serif}
a{color:inherit}
img{max-width:100%;display:block}
.gut{padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.wrap{max-width:1080px;margin:0 auto}

/* ===== HERO ===== */
.hero{position:relative;height:100vh;height:100svh;min-height:620px;max-height:980px;overflow:hidden;background:#0b1020;isolation:isolate}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.6s ease}
.slide.on{opacity:1}
.slide picture{display:block;width:100%;height:100%}
.slide img{width:100%;height:100%;object-fit:cover;transform:scale(1.04);filter:saturate(1.08) contrast(1.06) brightness(.82) sepia(.12)}
.slide.on img{animation:kb 7.5s ease-out forwards}
.slide[data-k="2"].on img{animation-name:kb2}
@keyframes kb{from{transform:scale(1.04) translate(0,0)}to{transform:scale(1.16) translate(-1.5%,-1%)}}
@keyframes kb2{from{transform:scale(1.16) translate(1.5%,0)}to{transform:scale(1.04) translate(0,0)}}
.shade{position:absolute;inset:0;z-index:1;background:
  radial-gradient(120% 70% at 50% 42%,rgba(11,16,32,.15),rgba(11,16,32,.7) 75%),
  linear-gradient(180deg,rgba(11,16,32,.75) 0%,rgba(11,16,32,0) 22%,rgba(11,16,32,0) 52%,rgba(11,16,32,.92) 100%)}
#embers{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;mix-blend-mode:screen}
.topbar{position:absolute;z-index:4;left:0;right:0;top:0;padding-top:calc(14px + env(safe-area-inset-top,0px));display:flex;align-items:center;justify-content:space-between}
.topbar .wm{font-size:13px;letter-spacing:.34em;color:var(--gold2);font-weight:700}
.topbar a{white-space:nowrap;font-size:14px;font-weight:700;text-decoration:none;border:1px solid rgba(226,192,126,.55);border-radius:999px;padding:7px 14px;color:var(--cream);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:rgba(20,29,51,.35)}
.center{position:absolute;z-index:4;left:0;right:0;top:46%;transform:translateY(-50%);text-align:center}
.stage{position:relative;width:min(84vw,540px);margin:0 auto;aspect-ratio:596/242}
.layer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .7s ease,filter .7s ease,transform .7s ease,visibility 0s .7s;filter:blur(8px);transform:scale(.97)}
.layer.show{opacity:1;visibility:visible;filter:none;transform:none;transition:opacity .6s ease,filter .6s ease,transform .6s ease,visibility 0s}
.logo img{width:100%;height:auto;filter:drop-shadow(0 6px 24px rgba(0,0,0,.45));clip-path:inset(0 50% 0 50%)}
.logo.show img{animation:reveal 1.3s cubic-bezier(.6,0,.2,1) .1s forwards}
@keyframes reveal{to{clip-path:inset(0 0 0 0)}}
.logo .sheen{position:absolute;inset:0;pointer-events:none;-webkit-mask:var(--lm) center/contain no-repeat;mask:var(--lm) center/contain no-repeat;background:linear-gradient(105deg,transparent 35%,rgba(255,236,190,.95) 50%,transparent 65%) -150% 0/250% 100% no-repeat}
.logo.show .sheen{animation:sheen 2.2s ease-in-out 1.5s 1 both}
@keyframes sheen{from{background-position:-150% 0}to{background-position:250% 0}}
.ty{flex-direction:column;text-align:center;gap:6px}
.ty .ln{display:block;font-family:"Gowun Batang","Nanum Myeongjo",serif;font-weight:700;color:var(--cream);line-height:1.3;white-space:nowrap;text-shadow:0 4px 22px rgba(0,0,0,.55)}
.ty .l1{font-size:clamp(22px,6.2vw,36px)}
.ty .l2{font-size:clamp(32px,9.6vw,58px);letter-spacing:.02em}
.ty .g{color:var(--gold2)}
.ty .ch{display:inline-block;opacity:0;transform:translateY(.45em);filter:blur(6px)}
.ty.show .ch{animation:chIn .75s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:calc(var(--i) * 55ms + 150ms)}
@keyframes chIn{to{opacity:1;transform:none;filter:none}}
.ty .orn{width:min(60vw,300px);height:14px;margin:4px auto 0;overflow:visible}
.ty .orn path{stroke:var(--gold);stroke-width:1.4;fill:none;stroke-dasharray:320;stroke-dashoffset:320}
.ty .orn circle{fill:var(--gold);opacity:0}
.ty.show .orn path{animation:draw 1.4s ease .9s forwards}
.ty.show .orn circle{animation:fadeIn .4s ease 1.9s forwards}
@keyframes fadeIn{to{opacity:1}}
.vs{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:22px;opacity:0;animation:up .9s ease 1.6s forwards}
.vs svg{width:72px;height:12px;overflow:visible}
.vs path{stroke:var(--gold);stroke-width:1.5;fill:none;stroke-dasharray:90;stroke-dashoffset:90;animation:draw 1.2s ease 1.9s forwards}
.vs circle{fill:var(--gold)}
@keyframes draw{to{stroke-dashoffset:0}}
.vs .t{font-size:clamp(17px,4.6vw,22px);font-weight:700;letter-spacing:.06em}
.vs .t b{color:var(--gold2);font-weight:700}
@keyframes up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.bottom{position:absolute;z-index:4;left:0;right:0;bottom:0;padding-bottom:calc(22px + env(safe-area-inset-bottom,0px))}
.cap{display:flex;align-items:baseline;gap:10px;margin-bottom:14px;min-height:30px}
.cap .no{font-size:13px;color:var(--gold2);font-weight:700;letter-spacing:.12em}
.cap .tx{font-size:18px;font-weight:700;transition:opacity .5s}
.bars{display:flex;gap:6px;margin-bottom:18px}
.bars i{flex:1;height:3px;border-radius:2px;background:rgba(237,230,214,.25);overflow:hidden;position:relative;cursor:pointer}
.bars i b{position:absolute;inset:0;background:var(--gold2);transform-origin:left;transform:scaleX(0)}
.bars i.done b{transform:scaleX(1)}
.bars i.run b{animation:bar 6s linear forwards}
@keyframes bar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.cta{display:grid;grid-template-columns:1fr 1fr;gap:10px;opacity:0;animation:up .9s ease 2.2s forwards}
.cta a{height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:17px;font-weight:800;text-decoration:none}
.cta .p{background:var(--gold);color:var(--navy)}
.cta .s{border:1.5px solid rgba(237,230,214,.6);color:var(--cream);background:rgba(20,29,51,.35);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.cta svg{width:18px;height:18px}
.scrollhint{position:absolute;z-index:4;left:50%;bottom:calc(150px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);width:22px;height:34px;border:1.5px solid rgba(237,230,214,.5);border-radius:12px;opacity:0;animation:up .9s ease 3s forwards}
.scrollhint:after{content:"";position:absolute;left:50%;top:7px;width:3px;height:7px;margin-left:-1.5px;border-radius:2px;background:var(--gold2);animation:wheel 1.8s ease infinite}
@keyframes wheel{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(10px)}}

/* ===== SECTIONS ===== */
.sec{padding-block:72px}
.eyebrow{font-size:12px;letter-spacing:.32em;color:var(--gold);font-weight:700;margin-bottom:10px}
.h2{font-size:clamp(28px,7vw,40px);line-height:1.3;margin:0 0 12px;font-weight:700;text-wrap:balance}
.lead{color:#b9bccb;max-width:560px;margin:0}
.light{background:var(--paper);color:var(--ink)}
.light .lead{color:var(--sub)}
.light .eyebrow{color:#a17c3a}

/* 두 가지 불 */
.duel{display:grid;grid-template-columns:1fr auto 1fr;gap:0;margin-top:30px;align-items:stretch}
.fire{border-radius:20px;padding:24px 18px 22px;text-align:center;position:relative;overflow:hidden;min-width:0}
.fire.a{background:linear-gradient(170deg,#24325a,#141d33)}
.fire.b{background:linear-gradient(170deg,#3a2316,#1d130d)}
.fire svg{width:64px;height:64px;margin:0 auto 10px;display:block}
.fire h3{margin:0;font-size:24px}
.fire p{margin:6px 0 0;font-size:15px;color:#c6c3bc;line-height:1.55}
.vsdot{align-self:center;width:46px;height:46px;border-radius:50%;background:var(--gold);color:var(--navy);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;margin:0 -12px;z-index:1;box-shadow:0 0 0 5px var(--navy)}
.flk{transform-origin:50% 90%;animation:flk 1.6s ease-in-out infinite}
.flk2{transform-origin:50% 90%;animation:flk 1.3s ease-in-out .3s infinite}
@keyframes flk{0%,100%{transform:scaleY(1) skewX(0)}30%{transform:scaleY(1.08) skewX(-3deg)}60%{transform:scaleY(.94) skewX(2deg)}}
.fire-x{display:flex;gap:14px;align-items:center;margin-top:12px;border-radius:18px;padding:14px 18px;background:rgba(237,230,214,.06);border:1px solid rgba(226,192,126,.25)}
.fire-x i{flex:none;width:52px;height:52px;border-radius:50%;background:var(--gold);color:var(--navy);display:flex;align-items:center;justify-content:center;font-style:normal;font-weight:800;font-size:14px}
.fire-x b{display:block;font-size:20px}
.fire-x span{display:block;font-size:15px;color:#b9bccb;line-height:1.5}

/* 메뉴 */
.menus{display:grid;grid-auto-flow:column;grid-auto-columns:min(78%,320px);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 0 14px;margin-top:16px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.menus::-webkit-scrollbar{display:none}
.mc{scroll-snap-align:start;background:#fff;border-radius:20px;overflow:hidden;border:1px solid var(--line);min-width:0;position:relative}
.mc .ph{aspect-ratio:4/3;overflow:hidden;background:#e9e2d2}
.mc .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.mc:hover .ph img{transform:scale(1.05)}
.mc .bd{padding:14px 16px 16px}
.mc h3{margin:0;font-size:21px}
.mc h3 small{font-size:15px;color:var(--sub);font-family:Pretendard,sans-serif}
.mc .ds{font-size:14px;color:var(--sub);margin-top:4px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:42px}
.mc .opts{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:8px}
.mc .opts span{font-size:14px;color:var(--sub);font-weight:600}
.mc .opts b{font-size:19px;color:var(--ink);font-weight:800}
.mc .opts em{font-style:normal;margin-right:5px}
.mc .badge{position:absolute;left:12px;top:12px;background:var(--gold);color:var(--navy);font-size:12px;font-weight:800;padding:4px 9px;border-radius:999px}
.mwrap{position:relative}
.mtabs{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-top:24px;padding-bottom:2px}
.mtabs::-webkit-scrollbar{display:none}
.mtabs button{flex:none;height:42px;padding:0 16px;border-radius:999px;border:1.5px solid var(--line);background:#fff;color:var(--sub);font-family:inherit;font-size:15px;font-weight:700;cursor:pointer}
.mtabs button.on{background:var(--ink);border-color:var(--ink);color:var(--cream)}
.mdots[hidden],.mpane[hidden]{display:none}
.extra{margin-top:10px}
.extra .row{display:flex;justify-content:space-between;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 16px;font-weight:700;margin-top:8px}
.extra .row b{font-weight:800}
.arr{position:absolute;top:calc(20px + (min(78vw,320px) * .75) / 2);transform:translateY(-50%);z-index:3;width:48px;height:48px;border-radius:50%;border:0;background:rgba(255,255,255,.95);color:var(--ink);box-shadow:0 4px 16px rgba(20,29,51,.25);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:opacity .25s,transform .2s}
.arr:hover{transform:translateY(-50%) scale(1.06)}
.arr svg{width:22px;height:22px}
.arr.l{left:-14px}.arr.r{right:-14px}
.arr[disabled]{opacity:0;pointer-events:none}
.mdots{display:flex;justify-content:center;gap:6px;margin-top:4px}
.mdots i{width:7px;height:7px;border-radius:4px;background:#d3c9b5;transition:width .25s,background .25s;cursor:pointer}
.mdots i.on{width:22px;background:var(--ink)}
.note{font-size:13px;color:var(--sub);margin-top:6px}

/* 공간 */
.space{display:grid;grid-template-columns:1.3fr 1fr;gap:12px;margin-top:28px}
.space figure{margin:0;position:relative;border-radius:18px;overflow:hidden;min-height:180px}
.space figure img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.space figure:first-child{grid-row:span 2;min-height:380px}
.space figcaption{position:absolute;left:0;right:0;bottom:0;padding:40px 16px 14px;background:linear-gradient(transparent,rgba(11,16,32,.85));font-weight:700;font-size:17px}
.space figcaption span{display:block;font-size:13px;font-weight:600;color:var(--gold2);letter-spacing:.08em}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.fact{display:flex;gap:14px;align-items:center;background:rgba(237,230,214,.06);border:1px solid rgba(226,192,126,.25);border-radius:16px;padding:14px 16px;min-width:0}
.fact i{flex:none;width:48px;height:48px;border-radius:12px;background:var(--gold);color:var(--navy);display:flex;align-items:center;justify-content:center;font-style:normal;font-weight:800;font-size:15px}
.fact b{display:block;font-size:18px}
.fact span{display:block;font-size:14px;color:#b9bccb;line-height:1.5}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.chips span{font-size:14px;font-weight:600;color:var(--cream);border:1px solid rgba(237,230,214,.25);border-radius:999px;padding:6px 12px}
.chips span:before{content:"✓ ";color:var(--gold2)}
.chips span.no{color:#9ea3b5}.chips span.no:before{content:"✕ ";color:#9ea3b5}
.chips small{font-size:12px;color:#9ea3b5}
.cta2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}
.cta2 a{height:54px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:800;text-decoration:none}
.cta2 .p{background:var(--gold);color:var(--navy)}
.cta2 .s{background:#03c75a;color:#fff}

/* 오시는 길 */
.loc{display:grid;grid-template-columns:1fr 1.2fr;gap:24px;margin-top:26px;align-items:start}
.loc .addr{font-size:24px;font-weight:800;line-height:1.35}
.loc .area{color:var(--sub);margin-top:4px}
.loc .kv{margin-top:14px;font-size:16px;line-height:1.9}
.loc .kv div{display:flex;gap:12px}
.loc .kv div>span:first-child{color:var(--sub);width:64px;flex:none}
.loc .kv div>span:nth-child(2){min-width:0}
.loc .kv small{color:var(--sub);font-size:14px}
.loc .telk{font-weight:800;text-decoration:none}

/* 카카오 지도(seaedu KakaoMap 방식) — 키가 없거나 못 불러오면 회색 판 + 아래 두 버튼만 */
.map{position:relative;height:200px;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:#e3e1db}
.kmap-canvas{position:absolute;inset:0}
.kmap-shield{position:absolute;inset:0;z-index:3;background:transparent}
.kmap-zoom{position:absolute;right:10px;top:10px;z-index:4;display:grid;gap:4px}
.kmap-zoom button{width:36px;height:36px;background:#fff;border:1px solid var(--line);border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:20px;color:var(--ink);cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.12)}
.map-tag{background:var(--ink);color:var(--cream);font-weight:800;font-size:13px;padding:5px 10px;border-radius:10px;white-space:nowrap;font-family:Pretendard,sans-serif;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.mapbtn{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.mapbtn a{height:50px;border-radius:12px;border:1.5px solid var(--line);background:#fff;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;text-decoration:none;color:var(--ink)}

.foot{background:#0d1426;color:#9ea3b5;font-size:13px;line-height:1.8;padding-block:34px calc(34px + env(safe-area-inset-bottom,0px))}
.foot b{color:var(--cream)}

.js .rv{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s ease}
.js .rv.in{opacity:1;transform:none}

@media (max-width:720px){
  .facts{grid-template-columns:1fr}
  .arr{width:40px;height:40px}.arr.l{left:-6px}.arr.r{right:-6px}
  .wm2{display:none}
  .scrollhint{display:none}
  .space{grid-template-columns:1fr 1fr}
  .space figure:first-child{grid-column:span 2;grid-row:auto;min-height:240px}
  .loc{grid-template-columns:1fr}
  .duel{grid-template-columns:1fr auto 1fr}
  .fire{padding:20px 12px 18px}
  .fire h3{font-size:20px}
  .fire p{font-size:14px}
}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .logo img{clip-path:none}
}