/*
   Template: zxjszx — 信号卷 / Signal Reel
   Style: Modern dark cinema, editorial zigzag (not a card directory)
   Colors: Walnut night #14110E + Persimmon CTA #FF7A45 + Ivory text #F6F1EA
   Distinct from: aibat (ivory/petrol/brass directory), awevm (sage ticket),
                  solis (paper pillars), shadowops (green tactical), track (cyber blue),
                  wzffmc (emerald/gold), lucid (sky/orange light), ember (rose cream)
   CSS Prefix: zxj
   WCAG AA: #F6F1EA on #14110E ≈ 15:1 | #D4C6B4 on #14110E ≈ 10:1
             #1A120C on #FF7A45 ≈ 6.8:1 | #FF7A45 on #14110E ≈ 7.2:1
*/
:root{
  --zxj-bg:#14110E;--zxj-bg-alt:#1E1914;--zxj-card:#262019;
  --zxj-text:#F6F1EA;--zxj-sec:#D4C6B4;--zxj-muted:#B5A594;
  --zxj-cta:#FF7A45;--zxj-cta-hover:#FF8F62;--zxj-ink:#1A120C;
  --zxj-link:#FFC2A3;
  --zxj-border:rgba(255,194,163,.16);
  --zxj-radius:18px;--zxj-radius-sm:12px;
  --zxj-z-nav:40;
  --zxj-ease:cubic-bezier(.16,1,.3,1);
  --zxj-font:"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --zxj-serif:Georgia,"Songti SC","Noto Serif SC","PingFang SC",serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
body{font-family:var(--zxj-font);background:var(--zxj-bg);color:var(--zxj-text);line-height:1.7;overflow-x:hidden}
a{color:var(--zxj-link);text-decoration:none;transition:color .2s var(--zxj-ease),background .2s var(--zxj-ease),border-color .2s var(--zxj-ease),opacity .2s var(--zxj-ease);cursor:pointer}
a:hover{color:#FFE0D0}
a:focus-visible,button:focus-visible{outline:2px solid var(--zxj-cta);outline-offset:3px}
img{max-width:100%;height:auto;display:block}
ul,ol{list-style:none}
button{font-family:inherit;cursor:pointer}
.zxj-container{max-width:1120px;margin:0 auto;padding:0 24px}
.zxj-em{color:var(--zxj-cta)}

/* NAV */
.zxj-nav{position:fixed;top:0;left:0;right:0;z-index:var(--zxj-z-nav);background:#14110E;border-bottom:1px solid transparent}
.zxj-nav.scrolled{border-bottom-color:var(--zxj-border)}
.zxj-nav-inner{display:flex;align-items:center;gap:20px;min-height:72px}
.zxj-logo{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--zxj-text);letter-spacing:-.02em;flex-shrink:0}
.zxj-logo:hover{color:var(--zxj-text)}
.zxj-logo-mark{width:36px;height:36px;border-radius:10px;background:var(--zxj-cta);color:var(--zxj-ink);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.zxj-logo-mark svg{width:20px;height:20px}
.zxj-nav-links{display:flex;align-items:center;gap:4px;margin-left:auto}
.zxj-nav-links a{font-size:.86rem;font-weight:600;color:var(--zxj-sec);padding:8px 14px;min-height:44px;display:inline-flex;align-items:center}
.zxj-nav-links a:hover{color:var(--zxj-text)}
.zxj-nav-links a[aria-current="page"]{color:var(--zxj-text);box-shadow:inset 0 -2px 0 var(--zxj-cta)}
.zxj-nav-cta{display:inline-flex;align-items:center;gap:6px;padding:10px 18px;background:var(--zxj-cta);color:var(--zxj-ink);font-size:.82rem;font-weight:800;border-radius:999px;min-height:44px;flex-shrink:0}
.zxj-nav-cta:hover{background:var(--zxj-cta-hover);color:var(--zxj-ink)}
.zxj-nav-cta:active{opacity:.88}
.zxj-mobile-btn{display:none;background:transparent;border:1px solid var(--zxj-border);border-radius:10px;padding:8px;color:var(--zxj-text);min-width:44px;min-height:44px}

/* HERO */
.zxj-hero{padding:120px 0 0}
.zxj-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
.zxj-kicker{display:inline-flex;align-items:center;gap:8px;font-size:.72rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--zxj-cta);margin-bottom:16px}
.zxj-hero h1{font-family:var(--zxj-serif);font-size:3.2rem;font-weight:700;line-height:1.12;letter-spacing:-.03em;margin-bottom:16px}
.zxj-hero-lead{font-size:1.05rem;color:var(--zxj-sec);max-width:540px;margin-bottom:28px}
.zxj-hero-actions{display:flex;flex-wrap:wrap;gap:12px}
.zxj-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 26px;background:var(--zxj-cta);color:var(--zxj-ink);font-weight:800;border-radius:999px;min-height:48px;border:none}
.zxj-btn:hover{background:var(--zxj-cta-hover);color:var(--zxj-ink)}
.zxj-btn:active,.zxj-nav-cta:active{opacity:.88}
.zxj-btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 22px;background:transparent;color:var(--zxj-text);font-weight:700;border-radius:999px;border:1px solid var(--zxj-border);min-height:48px}
.zxj-btn-ghost:hover{border-color:var(--zxj-cta);color:var(--zxj-text)}
.zxj-still{position:relative;border-radius:var(--zxj-radius);overflow:hidden;border:1px solid var(--zxj-border)}
.zxj-still img{width:100%;height:320px;object-fit:cover}
.zxj-still figcaption{position:absolute;left:16px;bottom:16px;padding:6px 12px;background:rgba(20,17,14,.78);border-radius:999px;font-size:.75rem;font-weight:700;color:var(--zxj-text)}
.zxj-rail-wrap{margin-top:48px;border-top:1px solid var(--zxj-border)}
.zxj-rail{display:flex;gap:8px;overflow-x:auto;padding:16px 0 20px;-webkit-overflow-scrolling:touch}
.zxj-rail a{flex:0 0 auto;min-height:44px;padding:10px 14px;border:1px solid var(--zxj-border);border-radius:999px;color:var(--zxj-sec);font-size:.8rem;font-weight:700;background:var(--zxj-bg-alt)}
.zxj-rail a:hover{color:var(--zxj-ink);background:var(--zxj-cta);border-color:var(--zxj-cta)}
.zxj-rail b{color:var(--zxj-cta);margin-right:6px;font-variant-numeric:tabular-nums}
.zxj-rail a:hover b{color:var(--zxj-ink)}

