/* 共用分頁樣式 — NANA SEOUL 77 scroll-home */
*{box-sizing:border-box}
:root{--a:#78F0FF;--bg:#05060d;--ink:#eef1fa;--soft:#9aa3b8;--line:#1c2338;}
html{background:#05060d}
html,body{margin:0}
body{background:transparent;color:var(--ink);
  font-family:'Helvetica Neue',system-ui,-apple-system,'PingFang TC','Microsoft JhengHei',sans-serif;
  min-height:100vh;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:inherit}
/* 場景背景層（對應開場那一段的影片，暗化當頁面背景）*/
.bg{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;}
.bg-scrim{position:fixed;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(5,6,13,.72),rgba(5,6,13,.9) 55%,#05060d);}
.wrap{max-width:1040px;margin:0 auto;padding:0 22px}
/* top bar */
.pbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;
  padding:16px 22px;backdrop-filter:blur(10px);background:linear-gradient(#05060dcc,#05060d55);border-bottom:1px solid var(--line)}
.pbar .brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:700;letter-spacing:.02em}
.pbar .brand .mk{width:20px;height:24px;border-radius:6px 6px 9px 9px;background:linear-gradient(160deg,var(--a),#000)}
.pbar .back{text-decoration:none;font-size:.9rem;color:var(--soft);border:1px solid var(--line);padding:8px 16px;border-radius:999px}
.pbar .back:hover{color:#fff;border-color:var(--a)}
/* hero */
.hero{padding:64px 0 34px;text-align:center;position:relative}
.hero .eyebrow{letter-spacing:.34em;font-size:.72rem;color:var(--a);text-transform:uppercase;filter:drop-shadow(0 0 10px var(--a))}
.hero h1{font-size:clamp(2.1rem,6vw,3.6rem);margin:14px 0 10px;line-height:1.08}
.hero p{color:var(--soft);max-width:620px;margin:0 auto;font-size:1.06rem}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(60% 50% at 50% 0%,color-mix(in srgb,var(--a) 16%,transparent),transparent 70%)}
/* sections */
section{padding:26px 0}
h2.sec{font-size:1.35rem;margin:0 0 18px;display:flex;align-items:center;gap:10px}
h2.sec::before{content:"";width:22px;height:2px;background:var(--a);box-shadow:0 0 10px var(--a)}
.lede{color:var(--soft);max-width:720px;margin:0 auto 8px}
/* cards grid */
.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.card{background:#0a0f1e;border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:transform .2s,border-color .2s}
.card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--a) 45%,var(--line))}
.card video,.card img{width:100%;display:block;aspect-ratio:9/16;object-fit:cover;background:#05060d}
.card .cap{padding:12px 14px}
.card .cap b{display:block;font-size:1rem}
.card .cap span{color:var(--soft);font-size:.85rem}
/* 左右滑輪播（劇集頁，跟線上站 Season 1 一致）*/
.swipe{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 14px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.swipe::-webkit-scrollbar{display:none}
.swipe .card{flex:0 0 clamp(240px,74vw,320px);scroll-snap-align:center}
.swipe-hint{text-align:center;color:var(--soft);font-size:.85rem;letter-spacing:.08em;margin-top:6px}
/* buttons */
.btns{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:28px}
.btn{text-decoration:none;padding:13px 24px;border-radius:999px;font-weight:600;font-size:.95rem;transition:transform .2s}
.btn:hover{transform:translateY(-2px)}
.btn.solid{background:var(--a);color:#06070d;box-shadow:0 0 26px -8px var(--a)}
.btn.ghost{border:1.5px solid color-mix(in srgb,var(--a) 40%,var(--line));color:#fff}
.tags{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:14px}
.tags span{border:1px solid var(--line);color:var(--soft);border-radius:999px;padding:5px 13px;font-size:.8rem}
/* prose (story) */
.prose{max-width:720px;margin:0 auto}
.prose .ep{margin:34px 0;padding:22px 24px;background:#0a0f1e;border:1px solid var(--line);border-radius:16px}
.prose .ep h3{margin:0 0 12px;font-size:1.15rem;color:var(--a)}
.prose .ep p{margin:0 0 12px;color:#d6dcf0}
.prose .ep p:last-child{margin:0}
.prose em{color:#fff;font-style:normal;border-bottom:1px solid color-mix(in srgb,var(--a) 50%,transparent)}
/* lang toggle */
.lang{display:inline-flex;gap:6px;background:#0a0f1e;border:1px solid var(--line);border-radius:999px;padding:5px}
.lang button{font:inherit;font-size:.85rem;border:0;background:transparent;color:var(--soft);padding:7px 15px;border-radius:999px;cursor:pointer}
.lang button.on{background:var(--a);color:#06070d;font-weight:700}
/* footer */
footer{border-top:1px solid var(--line);margin-top:50px;padding:34px 22px;text-align:center;color:var(--soft);font-size:.85rem}
footer a{color:var(--a);text-decoration:none}