/* /bottleneck: public teaser + member-gated slide deck (fragment from api/talk-asset.php).
   The deck matches the Agency session banner: navy, cream serif, gold rule, rings. */
.talk {
  --tk-navy: #0d1b48; --tk-ring: rgba(86, 120, 222, .5); --tk-cream: #fbf4e3; --tk-gold: #f2c14e;
  --tk-mute: #b4bdd9; --tk-line: rgba(251, 244, 227, .16);
  --tk-t0: #ff9474; --tk-t1: #f2c14e; --tk-t2: #97b7ff; --tk-t3: #82d9a8;
}
[hidden] { display: none !important; }

/* ---------- teaser + gate ---------- */
.talk .talk-gate { background: var(--bg-alt); border: 1px solid rgba(0, 0, 0, .1); border-radius: var(--r-card); padding: 22px; margin: 26px auto 0; max-width: 620px; text-align: left; }
.talk .talk-gate .k { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--accent); margin-bottom: 8px; }
.talk .talk-gate p { font-size: 15px; line-height: 1.55; color: var(--ink); }
.talk .talk-gate .cta-row { margin-top: 16px; justify-content: flex-start; }
.talk .talk-gate .meta { font-size: 13px; color: var(--ink-3); margin-top: 12px; }
.talk .talk-status { margin: 22px auto; max-width: 620px; font-size: 15px; color: var(--ink-2); display: flex; gap: 10px; align-items: center; justify-content: center; flex-wrap: wrap; }
.talk .talk-teaser { padding: 8px 0 40px; }
.talk .talk-teaser .wrap { max-width: 720px; margin: 0 auto; padding: 0 20px; }
.talk .talk-teaser h2 { font-size: 1.35rem; margin-bottom: 14px; }
.talk .talk-teaser ol { padding-left: 22px; display: grid; gap: 8px; font-size: 15px; line-height: 1.55; color: var(--ink-2); }
.talk .talk-teaser ol b { color: var(--ink); }
.talk.talk-in .hero-air { display: none; }