/* SECTIONS */
.zxj-section{padding:80px 0;scroll-margin-top:88px}
.zxj-section-alt{background:var(--zxj-bg-alt)}
.zxj-sec-head{max-width:640px;margin-bottom:36px}
.zxj-sec-head h2,.zxj-page-hero h1,.zxj-cue-copy h3,.zxj-row-copy h3,.zxj-shot h3,.zxj-slip h2,.zxj-card h3{font-family:var(--zxj-serif);font-weight:700;letter-spacing:-.02em;line-height:1.25}
.zxj-sec-head h2{font-size:2.2rem;margin-bottom:8px}
.zxj-sec-head p,.zxj-page-hero p{color:var(--zxj-sec)}

/* FILM REEL */
.zxj-row{display:grid;grid-template-columns:72px minmax(220px,280px) 1fr;gap:28px;align-items:center;padding:32px 0;border-top:1px solid var(--zxj-border);scroll-margin-top:88px}
.zxj-row.is-flip{grid-template-columns:72px 1fr minmax(220px,280px)}
.zxj-row.is-flip .zxj-frame{order:3}
.zxj-row.is-flip .zxj-row-copy{order:2}
.zxj-idx{font-family:var(--zxj-serif);font-size:2rem;color:var(--zxj-cta);font-variant-numeric:tabular-nums}
.zxj-frame{display:block;border-radius:var(--zxj-radius-sm);overflow:hidden;border:1px solid var(--zxj-border);aspect-ratio:16/9}
.zxj-frame img{width:100%;height:100%;object-fit:cover}
.zxj-row-copy h3{font-size:1.45rem;margin-bottom:8px}
.zxj-row-copy p{color:var(--zxj-sec);margin-bottom:14px}
.zxj-text-link{font-weight:800;color:var(--zxj-cta)}
.zxj-text-link:hover{color:var(--zxj-cta-hover)}

/* METERS */
.zxj-meters{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.zxj-meter{padding:24px;background:var(--zxj-card);border:1px solid var(--zxj-border);border-radius:var(--zxj-radius)}
.zxj-meter-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:12px;font-weight:800}
.zxj-meter-top span:last-child{color:var(--zxj-cta);font-family:var(--zxj-serif);font-size:1.4rem}
.zxj-meter-track{height:8px;border-radius:999px;background:rgba(255,194,163,.12);overflow:hidden;margin-bottom:12px}
.zxj-meter-track i{display:block;height:100%;background:var(--zxj-cta);border-radius:999px}
.zxj-meter p{color:var(--zxj-sec);font-size:.88rem}

