/* shine shineok.cn - 聚光舞台 · 四色体系: 黑#170A10/白/粉#FD4569/青绿#1FBFA0 */
:root{
  --night:#170A10;
  --panel:#241019;
  --pink:#FD4569;
  --teal:#1FBFA0;
  --mist:#F9F1F2;
  --line:#E8D5D9;
  --white:#FFFFFF;
  --ink:#170A10;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;background:var(--night);color:var(--white);line-height:1.7;}
img{max-width:100%;height:auto;display:block;}
a{text-decoration:none;color:inherit;}
ul{list-style:none;}
[id]{scroll-margin-top:84px;}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0;}

/* ---------- 入场动画 ---------- */
.rv{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease;}
.rv.in{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .rv{opacity:1;transform:none;transition:none;}
}

/* ---------- 按钮 ---------- */
.sbtn{display:inline-block;padding:12px 28px;font-size:15px;font-weight:800;border:2px solid var(--ink);line-height:1.4;transition:transform .15s ease;}
.sbtn:hover{transform:translate(2px,2px);}
.sbtn-lg{padding:15px 34px;font-size:17px;}
.sbtn-pink{background:var(--pink);color:var(--white);}
.sbtn-ink{background:var(--ink);color:var(--white);}
.sbtn-line{background:transparent;color:var(--white);border-color:var(--white);}

/* ---------- 顶栏 ---------- */
.sbar{position:sticky;top:0;z-index:60;background:var(--night);border-bottom:3px solid var(--pink);}
.sbar-in{display:flex;align-items:center;gap:26px;height:70px;}
.slogo{display:flex;align-items:center;gap:10px;}
.slogo img{width:40px;height:40px;object-fit:contain;}
.slogo-t{display:flex;flex-direction:column;line-height:1.25;}
.slogo-t strong{font-size:17px;letter-spacing:1px;color:var(--white);}
.slogo-t small{font-size:11px;color:rgba(255,255,255,.55);}
.snav{display:flex;gap:22px;margin-left:auto;}
.snav a{font-size:14px;font-weight:600;color:rgba(255,255,255,.75);padding:6px 2px;border-bottom:3px solid transparent;}
.snav a.on,.snav a:hover{color:var(--pink);border-bottom-color:var(--pink);}
.sbar-r{display:flex;align-items:center;gap:14px;}
.sbar-cta{padding:9px 22px;font-size:14px;}
.burger{display:none;width:42px;height:42px;border:2px solid var(--pink);background:var(--night);cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;}
.burger span{display:block;width:20px;height:2px;background:var(--pink);}

/* ---------- 英雄区: 聚光舞台 ---------- */
.sle{padding:52px 0 64px;background:var(--night);}
.sle-in{background:var(--panel);border:2px solid var(--pink);box-shadow:10px 12px 0 var(--teal);padding:46px 48px;display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center;}
.skick{font-size:12px;letter-spacing:2px;color:rgba(255,255,255,.6);font-weight:700;margin-bottom:14px;}
.skick i{font-style:normal;background:var(--pink);color:var(--white);padding:3px 9px;margin-right:10px;font-size:10px;letter-spacing:1px;}
.sle h1{font-size:56px;font-weight:900;letter-spacing:2px;line-height:1.15;margin-bottom:16px;color:var(--white);}
.sle .lead{font-size:15px;line-height:1.95;color:rgba(255,255,255,.82);margin-bottom:24px;}
.sle-acts{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:20px;}
.stags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;}
.stags li{border:1px solid rgba(255,255,255,.4);padding:5px 13px;font-size:12px;font-weight:600;color:rgba(255,255,255,.85);}
.snote-line{display:flex;align-items:center;gap:8px;font-size:12px;color:rgba(255,255,255,.6);}
.snote-line .sq{width:10px;height:10px;background:var(--teal);flex:none;}
.sle-r{min-width:0;}
.sstage{position:relative;background:var(--night);border:2px solid var(--pink);padding:52px 26px 40px;min-height:430px;overflow:hidden;}
.sbeams{position:absolute;inset:0;width:100%;height:100%;}
.schip{position:absolute;z-index:2;background:var(--white);color:var(--ink);border:2px solid var(--ink);font-size:11px;font-weight:800;padding:5px 10px;white-space:nowrap;}
.chip-tl{top:14px;left:14px;}
.chip-tr{top:14px;right:14px;background:var(--pink);color:var(--white);}
.chip-bl{bottom:14px;left:14px;background:var(--teal);}
.sscreen{position:relative;z-index:1;width:min(320px,86%);margin:26px auto 0;background:var(--white);border:6px solid var(--ink);}
.sscreen img{width:100%;}
.sscreen figcaption{background:var(--ink);color:var(--white);font-size:11px;padding:6px 10px;display:flex;justify-content:space-between;align-items:center;}
.sscreen figcaption b{color:var(--pink);}