/* ---------- deck shell ---------- */
.talk .deck { max-width: 1440px; margin: 14px auto 28px; padding: 0 16px; }
.talk .deck-frame { display: flex; justify-content: center; }
.talk .deck-viewport { position: relative; overflow: hidden; background: var(--tk-navy); border-radius: 8px; box-shadow: 0 10px 40px rgba(13, 27, 72, .25); cursor: pointer; }
.talk .deck-stage { position: absolute; left: 0; top: 0; width: 1600px; height: 900px; transform-origin: 0 0; }
.talk .deck-bar { display: flex; align-items: center; gap: 10px; margin: 10px auto 0; font-size: 14px; color: var(--ink-2); flex-wrap: wrap; }
.talk .deck-btn { border: 1px solid rgba(0, 0, 0, .15); background: var(--bg, #fff); color: var(--ink); border-radius: 6px; padding: 6px 12px; font: inherit; cursor: pointer; }
.talk .deck-btn:hover { border-color: var(--ink-3); }
.talk .deck-present { background: var(--tk-navy); color: var(--tk-cream); border-color: var(--tk-navy); }
.talk .deck-count { min-width: 56px; text-align: center; font-variant-numeric: tabular-nums; }
.talk .deck-hint { color: var(--ink-3); font-size: 13px; }
.talk .deck-spacer { flex: 1; }
.talk .deck-link { color: var(--accent); font-weight: 600; }
.talk .deck-link[aria-busy="true"], .talk .res-dl[aria-busy="true"] { opacity: .6; }
.talk .deck.is-full { max-width: none; margin: 0; padding: 0; background: #000; display: flex; align-items: center; justify-content: center; }
.talk .deck.is-full .deck-viewport { border-radius: 0; box-shadow: none; }
.talk .deck.is-full .deck-bar { display: none; }

/* ---------- self-paced read under the slide (one .dr per slide, toggled by js/talk.js) ---------- */
.talk .deck-read { margin: 14px 0 0; }
.talk .deck.is-full .deck-read { display: none; }
.talk .dr { background: #fff; border: 1px solid rgba(0, 0, 0, .08); border-left: 4px solid var(--tk-gold); border-radius: var(--r-card, 12px); padding: 18px 24px 20px; color: var(--ink); }
.talk .dr-k { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); }
.talk .dr h3 { margin: 4px 0 10px; font-size: 1.25rem; }
.talk .dr p { margin: 0 0 10px; font-size: 16px; line-height: 1.6; color: var(--ink-2); max-width: 78ch; }
.talk .dr p:last-child { margin-bottom: 0; }
.talk .dr b { color: var(--ink); }
.talk .dr .dr-do { color: var(--ink); font-weight: 500; }
.talk .dr .dr-src { font-size: 13px; color: var(--ink-3); }
@media (max-width: 700px) { .talk .deck-hint { display: none; } }

/* ---------- slides (1600×900 stage px) ---------- */
.talk .slide { position: absolute; inset: 0; padding: 88px 120px 96px; background: var(--tk-navy); color: var(--tk-cream); font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif; font-variant-numeric: lining-nums; overflow: hidden; opacity: 0; visibility: hidden; transition: opacity .3s ease, visibility .3s; cursor: default; }
.talk .slide.is-active { opacity: 1; visibility: visible; }
.talk .slide::before { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .6;
  background: repeating-radial-gradient(circle at var(--rx, 8%) var(--ry, 20%), transparent 0 150px, var(--tk-ring) 151px 153px, transparent 154px 215px); }
.talk .slide > * { position: relative; }
.talk .slide h1, .talk .slide h2, .talk .slide .mega { font-family: 'Playfair Display', Georgia, serif; font-weight: 700; color: var(--tk-cream); letter-spacing: -.01em; }
.talk .slide .kicker { font-size: 22px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--tk-gold); margin-bottom: 22px; }
.talk .slide h2 { font-size: 68px; line-height: 1.1; margin: 0 0 40px; max-width: 1300px; }
.talk .slide h2.sm { font-size: 54px; margin-bottom: 30px; }
.talk .slide h2.xl { font-size: 80px; }
.talk .slide p { margin: 0; }
.talk .slide .gold { color: var(--tk-gold); }
.talk .slide .note { font-size: 27px; line-height: 1.45; color: var(--tk-mute); max-width: 1300px; margin-top: 30px; }
.talk .slide .lead { font-size: 32px; line-height: 1.45; color: var(--tk-mute); }
.talk .slide .quote { position: absolute; left: 120px; right: 120px; bottom: 120px; font-family: 'Playfair Display', Georgia, serif; font-style: italic; font-size: 44px; line-height: 1.25; color: var(--tk-gold); padding-left: 34px; border-left: 5px solid var(--tk-gold); }
.talk .slide .quote.sm { font-size: 36px; }
.talk .slide .s-foot { position: absolute; left: 120px; right: 120px; bottom: 38px; display: flex; justify-content: space-between; font-size: 17px; letter-spacing: .12em; text-transform: uppercase; color: rgba(180, 189, 217, .7); }

/* title */
.talk .s-title { display: flex; align-items: center; gap: 60px; }
.talk .s-title .t-left { flex: 1; min-width: 0; }
.talk .s-title h1 { font-size: 118px; line-height: 1.02; margin: 0 0 34px; }
.talk .s-title .t-sub { font-size: 35px; white-space: nowrap; color: var(--tk-cream); opacity: .92; display: flex; align-items: center; gap: 26px; margin-bottom: 64px; }
.talk .s-title .bar { display: inline-block; width: 90px; height: 6px; background: var(--tk-gold); flex: none; }
.talk .s-title .t-date { font-size: 44px; font-weight: 600; color: var(--tk-gold); margin-bottom: 10px; }
.talk .s-title .t-meta { font-size: 30px; color: var(--tk-mute); }
.talk .s-title .t-li { display: inline-flex; align-items: center; gap: 20px; margin-top: 44px; padding: 14px 30px 14px 14px; border: 2px solid var(--tk-gold); border-radius: 14px; color: var(--tk-cream); text-decoration: none; cursor: pointer; }
.talk .s-title .t-li:hover { background: rgba(255, 255, 255, .06); }
.talk .s-title .t-li-in { width: 64px; height: 64px; border-radius: 10px; background: #0a66c2; color: #fff; font: 700 40px/64px Arial, sans-serif; text-align: center; flex: none; }
.talk .s-title .t-li-txt b { display: block; font-size: 30px; font-weight: 600; }
.talk .s-title .t-li-txt span { display: block; font-size: 25px; color: var(--tk-gold); }
.talk .s-title .t-right { margin: 0; width: 400px; text-align: center; flex: none; }
.talk .s-title .t-right img { width: 360px; height: 360px; border-radius: 50%; object-fit: cover; border: 6px solid var(--tk-gold); display: block; margin: 0 auto 30px; }
.talk .s-title figcaption b { display: block; font-size: 46px; font-weight: 600; }
.talk .s-title figcaption span { font-size: 25px; color: var(--tk-mute); }

/* two columns */
.talk .split { display: grid; grid-template-columns: 1.15fr .85fr; gap: 90px; align-items: start; }
.talk .split h2 { margin: 0; }
.talk .stack { list-style: none; padding: 0; margin: 8px 0 0; }
.talk .stack li { font-size: 34px; line-height: 1.35; padding: 18px 0; border-top: 1px solid var(--tk-line); }
.talk .stack li.gold { font-weight: 600; }

/* compare */
.talk .vs { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.talk .pane { padding: 36px 40px; border: 2px solid var(--tk-line); border-radius: 6px; }
.talk .pane.win { border-color: var(--tk-gold); background: rgba(242, 193, 78, .07); }
.talk .pane h3 { font-size: 24px; letter-spacing: .12em; text-transform: uppercase; color: var(--tk-mute); margin: 0 0 16px; font-weight: 600; }
.talk .pane.win h3 { color: var(--tk-gold); }
.talk .pane p { font-size: 33px; line-height: 1.4; }

/* crew */
.talk .crew .row { display: grid; grid-template-columns: 400px 1fr; gap: 40px; padding: 22px 0; border-top: 1px solid var(--tk-line); font-size: 32px; line-height: 1.35; }
.talk .crew .row b { font-weight: 600; color: var(--tk-gold); }

/* ladder */
.talk .ladder { display: grid; gap: 14px; }
.talk .rung { display: grid; grid-template-columns: 340px 1fr; gap: 30px; align-items: center; padding: 15px 30px; background: rgba(255, 255, 255, .045); border-left: 8px solid; }
.talk .rung .tag { font-size: 32px; font-weight: 600; }
.talk .rung .tag span { display: block; font-size: 21px; font-weight: 400; color: var(--tk-mute); letter-spacing: .04em; }
.talk .rung p { font-size: 28px; line-height: 1.35; }
.talk .rung.t3 { border-color: var(--tk-t3); } .talk .rung.t3 .tag { color: var(--tk-t3); }
.talk .rung.t2 { border-color: var(--tk-t2); } .talk .rung.t2 .tag { color: var(--tk-t2); }
.talk .rung.t1 { border-color: var(--tk-t1); } .talk .rung.t1 .tag { color: var(--tk-t1); }
.talk .rung.t0 { border-color: var(--tk-t0); } .talk .rung.t0 .tag { color: var(--tk-t0); }
.talk .slide .ladder + .note { margin-top: 24px; font-size: 25px; }

/* statement slides */
.talk .s-center { display: flex; flex-direction: column; justify-content: center; padding-left: 160px; padding-right: 160px; }
.talk .slide .mega { font-size: 84px; line-height: 1.12; margin: 0 0 50px; max-width: 1280px; }
.talk .slide .mega.xl { font-size: 110px; }
.talk .slide .mega em { color: var(--tk-gold); }
.talk .story { max-width: 1180px; border-top: 1px solid var(--tk-line); padding-top: 30px; }
.talk .story p { font-size: 30px; line-height: 1.45; color: var(--tk-mute); }
.talk .story p + p { margin-top: 16px; }
.talk .story p.gold { color: var(--tk-gold); font-weight: 500; }

/* map tables */
.talk .map .mrow { display: grid; grid-template-columns: 440px 300px 1fr; gap: 30px; align-items: center; padding: 13px 0; border-top: 1px solid var(--tk-line); }
.talk .map .task { font-size: 27px; line-height: 1.3; font-weight: 500; }
.talk .map .why { font-size: 23px; line-height: 1.38; color: var(--tk-mute); }
.talk .map .tiers { display: flex; flex-wrap: wrap; gap: 8px; }
.talk .pill { font-style: normal; font-size: 20px; font-weight: 600; letter-spacing: .04em; padding: 5px 14px; border-radius: 999px; border: 2px solid; white-space: nowrap; }
.talk .pill.t3 { color: var(--tk-t3); } .talk .pill.t2 { color: var(--tk-t2); } .talk .pill.t1 { color: var(--tk-t1); } .talk .pill.t0 { color: var(--tk-t0); }

/* agency rules */
.talk .rules { display: grid; gap: 22px; max-width: 1280px; }
.talk .rules p { display: grid; grid-template-columns: 200px 1fr; gap: 30px; font-size: 31px; line-height: 1.4; }
.talk .rules b { font-family: 'Playfair Display', Georgia, serif; color: var(--tk-gold); font-size: 40px; line-height: 1.1; }

/* live divider */
.talk .s-divider { display: flex; flex-direction: column; justify-content: center; }
.talk .live { list-style: none; padding: 0; margin: 0; display: grid; gap: 26px; max-width: 1240px; }
.talk .live li { display: grid; grid-template-columns: 110px 1fr; font-size: 34px; line-height: 1.38; }
.talk .live b { font-family: 'Playfair Display', Georgia, serif; color: var(--tk-gold); font-size: 44px; line-height: 1; }

/* failure modes */
.talk .breaks { display: grid; gap: 22px; }
.talk .brk { display: grid; grid-template-columns: 420px 1fr; column-gap: 44px; row-gap: 8px; padding-top: 20px; border-top: 1px solid var(--tk-line); }
.talk .brk b { grid-row: span 2; font-size: 33px; line-height: 1.2; font-weight: 600; }
.talk .brk b em { display: block; font-style: normal; font-family: 'Playfair Display', Georgia, serif; color: var(--tk-gold); font-size: 26px; margin-bottom: 6px; }
.talk .brk p { font-size: 24px; line-height: 1.4; color: var(--tk-mute); }
.talk .brk p.guard { color: var(--tk-cream); }
.talk .brk p.guard span { font-size: 17px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--tk-gold); margin-right: 14px; }

/* week one */
.talk .days { list-style: none; padding: 0; margin: 40px 0 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 26px; border-top: 3px solid var(--tk-gold); }
.talk .days li { position: relative; padding-top: 38px; }
.talk .days li::before { content: ''; position: absolute; top: -13px; left: 0; width: 22px; height: 22px; border-radius: 50%; background: var(--tk-gold); }
.talk .days b { display: block; font-family: 'Playfair Display', Georgia, serif; font-size: 38px; }
.talk .days i { display: block; font-style: normal; font-size: 21px; letter-spacing: .08em; text-transform: uppercase; color: var(--tk-gold); margin: 4px 0 16px; }
.talk .days span { font-size: 26px; line-height: 1.42; color: var(--tk-mute); }

/* last slide */
.talk .s-end .split { margin-top: 10px; gap: 80px; }
.talk .s-end h2 { font-size: 80px; margin-bottom: 34px; }
.talk .res { display: grid; gap: 16px; }
.talk .res a { display: block; padding: 18px 24px; border: 2px solid var(--tk-line); border-radius: 6px; color: var(--tk-cream); text-decoration: none; font-size: 24px; cursor: pointer; }
.talk .res a:hover { border-color: var(--tk-gold); }
.talk .res a i { display: block; font-style: normal; font-size: 17px; letter-spacing: .14em; text-transform: uppercase; color: var(--tk-mute); margin-bottom: 4px; }
.talk .res a.res-dl { border-color: var(--tk-gold); background: rgba(242, 193, 78, .08); }
.talk .res a.res-dl b { display: block; font-family: 'Playfair Display', Georgia, serif; font-size: 36px; color: var(--tk-gold); margin-bottom: 6px; }
.talk .res a.res-dl span { font-size: 22px; line-height: 1.35; color: var(--tk-mute); }

/* live · campaigns, exchange, architecture */
.talk .camps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.talk .camp { border-top: 3px solid var(--tk-gold); padding-top: 16px; display: flex; flex-direction: column; gap: 10px; }
.talk .camps + .note { font-size: 21px; margin-top: 18px; }
.talk .camp .c-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.talk .camp .c-head b { font-size: 31px; font-weight: 600; margin-right: auto; width: 100%; }
.talk .camp .c-head .pill { font-size: 16px; padding: 3px 10px; }
.talk .camp .c-ask { font-size: 22px; line-height: 1.35; font-style: italic; color: var(--tk-mute); }
.talk .camp ul { margin: 0; padding-left: 22px; display: grid; gap: 8px; }
.talk .camp li { font-size: 22px; line-height: 1.36; }
.talk .camp li.gold { color: var(--tk-gold); }
.talk .camp .c-num { margin-top: auto; font-size: 20px; color: var(--tk-mute); border-top: 1px solid var(--tk-line); padding-top: 12px; }
.talk .camp .c-num b { color: var(--tk-cream); font-size: 26px; }
.talk .shot { display: grid; grid-template-columns: 640px 1fr; gap: 48px; align-items: start; margin-top: 6px; }
.talk .s-img { margin: 0; }
.talk .s-img img { width: 100%; height: auto; display: block; border-radius: 14px; border: 4px solid rgba(251, 244, 227, .2); background: #fff; }
.talk .s-img figcaption { font-size: 20px; letter-spacing: .12em; text-transform: uppercase; color: var(--tk-mute); margin-top: 12px; }
.talk .chat { display: grid; gap: 14px; }
.talk .chat p { font-size: 22px; line-height: 1.4; padding: 14px 20px; border-radius: 14px; }
.talk .chat span { display: block; font-size: 15px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 4px; }
.talk .chat .me { background: rgba(251, 244, 227, .1); margin-right: 90px; }
.talk .chat .me span { color: var(--tk-mute); }
.talk .chat .bot { background: rgba(242, 193, 78, .12); border-left: 4px solid var(--tk-gold); margin-left: 40px; }
.talk .chat .bot span { color: var(--tk-gold); }
.talk .arch { display: grid; grid-template-columns: 1fr 40px 1.2fr 40px 1.25fr 40px 1fr; align-items: stretch; margin-top: 8px; }
.talk .a-arrow { display: flex; align-items: center; justify-content: center; font-size: 36px; color: var(--tk-gold); }
.talk .a-box { border: 2px solid var(--tk-line); border-radius: 16px; padding: 22px 20px; display: flex; flex-direction: column; gap: 8px; background: rgba(13, 27, 72, .6); }
.talk .a-box b { font-size: 31px; font-weight: 600; }
.talk .a-box span { font-size: 22px; line-height: 1.34; color: var(--tk-mute); }
.talk .a-box span.gold { color: var(--tk-gold); }
.talk .a-gate { border-color: var(--tk-gold); }
.talk .a-guards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin-top: 44px; }
.talk .a-guards p { font-size: 24px; line-height: 1.38; color: var(--tk-mute); border-top: 1px solid var(--tk-line); padding-top: 14px; }
.talk .a-guards b { display: block; color: var(--tk-cream); font-size: 28px; font-weight: 600; margin-bottom: 4px; }
.talk .slide h2.s-take { font-style: italic; font-size: 38px; line-height: 1.25; color: var(--tk-gold); margin: 44px 0 0; padding-left: 28px; border-left: 5px solid var(--tk-gold); }

/* ---------- the TA docked beside the deck (js/posttrain-ta.js, same panel as /course/cohort) ----------
   Wide screens: the panel sits open in a right column and the deck gives up that width.
   Narrower: the panel's own launcher and drawer, unchanged. */
@media (min-width: 1200px) {
  .talk.talk-in #talk-host { padding-right: 396px; }
  .talk .pt-ta-panel { opacity: 1; transform: none; pointer-events: auto; right: 20px; bottom: auto; top: 76px; width: 360px; height: calc(100vh - 96px); }
  .talk .pt-ta-launch, .talk .pt-ta-x { display: none; }
  .talk:not(.talk-in) .pt-ta-panel { display: none; }
}

/* ---------- one column width: the bar, the read and the exercise line up with the slide (--deck-w set by js/talk.js fit()) ---------- */
.talk .deck:not(.is-full) .deck-bar, .talk .deck:not(.is-full) .deck-read { max-width: var(--deck-w, none); margin-left: auto; margin-right: auto; }
.talk #talk-host > .tp { box-sizing: border-box; max-width: var(--deck-w, 980px); margin-left: auto; margin-right: auto; }

/* ---------- 中文 deck (deck.zh.html): CJK fallbacks behind the Latin faces ---------- */
.talk .deck.is-zh .slide { font-family: 'Jost', 'PingFang SC', 'Hiragino Sans GB', 'Noto Sans SC', 'Microsoft YaHei', sans-serif; }
.talk .deck.is-zh .slide h1, .talk .deck.is-zh .slide h2, .talk .deck.is-zh .slide .mega { font-family: 'Playfair Display', 'Songti SC', 'Noto Serif SC', 'SimSun', serif; letter-spacing: .02em; }
.talk .deck.is-zh .kicker { letter-spacing: .12em; }