/* DUO SHOTS */
.zxj-duo{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.zxj-shot{position:relative;min-height:360px;border-radius:var(--zxj-radius);overflow:hidden;display:flex;align-items:flex-end;color:var(--zxj-text);border:1px solid var(--zxj-border)}
.zxj-shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.zxj-shot::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(20,17,14,.94) 0%,rgba(20,17,14,.28) 58%)}
.zxj-shot div{position:relative;z-index:1;padding:28px}
.zxj-shot:hover{color:var(--zxj-text)}
.zxj-shot span{display:block;font-size:.72rem;font-weight:800;letter-spacing:.16em;color:var(--zxj-cta);margin-bottom:8px}
.zxj-shot h3{font-size:1.7rem;margin-bottom:8px}
.zxj-shot p{color:var(--zxj-sec);max-width:360px}

/* APP SLIP */
.zxj-slip{display:grid;grid-template-columns:1.1fr .9fr;gap:32px;align-items:center;padding:28px;background:var(--zxj-card);border-radius:var(--zxj-radius);border-left:6px solid var(--zxj-cta)}
.zxj-slip h2{font-size:2rem;margin-bottom:12px}
.zxj-slip p{color:var(--zxj-sec);margin-bottom:16px}
.zxj-checks{margin-bottom:20px}
.zxj-checks li{display:flex;gap:10px;align-items:flex-start;padding:8px 0;color:var(--zxj-text);font-weight:600}
.zxj-checks svg{flex-shrink:0;margin-top:3px;color:var(--zxj-cta)}
.zxj-slip-photo{border-radius:var(--zxj-radius-sm);overflow:hidden;border:1px solid var(--zxj-border)}
.zxj-slip-photo img{width:100%;height:280px;object-fit:cover}

/* FAQ CARDS — open, not accordion */
.zxj-faq{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.zxj-card{padding:24px;background:var(--zxj-bg);border:1px solid var(--zxj-border);border-radius:var(--zxj-radius-sm)}
.zxj-section-alt .zxj-card{background:var(--zxj-card)}
.zxj-card h3{font-size:1.2rem;margin-bottom:8px}
.zxj-card p{color:var(--zxj-sec);font-size:.92rem}

/* LINKS + CTA */
.zxj-recommend-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.zxj-recommend-grid a{display:block;padding:14px 16px;background:var(--zxj-card);border:1px solid var(--zxj-border);border-radius:var(--zxj-radius-sm);font-size:.84rem;color:var(--zxj-sec);min-height:48px}
.zxj-recommend-grid a:hover{color:var(--zxj-text);border-color:var(--zxj-cta)}
.zxj-cta{padding:0 0 80px}
.zxj-cta-box{background:var(--zxj-cta);color:var(--zxj-ink);border-radius:var(--zxj-radius);padding:48px 40px;text-align:center}
.zxj-cta-box h2{font-family:var(--zxj-serif);font-size:2rem;margin-bottom:8px;color:var(--zxj-ink)}
.zxj-cta-box p{margin-bottom:20px;color:rgba(26,18,12,.82)}
.zxj-cta-box .zxj-btn{background:var(--zxj-ink);color:var(--zxj-text)}
.zxj-cta-box .zxj-btn:hover{background:#000;color:var(--zxj-text)}

/* FOOTER */
.zxj-footer{border-top:1px solid var(--zxj-border);padding:48px 0 28px}
.zxj-footer-top{display:grid;grid-template-columns:1.4fr .8fr .8fr;gap:32px;margin-bottom:32px}
.zxj-footer-desc{font-size:.85rem;color:var(--zxj-sec);max-width:380px;margin-top:10px}
.zxj-footer-nav h4{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--zxj-cta);margin-bottom:12px}
.zxj-footer-nav a{display:inline-flex;min-height:36px;align-items:center;font-size:.86rem;color:var(--zxj-sec)}
.zxj-footer-nav a:hover{color:var(--zxj-text)}
.zxj-footer-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:20px;border-top:1px solid var(--zxj-border);font-size:.8rem;color:var(--zxj-muted)}
.zxj-footer-bottom a{color:var(--zxj-sec)}