/* ---------- 区块标题 ---------- */
.ssech{margin-bottom:30px;}
.ssech h2{font-size:29px;font-weight:900;line-height:1.4;margin-bottom:8px;}
.ssech .ssub{font-size:13px;}

/* ---------- 灯牌数据（深色·错落） ---------- */
.splaques{background:var(--night);padding:56px 0 72px;}
.splaques-in{background:var(--panel);border:2px solid var(--pink);box-shadow:8px -8px 0 var(--pink);padding:26px 22px;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.splq{background:var(--night);border:2px solid var(--pink);padding:24px 12px;text-align:center;}
.splq:nth-child(2){transform:translateY(12px);}
.splq:nth-child(3){transform:translateY(4px);}
.splq:nth-child(4){transform:translateY(18px);}
.splq b{display:block;font-size:28px;font-weight:900;color:var(--pink);letter-spacing:1px;}
.splq span{font-size:12px;color:rgba(255,255,255,.72);}

/* ---------- 节目单（浅色·行式） ---------- */
.sbill{background:var(--white);padding:64px 0;color:var(--ink);}
.sbill .ssub{color:#9A5A67;}
.sbill-in{background:var(--mist);border:2px solid var(--ink);box-shadow:-12px 10px 0 var(--pink);padding:12px 26px;}
.srow{display:grid;grid-template-columns:76px 1fr auto;gap:18px;align-items:center;padding:19px 0;border-bottom:1px dashed var(--line);}
.srow:last-child{border-bottom:none;}
.srow-no{background:var(--pink);color:var(--white);font-size:12px;font-weight:800;padding:5px 0;text-align:center;letter-spacing:1px;}
.srow:nth-child(even) .srow-no{background:var(--teal);color:var(--ink);}
.srow-mid h3{font-size:16px;font-weight:800;margin-bottom:5px;}
.srow-mid p{font-size:13px;line-height:1.8;color:#5C4048;}
.srow-tag{background:var(--ink);color:var(--white);font-size:11px;font-weight:700;padding:5px 12px;letter-spacing:2px;}
.srow:nth-child(even) .srow-tag{background:var(--pink);}

/* ---------- 后台实拍（浅色·一大两小） ---------- */
.sback{background:var(--mist);padding:64px 0;color:var(--ink);}
.sback .ssub{color:#9A5A67;}
.sback-wrap{background:var(--white);border:2px solid var(--ink);box-shadow:12px 8px 0 var(--teal);padding:22px;}
.sgtop{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:18px;align-items:end;}
.sf{background:var(--white);border:1px solid var(--line);}
.sf .cap{display:block;height:6px;background:var(--teal);}
.sf.mid .cap{background:var(--pink);}
.sf img{margin:0 auto;padding:10px 10px 0;max-width:225px;}
.sf.mid img{max-width:280px;}
.sf figcaption{border-top:1px solid var(--line);font-size:12px;font-weight:600;color:#5C4048;padding:8px 12px;}
.sgal-low{margin-top:20px;display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:18px;align-items:stretch;}
.snote{background:var(--mist);border-left:6px solid var(--teal);padding:22px;}
.snote h3{font-size:18px;font-weight:800;margin-bottom:8px;}
.snote p{font-size:13px;line-height:1.85;color:#5C4048;margin-bottom:14px;}
.sgal-low .sf{display:flex;flex-direction:column;}
.sgal-low .sf figcaption{margin-top:auto;}

/* ---------- 上台三步（深色·时间线） ---------- */
.ssteps{background:var(--night);padding:64px 0;}
.ssteps .ssech h2{color:var(--white);}
.ssteps .ssub,.ssteps .skick{color:rgba(255,255,255,.65);}
.sline-wrap{background:var(--panel);border:2px solid var(--pink);box-shadow:-8px -8px 0 var(--teal);padding:32px 34px 14px;}
.stimeline{position:relative;}
.stimeline::before{content:"";position:absolute;left:10px;top:6px;bottom:26px;border-left:2px dashed rgba(255,255,255,.3);}
.sti{position:relative;padding:0 0 28px 52px;}
.sti-node{position:absolute;left:0;top:2px;width:22px;height:22px;background:var(--pink);border:2px solid var(--ink);}
.sti-node.alt{background:var(--teal);}
.sti h3{font-size:16px;font-weight:800;color:var(--white);margin-bottom:6px;}
.sti p{font-size:13px;line-height:1.85;color:rgba(255,255,255,.78);max-width:760px;}

/* ---------- 观众问答（浅色·书脊） ---------- */
.sask{background:var(--white);padding:64px 0;color:var(--ink);}
.sask .ssub{color:#9A5A67;}
.sbook{background:var(--mist);border:2px solid var(--ink);border-left:10px solid var(--pink);box-shadow:0 12px 0 var(--pink);padding:24px 26px;}
.sq{border-bottom:1px dashed var(--line);}
.sq:last-child{border-bottom:none;}
.sq summary{display:flex;align-items:center;gap:10px;padding:14px 6px;cursor:pointer;list-style:none;font-weight:700;font-size:14px;}
.sq summary::-webkit-details-marker{display:none;}
.sq-no{flex:none;background:var(--pink);color:var(--white);font-size:11px;font-weight:800;padding:2px 8px;letter-spacing:1px;}
.sq:nth-child(even) .sq-no{background:var(--teal);color:var(--ink);}
.sq-t{flex:1;}
.sq-x{flex:none;position:relative;width:16px;height:16px;}
.sq-x::before,.sq-x::after{content:"";position:absolute;background:var(--ink);top:50%;left:50%;}
.sq-x::before{width:14px;height:2px;transform:translate(-50%,-50%);}
.sq-x::after{width:2px;height:14px;transform:translate(-50%,-50%);transition:transform .2s ease;}
.sq[open] .sq-x::after{transform:translate(-50%,-50%) rotate(90deg);}
.sq[open] summary{background:var(--white);}
.sq-a{padding:2px 6px 16px;}
.sq-a p{font-size:13px;line-height:1.9;color:#5C4048;}

/* ---------- 掌声回放（浅色·三列） ---------- */
.sclaps{background:var(--mist);padding:64px 0;color:var(--ink);}
.sclaps .ssub{color:#9A5A67;}
.sgrid{background:var(--white);border:2px solid var(--ink);box-shadow:-10px -6px 0 var(--teal);padding:22px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:start;}
.sc{background:var(--mist);border:1px solid var(--line);border-top:5px solid var(--pink);padding:18px 18px 14px;}
.sc.alt{border-top-color:var(--teal);}
.sc-h{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#9A5A67;letter-spacing:1px;margin-bottom:10px;}
.sc-h b{background:var(--ink);color:var(--white);font-size:10px;font-weight:800;padding:2px 8px;letter-spacing:1px;}
.sc.alt .sc-h b{background:var(--pink);}
.sc p{font-size:13px;line-height:1.9;color:#43292F;margin-bottom:12px;}
.sc footer{display:flex;justify-content:space-between;align-items:center;font-size:12px;border-top:1px solid var(--line);padding-top:10px;}
.sc footer b{font-weight:700;}
.sc footer time{color:#9A5A67;}

/* ---------- 底部CTA ---------- */
.scta{background:var(--night);padding:0 0 64px;}
.scta-box{background:var(--pink);border:2px solid var(--ink);box-shadow:6px 10px 0 var(--teal);padding:40px 44px;display:flex;align-items:center;gap:34px;}
.scta-l{flex:1;}
.scta-sign{font-size:12px;letter-spacing:2px;margin-bottom:10px;color:rgba(255,255,255,.85);font-weight:700;}
.scta-sign .sq{display:inline-block;width:10px;height:10px;background:var(--teal);border:1px solid var(--ink);margin-right:8px;}
.scta-box h2{font-size:26px;font-weight:900;line-height:1.4;margin-bottom:10px;color:var(--white);}
.scta-p{font-size:14px;line-height:1.85;color:rgba(255,255,255,.9);}
.scta-box .sbtn{flex:none;}

/* ---------- 页脚 ---------- */
.sfoot{background:var(--ink);color:rgba(255,255,255,.78);border-top:6px solid var(--teal);padding:36px 0 26px;}
.sfoot-brand{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700;color:var(--white);margin-bottom:16px;}
.sfoot-brand img{width:34px;height:34px;object-fit:contain;}
.sfoot-nav{display:flex;flex-wrap:wrap;gap:18px;margin-bottom:16px;}
.sfoot-nav a{font-size:12px;color:rgba(255,255,255,.7);}
.sfoot-nav a:hover{color:var(--pink);}
.sfoot-icp{font-size:12px;color:rgba(255,255,255,.6);margin-bottom:6px;}
.sfoot-c{font-size:12px;color:rgba(255,255,255,.45);}

/* ---------- 返回顶部 ---------- */
.backtop{position:fixed;right:24px;bottom:20px;width:46px;height:46px;background:var(--pink);border:2px solid var(--ink);color:var(--white);font-size:20px;font-weight:900;cursor:pointer;opacity:0;visibility:hidden;transition:opacity .25s ease;z-index:70;}
.backtop.show{opacity:1;visibility:visible;}
.backtop:hover{background:var(--teal);color:var(--ink);}

/* ---------- 移动端 ---------- */
@media (max-width:960px){
  .snav{position:absolute;top:70px;left:0;right:0;background:var(--night);border-bottom:3px solid var(--pink);display:none;flex-direction:column;gap:0;padding:8px 0;}
  .snav.open{display:flex;}
  .snav a{padding:13px 24px;border-bottom:none;border-left:4px solid transparent;}
  .snav a.on,.snav a:hover{border-left-color:var(--pink);background:var(--panel);}
  .burger{display:flex;}
  .sbar-cta{display:none;}
}
@media (max-width:900px){
  [id]{scroll-margin-top:72px;}
  .sle{padding:36px 0 44px;}
  .sle-in{grid-template-columns:1fr;padding:30px 22px;gap:34px;box-shadow:8px 9px 0 var(--teal);}
  .sle h1{font-size:40px;}
  .sstage{padding:46px 16px 38px;min-height:0;}
  .sscreen{width:min(320px,88%);}
  .splaques-in{grid-template-columns:repeat(2,1fr);}
  .splq{transform:none !important;}
  .ssech h2{font-size:23px;}
  .sbill-in{padding:6px 16px;}
  .srow{grid-template-columns:60px 1fr;gap:12px;}
  .srow-tag{display:none;}
  .sgtop{display:flex;flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;align-items:stretch;}
  .sgtop .sf{scroll-snap-align:start;flex:0 0 auto;}
  .sgal-low{grid-template-columns:1fr;}
  .sbook{padding:18px;border-left-width:8px;}
  .sgrid{grid-template-columns:1fr;padding:18px;}
  .scta-box{flex-direction:column;align-items:flex-start;padding:30px 24px;}
  .backtop{bottom:142px;right:16px;}
}
@media (max-width:640px){
  .sle h1{font-size:34px;}
  .sle .lead{font-size:14px;}
  .sbtn-lg{padding:13px 26px;font-size:15px;}
  .splq b{font-size:24px;}
  .sf img{max-width:200px;}
  .sf.mid img{max-width:230px;}
}
