/* Shared inner-page classes (th-), copied from pages/talking-head/page.css so this page stands alone. */
.cr{position:relative;display:block;overflow:hidden;width:100%}
.shot.cr>img{position:absolute;max-width:none;height:auto}
.tn{position:absolute;display:block;object-fit:cover;object-position:50% 0;max-width:none;pointer-events:none}
.th-crumb{padding-left:16px}
.th-hl{color:var(--coral)}
.th-os{position:relative;margin:18px 0 0;font-size:13.5px;color:var(--tx3);display:flex;align-items:center;gap:.35em;flex-wrap:wrap}
.th-os .os{width:15px;height:15px}
.th-pwin{width:min(1080px,100% - 40px)}
.th-tag{position:absolute;z-index:3;top:10px;right:10px;font:500 10.5px/1.4 var(--mono);padding:2px 7px;border-radius:6px;background:rgba(12,12,14,.78);border:1px solid rgba(255,255,255,.16);color:#D2D2D9}
.th-stop{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.th-stop article{border-radius:var(--r-lg);background:linear-gradient(180deg,var(--s2),var(--s1));border:1px solid var(--line);padding:22px 20px 22px;display:flex;flex-direction:column}
.th-ic{width:38px;height:38px;border-radius:11px;border:1px solid var(--line-2);background:var(--s3);display:grid;place-items:center;color:var(--coral);margin-bottom:18px}
.th-ic .i{width:18px;height:18px}
.th-stop h3{margin:0 0 8px;font-size:19px;font-weight:600;letter-spacing:-.012em;line-height:1.2}
.th-stop p{margin:0 0 16px;font-size:14.5px;color:var(--tx2);line-height:1.55}
.th-stop s{margin-top:auto;font:400 12.5px/1.45 var(--mono);color:var(--tx3);text-decoration-color:rgba(242,84,91,.8);text-decoration-thickness:1.5px}
.th-rows{padding-top:40px}
.th-row+.th-row{margin-top:120px}
.th-row{grid-template-columns:.85fr 1.15fr}
.th-row.rev{grid-template-columns:1.15fr .85fr}
.th-step{margin:0 0 14px;font-size:13px;color:var(--coral)}
.th-mini{box-shadow:0 30px 80px -30px rgba(0,0,0,.85),0 0 80px -40px rgba(242,80,68,.4)}
.th-mini .win-bar{min-height:42px}
.th-more{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin-top:6px;color:#F77F84;font-weight:500;text-decoration:underline;text-underline-offset:3px}
.th-more .i{width:15px;height:15px}
.th-rel{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.th-rel a{display:flex;flex-direction:column;height:100%;border-radius:var(--r-lg);border:1px solid var(--line);background:linear-gradient(180deg,var(--s2),var(--s1));padding:12px 12px 18px;transition:border-color .2s}
.th-rel a:hover{border-color:var(--line-c)}
.th-rel a:focus-visible{outline:2px solid var(--coral);outline-offset:3px}
.th-rel-m{position:relative;display:block;aspect-ratio:4/3;border-radius:12px;overflow:hidden;background:#0C0C0E;margin-bottom:14px;border:1px solid var(--line)}
.th-rel-m img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,0 0)}
.th-rel b{font:600 18px/1.2 var(--display);padding:0 6px}
.th-rel small{margin-top:6px;font-size:14px;color:var(--tx2);padding:0 6px}
.th-fin{padding:110px 0 120px;width:min(1200px,100% - 40px);margin:0 auto}
@media (max-width:1100px){.th-stop,.th-rel{grid-template-columns:repeat(2,1fr)}}
@media (max-width:900px){
  .th-row,.th-row.rev{grid-template-columns:1fr;gap:30px}
  .th-row.rev>:first-child{order:0}
  .th-row+.th-row{margin-top:80px}
}
@media (max-width:640px){
  .th-pwin,.th-fin{width:calc(100% - 32px)}
  .th-stop{grid-template-columns:1fr}
  .th-rel{grid-template-columns:1fr 1fr;gap:10px}
  .th-rel a{padding:8px 8px 14px}
  .th-rel b{font-size:16px;padding:0 4px}
  .th-rel small{font-size:13px;padding:0 4px}
  .th-fin{padding:80px 0 90px}
  .stats{grid-template-columns:1fr 1fr}
}

/* ---------- Your own AI page (ya-) ---------- */
/* AI app chat, same drawing as the homepage "Work where you like" card */
.wk-app{--u:.62px;display:flex;flex-direction:column;background:#FBFAF7;color:#1B1B20;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
.fa-bar{display:flex;align-items:center;gap:6px;padding:9px 12px;background:#EFEDE7;border-bottom:1px solid rgba(20,20,22,.08);font-size:13px;font-weight:600;color:#3A3A42}
.fa-bar i{width:8px;height:8px;border-radius:50%;background:#C9C6BE}
.fa-bar span{margin-left:6px}
.wk-app .tw-body{position:relative;flex:1;display:flex;flex-direction:column;gap:12px;padding:16px 14px 10px}
.wk-app .fa-u{align-self:flex-end;max-width:88%;margin:0;font-size:14.5px;line-height:1.35;padding:8px 12px;border-radius:14px 14px 4px 14px;background:#E7E4DC}
.wk-app .fa-r{display:flex;gap:9px;align-items:flex-start;margin:0;font-size:14.5px;line-height:1.38}
.wk-app .lg{flex:none;width:26px;height:26px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px rgba(20,20,22,.08)}
.wk-app .lg img{width:16px;height:16px}
.wk-app .fa-in{display:flex;align-items:center;min-height:36px;margin:0 14px 12px;padding:0 12px;font-size:14px;border:1px solid rgba(20,20,22,.16);border-radius:10px;background:#fff}
.fa-ph{color:#6A6A74}
.wk-rest{visibility:hidden}
.wk-hi{position:absolute;left:14px;right:14px;top:50%;margin:0;transform:translateY(-50%);text-align:center;font-size:17px;font-weight:500;color:#55555F;opacity:0;pointer-events:none;transition:opacity .2s var(--ease)}

/* hero window */
.ya-win{max-width:1080px;margin:0 auto}
.ya-hero{display:grid;grid-template-columns:340px minmax(0,1fr);background:#0A0A0C}
.ya-chat{border-right:1px solid var(--line);min-height:100%}
.ya-chat .fa-u,.ya-chat .fa-r{transition:opacity .3s var(--ease),transform .3s var(--ease)}
.ya-sc{display:flex;flex-direction:column;padding:18px 20px 16px;min-width:0;background:radial-gradient(70% 60% at 50% 55%,rgba(242,84,91,.06),transparent 70%),#0C0C0E}
.ya-sc-top{display:flex;align-items:center;gap:12px;margin-bottom:16px;font-size:13px;color:var(--tx2);flex-wrap:wrap}
.ya-sc-top b{font:600 17px var(--sans);color:var(--tx)}
.ya-who{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:9px;background:var(--s3);border:1px solid var(--line);color:var(--tx);transition:opacity .3s var(--ease)}
.ya-who img{width:14px;height:14px;background:#F7F6F3;border-radius:4px;padding:1px}
.ya-ok{margin-left:auto;transition:opacity .3s var(--ease)}
.ya-out{position:relative;aspect-ratio:1086/524;border-radius:10px;overflow:hidden}
.ya-out>img{display:block;width:100%;height:auto}
.ya-cov{top:0;height:100%;background:#0D0C0F;border:1.5px dashed rgba(237,237,240,.14);border-radius:14px;opacity:0;transition:opacity .35s var(--ease)}
.ya-sc-foot{margin:14px 0 0;font:500 11.5px/1.3 var(--mono);color:var(--tx3)}
/* hero states: data-s 0..3 while it plays; no data-s = final frame */
.ya-chat .ya-r1{display:none}
[data-s="2"] .ya-chat .ya-r1{display:flex}
[data-s] .ya-chat .ya-r2{display:none}
[data-s="3"] .ya-chat .ya-r2{display:flex}
[data-s="0"] .wk-hi{opacity:1}
[data-s="0"] .ya-chat .fa-u{opacity:0}
[data-s="0"] .ya-cov,[data-s="1"] .ya-cov,[data-s="2"] .ya-cov{opacity:1}
.ya-hero .ya-cov.off{opacity:0}
[data-s="0"] .ya-ok,[data-s="1"] .ya-ok,[data-s="2"] .ya-ok,[data-s="0"] .ya-who,[data-s="1"] .ya-who{opacity:0}

/* timeline row */
.ya-tl{position:relative;display:block;overflow:hidden}
.ya-tl>img:first-child{display:block;width:100%;height:auto}
.ya-mask{position:absolute;left:12.25%;top:56.8%;width:46%;height:5.2%;background:#1B2036}
.shot>img.ya-note{position:absolute;left:37.62%;top:6.92%;width:13.82%;height:auto;max-width:none;border-radius:3px}

/* developers row */
.ya-dev-b{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:20px;background:#0C0C0E}
.ya-dev-c{display:flex;flex-direction:column;align-items:flex-start;padding:18px;border-radius:14px;background:var(--s2);border:1px solid var(--line)}
.ya-dev-k{font-size:13px;padding:3px 9px;border-radius:7px;background:rgba(242,84,91,.14);color:#F77F84;margin-bottom:14px}
.ya-dev-c b{font:600 18px/1.2 var(--display);margin-bottom:8px}
.ya-dev-c p{margin:0 0 16px;font-size:14px;line-height:1.5;color:var(--tx2)}
.ya-logos{display:flex;gap:6px;margin-top:auto}

/* two ways to pay, from the homepage */
.pay{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:980px;margin:0 auto}
.pay-c{display:flex;flex-direction:column;align-items:flex-start;padding:32px;border:1px solid var(--line-2);border-radius:var(--r-xl,28px);background:var(--s1)}
.pay-c.on{border-color:rgba(242,84,91,.55);box-shadow:0 0 70px -34px rgba(242,84,91,.7)}
.pay-tag{font:500 12px/1.3 var(--mono);color:var(--tx2);margin-bottom:18px}
.pay-c.on .pay-tag{color:#F77F84}
.pay-c h3{margin:0 0 12px;font:700 clamp(25px,2.4vw,32px)/1.1 var(--display);letter-spacing:-.018em;color:var(--head)}
.pay-lead{margin:0 0 12px;font-size:18px;line-height:1.45;color:var(--head)}
.pay-how{margin:0;font-size:15.5px;line-height:1.5;color:var(--tx2)}

/* connect toggle demo */
.ya-con{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:28px;align-items:center;max-width:1180px;margin:0 auto}
.ya-con-shot{container-type:inline-size}
.ya-fix{position:absolute;left:2.17%;top:27%;width:31.8%;height:4%;background:#151419;color:#A9A9B6;font:400 1.22cqw/1.6 var(--sans);white-space:nowrap;display:flex;align-items:center}
.ya-dim{top:11.4%;height:88.6%;background:rgba(5,5,6,.62);border-radius:14px;transition:opacity .3s var(--ease)}
.ya-dim.l{left:0;width:55.1%}
.ya-dim.r{left:55.8%;width:44.2%}
.ya-ring{top:12%;height:87.4%;transition:left .3s var(--ease),width .3s var(--ease)}
[data-way="rec"] .ya-dim.l,[data-way="adv"] .ya-dim.r{opacity:0}
[data-way="rec"] .ya-ring{left:.1%;width:54.5%}
[data-way="adv"] .ya-ring{left:55.9%;width:43.9%}
.ya-con-m{--zoom:1}
.ya-way{display:none}
[data-way="rec"] .ya-way[data-for="rec"],[data-way="adv"] .ya-way[data-for="adv"]{display:block;animation:yaIn .3s var(--ease) both}
.ya-way h3{margin:0 0 18px;font:700 26px/1.15 var(--display);letter-spacing:-.015em}
.ya-way ol{list-style:none;counter-reset:s;margin:0;padding:0;display:grid;gap:14px}
.ya-way li{counter-increment:s;position:relative;padding-left:44px}
.ya-way li::before{content:counter(s);position:absolute;left:0;top:0;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--s3);border:1px solid var(--line-2);font:500 13px var(--mono);color:var(--tx)}
.ya-way li b{display:block;font-size:16.5px;font-weight:600;margin:4px 0 3px}
.ya-way li span{display:block;font-size:14.5px;line-height:1.5;color:var(--tx2)}
.ya-found{max-width:980px;margin:56px auto 0;text-align:center}
.ya-found h3{margin:0 0 18px;font:600 19px/1.25 var(--display)}
.ya-found ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.ya-found li{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px 0 8px;border-radius:999px;border:1px solid var(--line-2);background:var(--s1);font-size:14.5px;color:var(--tx)}
.ya-found li.ya-add{border-style:dashed;color:var(--tx2)}
.ya-nolg{background:var(--s3)!important}
.ya-nolg .i{width:13px;height:13px;color:var(--tx2)}
.ya-found p{margin:16px 0 0;font-size:14.5px;color:var(--tx3)}
@keyframes yaIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

@media (max-width:900px){
  .ya-hero{grid-template-columns:1fr}
  .ya-chat{border-right:0;border-bottom:1px solid var(--line);min-height:230px}
  .pay{grid-template-columns:1fr}.pay-c{padding:24px}
  .ya-con{grid-template-columns:1fr}
}
@media (max-width:640px){
  .ya-sc{padding:14px 12px}
  .ya-sc-top{gap:8px}
  .ya-ok{margin-left:0}
  .ya-dev-b{grid-template-columns:1fr;padding:12px}
  .ya-con-m{--zoom:1.85}
  [data-way="rec"] .ya-con-m{--x:0%}
  [data-way="adv"] .ya-con-m{--x:46%}
  .ya-con-m>.shot{transition:transform .3s var(--ease)}
  .ya-way h3{font-size:22px}
}
@media (prefers-reduced-motion:reduce){
  .ya-chat .fa-u,.ya-chat .fa-r,.ya-cov,.ya-who,.ya-ok,.ya-dim,.ya-ring,.ya-con-m>.shot{transition:none}
  .ya-way{animation:none!important}
}

/* app switch in the hero */
.ya-apps{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;padding:12px 14px;background:#0A0A0C;border-bottom:1px solid var(--line)}
.ya-apps-l{font:500 12px var(--mono);color:var(--tx2)}
.ya-seg button{min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.ya-seg button .lg{flex:none}
.fa-bar .fa-lg{margin-left:6px}
.fa-bar .fa-lg+span{margin-left:0}
[class*="ap-"]{display:none}
[data-app="claude"] .ap-claude,[data-app="codex"] .ap-codex,[data-app="gemini"] .ap-gemini{display:inline}
.wk-app .lg img[class*="ap-"]{display:none}
[data-app="claude"] .wk-app .lg img.ap-claude,[data-app="codex"] .wk-app .lg img.ap-codex,[data-app="gemini"] .wk-app .lg img.ap-gemini{display:block}
.ya-who img[class*="ap-"]{display:none}
[data-app="claude"] .ya-who img.ap-claude,[data-app="codex"] .ya-who img.ap-codex,[data-app="gemini"] .ya-who img.ap-gemini{display:block}
@media (max-width:640px){
  .ya-apps{gap:8px;padding:10px 8px}
  .ya-seg{grid-template-columns:repeat(3,1fr);border-radius:999px}
  .ya-seg button{padding:0 14px;font-size:13.5px;white-space:nowrap}
}