/* INNER PAGES */
.zxj-page-hero{padding:128px 0 40px}
.zxj-page-hero h1{font-size:2.8rem;margin-bottom:10px}
.zxj-cue{display:grid;grid-template-columns:56px 140px 1fr auto;gap:18px;align-items:center;padding:16px 0;border-top:1px solid var(--zxj-border);color:var(--zxj-text)}
.zxj-cue:hover{color:var(--zxj-text)}
.zxj-cue img{width:140px;height:78px;object-fit:cover;border-radius:8px}
.zxj-cue-n{font-family:var(--zxj-serif);color:var(--zxj-cta);font-size:1.2rem}
.zxj-cue-copy h3{font-size:1.1rem;margin-bottom:4px}
.zxj-cue-copy p{color:var(--zxj-sec);font-size:.86rem}
.zxj-cue-go{font-weight:800;color:var(--zxj-cta);white-space:nowrap}
.zxj-split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.zxj-split img{width:100%;height:300px;object-fit:cover;border-radius:var(--zxj-radius);border:1px solid var(--zxj-border)}
.zxj-split h2{font-family:var(--zxj-serif);font-size:2rem;margin-bottom:12px}
.zxj-split p{color:var(--zxj-sec);margin-bottom:12px}

/* CONTACT + 404 */
.zxj-stage{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:32px 16px}
.zxj-cuecard{width:min(440px,100%);background:var(--zxj-card);border:1px solid var(--zxj-border);border-radius:var(--zxj-radius);padding:36px 32px;text-align:center}
.zxj-cuecard h2{font-family:var(--zxj-serif);font-size:2rem;margin:12px 0 8px}
.zxj-cuecard > p{color:var(--zxj-sec);margin-bottom:20px}
.zxj-cue-list{text-align:left;margin-bottom:22px}
.zxj-cue-item{padding:12px 14px;background:var(--zxj-bg);border-radius:var(--zxj-radius-sm);margin-bottom:8px}
.zxj-cue-item b{display:block}
.zxj-cue-item span{color:var(--zxj-muted);font-size:.82rem}
.zxj-btn-block{width:100%}
.zxj-timer{margin-top:14px;font-size:.85rem;color:var(--zxj-muted)}
.zxj-timer strong{color:var(--zxj-cta)}
.zxj-404{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:32px 16px}
.zxj-404 h1{font-family:var(--zxj-serif);font-size:6rem;line-height:1;color:var(--zxj-cta)}
.zxj-404 h2{font-family:var(--zxj-serif);font-size:1.6rem;margin:8px 0 12px}
.zxj-404 p{color:var(--zxj-sec);margin-bottom:24px}

.zxj-reveal{opacity:0;transform:translateY(12px);transition:opacity .28s var(--zxj-ease),transform .28s var(--zxj-ease)}
.zxj-reveal.visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .zxj-reveal{opacity:1;transform:none}
}

@media(max-width:960px){
  .zxj-hero-grid,.zxj-duo,.zxj-slip,.zxj-split,.zxj-faq,.zxj-meters,.zxj-footer-top{grid-template-columns:1fr}
  .zxj-row,.zxj-row.is-flip{grid-template-columns:1fr;gap:14px}
  .zxj-row.is-flip .zxj-frame,.zxj-row.is-flip .zxj-row-copy{order:0}
  .zxj-hero h1{font-size:2.4rem}
  .zxj-still img,.zxj-slip-photo img,.zxj-split img{height:220px}
  .zxj-shot{min-height:280px}
  .zxj-cue{grid-template-columns:48px 1fr;gap:10px 12px}
  .zxj-cue img{display:none}
  .zxj-cue-go{grid-column:2}
  .zxj-nav-links{display:none;position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:stretch;background:#1E1914;border-bottom:1px solid var(--zxj-border);padding:8px 16px 16px;margin-left:0}
  .zxj-nav-links.active{display:flex}
  .zxj-nav-links{margin-left:0}
  .zxj-nav-links a{min-height:48px}
  .zxj-nav-cta{margin-left:auto;padding:8px 12px;font-size:.75rem}
  .zxj-mobile-btn{display:inline-flex;align-items:center;justify-content:center}
  .zxj-cta-box{padding:32px 20px}
}
@media(max-width:640px){
  .zxj-container{padding:0 16px}
  .zxj-section{padding:56px 0}
  .zxj-sec-head h2,.zxj-page-hero h1{font-size:1.8rem}
}