.pose-page { background: radial-gradient(ellipse at 84% 9%, rgba(58,141,222,.065), transparent 38rem), var(--bg); }
.pose-page :is(a, summary, video):focus-visible { outline: 3px solid var(--lime); outline-offset: 5px; }
.pose-page :is(section, main) { scroll-margin-top: 98px; }
.pose-page h2 { margin: 0; font-size: clamp(32px, 3.8vw, 50px); font-weight: 750; line-height: 1.08; letter-spacing: -.045em; text-wrap: balance; }
.pose-page strong { font-weight: 700; }
.pose-page .breadcrumbs { color: var(--muted); }
.pose-skip-link { position: fixed; top: 12px; left: 20px; z-index: 100; padding: 14px 20px; border-radius: 10px; background: var(--lime); color: var(--bg); font-weight: 750; transform: translateY(-180%); }
.pose-skip-link:focus { transform: translateY(0); }

.pose-hero { padding: 36px 0 0; }
.pose-hero-grid { display: grid; grid-template-columns: minmax(0,.88fr) minmax(0,1.12fr); align-items: center; gap: 46px; padding: 20px 0 64px; }
.pose-hero-copy h1 { margin: 0; font-size: clamp(44px, 4.6vw, 66px); font-weight: 780; line-height: 1.02; letter-spacing: -.058em; text-wrap: balance; }
.pose-hero-copy h1 span { color: var(--lime); }
.pose-hero .lead { margin-top: 24px; font-size: 18px; line-height: 1.7; }
.pose-hero .hero-actions { align-items: center; gap: 24px; margin-top: 28px; }
.pose-text-link { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: var(--text); font-size: 14px; font-weight: 700; text-decoration: underline; text-decoration-color: rgba(255,255,255,.28); text-underline-offset: 5px; }
.pose-text-link:hover { color: var(--lime); text-decoration-color: var(--lime); }
.pose-text-link span { text-decoration: none; }
.pose-recording { min-width: 0; overflow: hidden; margin: 0; border: 1px solid rgba(58,141,222,.23); border-radius: 20px; background: #0d0f11; box-shadow: 0 30px 90px rgba(0,0,0,.35); }
.pose-recording-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 16px 20px; color: var(--muted); font-size: 11px; }
.pose-recording-heading > span:first-child { display: flex; align-items: center; gap: 8px; color: var(--text); font-size: 12px; font-weight: 700; }
.pose-recording-heading i { width: 6px; height: 6px; border-radius: 50%; background: var(--lime); }
.pose-recording video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: #08090b; }
.pose-recording a { color: var(--lime); text-decoration: underline; }

.pose-section { padding: 88px 0; }
.pose-section-heading { display: grid; grid-template-columns: 1.15fr .85fr; align-items: end; gap: 72px; margin-bottom: 38px; }
.pose-section-heading > p { margin: 0; color: var(--muted); font-size: 16px; line-height: 1.8; }
.pose-workflow { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; margin: 0; padding: 0; list-style: none; counter-reset: none; }
.pose-workflow li { display: flex; flex-direction: column; align-items: flex-start; padding: 28px; border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(155deg, rgba(255,255,255,.035), transparent); }
.pose-step-number { margin-bottom: 34px; color: var(--lime); font-size: 14px; font-weight: 750; letter-spacing: .06em; }
.pose-workflow h3 { margin: 0; font-size: 23px; font-weight: 700; letter-spacing: -.025em; }
.pose-workflow p { margin: 16px 0 26px; color: var(--muted); font-size: 14px; line-height: 1.85; }
.pose-workflow p strong { color: var(--text); }
.pose-step-label { width: 100%; margin-top: auto; padding-top: 18px; border-top: 1px solid var(--line); color: #d1d1c9; font-size: 11px; font-weight: 650; }

.pose-controls-section { border-block: 1px solid var(--line); background: rgba(255,255,255,.018); }
.pose-controls-layout { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 76px; }
.pose-controls-intro .section-copy { font-size: 16px; }
.pose-controls-intro .pose-text-link { margin-top: 24px; color: var(--lime); }
.pose-controls-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 34px; }
.pose-control-card { padding-top: 18px; border-top: 1px solid var(--line-strong); }
.pose-control-index { color: var(--lime); font-size: 10px; font-weight: 750; letter-spacing: .12em; }
.pose-control-card h3 { margin: 20px 0 12px; font-size: 19px; letter-spacing: -.02em; }
.pose-control-card p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.85; }

.pose-expectations { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); align-items: start; gap: 96px; }
.pose-expectations-copy > p:not(.eyebrow) { margin: 24px 0 0; color: var(--muted); font-size: 15px; line-height: 1.85; }
.pose-access-panel { padding: 32px; border: 1px solid rgba(58,141,222,.21); border-radius: 20px; background: linear-gradient(140deg, rgba(58,141,222,.075), rgba(58,141,222,.015)); }
.pose-panel-label { color: var(--lime); font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.pose-access-panel h3 { margin: 18px 0; font-size: 27px; font-weight: 700; line-height: 1.15; letter-spacing: -.035em; }
.pose-access-panel p { margin: 0 0 18px; color: #c1c3b8; font-size: 14px; line-height: 1.8; }
.pose-access-panel .button { margin-top: 6px; }

.pose-faq-section { border-top: 1px solid var(--line); }
.pose-faq-layout { display: grid; grid-template-columns: minmax(0,.75fr) minmax(0,1.25fr); gap: 70px; }
.pose-faq { margin: 0; }
.pose-faq details { border-radius: 12px; }
.pose-faq summary { display: flex; align-items: start; justify-content: space-between; gap: 22px; padding: 22px; font-size: 15px; line-height: 1.6; }
.pose-faq summary::after { flex: 0 0 auto; font-size: 20px; line-height: 1.2; }
.pose-faq details p { padding: 0 22px 24px; font-size: 14px; }

.pose-related-section { padding-top: 0; }
.pose-related { display: flex; align-items: center; justify-content: space-between; gap: 56px; padding: 40px; border: 1px solid var(--line-strong); border-radius: 22px; background: linear-gradient(130deg, rgba(58,141,222,.055), rgba(255,255,255,.018)); }
.pose-related h2 { max-width: 600px; font-size: clamp(30px, 3.6vw, 44px); }
.pose-related p:not(.eyebrow) { max-width: 580px; margin: 18px 0 0; color: var(--muted); font-size: 14px; line-height: 1.8; }
.pose-related .eyebrow { margin-bottom: 14px; }
.pose-related-actions { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-start; gap: 14px; }
.pose-related-actions .pose-text-link { font-size: 12px; }
.pose-page .article-footer-inner nav { flex-wrap: wrap; }
.pose-page .article-footer-inner a { display: inline-flex; align-items: center; min-height: 36px; }

@media (max-width: 1050px) {
  .pose-hero-grid { gap: 30px; }
  .pose-hero-copy h1 { font-size: clamp(42px, 5vw, 58px); }
  .pose-hero .lead { font-size: 16px; }
  .pose-controls-layout, .pose-expectations { gap: 48px; }
  .pose-section-heading { gap: 40px; }
  .pose-workflow li { padding: 24px; }
  .pose-related { gap: 32px; padding: 32px; }
}

@media (max-width: 820px) {
  .pose-hero-grid { grid-template-columns: 1fr; gap: 36px; padding-top: 10px; }
  .pose-hero-copy { max-width: 620px; }
  .pose-hero-copy h1 { max-width: 580px; font-size: clamp(44px, 7.5vw, 62px); }
  .pose-hero .lead { max-width: 560px; font-size: 18px; }
  .pose-recording { width: 100%; }
  .pose-section { padding: 64px 0; }
  .pose-section-heading, .pose-controls-layout, .pose-expectations, .pose-faq-layout { grid-template-columns: 1fr; gap: 30px; }
  .pose-section-heading > p { max-width: 600px; }
  .pose-workflow { gap: 12px; }
  .pose-workflow li { padding: 20px; }
  .pose-workflow h3 { font-size: 20px; }
  .pose-controls-intro { max-width: 560px; }
  .pose-related-section { padding-top: 0; }
  .pose-related { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 580px) {
  .pose-page .site-header .inner { min-height: 68px; }
  .pose-page .brand { gap: 8px; font-size: 14px; }
  .pose-page .brand-mark { width: 32px; height: 32px; flex-basis: 32px; }
  .pose-page .compact-nav { gap: 18px; }
  .pose-page .compact-nav a { display: inline-flex; align-items: center; min-height: 44px; }
  .pose-hero { padding-top: 24px; }
  .pose-hero .breadcrumbs { margin-bottom: 28px; }
  .pose-hero-grid { padding: 0 0 36px; }
  .pose-hero-copy h1 { max-width: 410px; font-size: clamp(39px, 9.6vw, 54px); }
  .pose-hero .eyebrow { font-size: 10px; }
  .pose-hero .lead { font-size: 16px; }
  .pose-hero .hero-actions { column-gap: 20px; row-gap: 8px; }
  .pose-recording { border-radius: 14px; }
  .pose-recording-heading { padding: 14px; font-size: 10px; }
  .pose-recording-heading > span:first-child { font-size: 11px; }
  .pose-workflow { grid-template-columns: 1fr; gap: 14px; }
  .pose-workflow li { padding: 24px; }
  .pose-step-number { margin-bottom: 20px; }
  .pose-workflow h3 { font-size: 23px; }
  .pose-controls-grid { grid-template-columns: 1fr; gap: 26px; }
  .pose-control-card h3 { margin-top: 16px; }
  .pose-access-panel { padding: 26px; }
  .pose-faq summary { padding: 20px; }
  .pose-faq details p { padding-inline: 20px; }
  .pose-related { padding: 28px 24px; }
  .pose-related-actions { max-width: 100%; }
  .pose-related-actions .pose-text-link { gap: 8px; }
}
/* Original reference / first-output examples */
.pose-example-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.pose-example-card { display:block; overflow:hidden; padding:16px; border:1px solid var(--line); border-radius:18px; background:rgba(255,255,255,.025); color:inherit; text-decoration:none; }
.pose-example-card:hover { border-color:var(--lime); }
.pose-example-images { display:grid; grid-template-columns:1fr 1fr; gap:8px; align-items:center; background:#111; border-radius:10px; overflow:hidden; }
.pose-example-images img { display:block; width:100%; height:auto; }
.pose-example-labels { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px; color:var(--muted); font-size:11px; }
.pose-example-card h3 { margin:24px 0 10px; font-size:24px; }
.pose-example-card p,.pose-example-note { color:var(--muted); font-size:13px; line-height:1.8; }
.pose-example-note { margin-top:24px; }
.pose-example-note a { display:inline; font-size:inherit; }
@media(max-width:820px) { .pose-example-grid { grid-template-columns:1fr; } .pose-example-card { max-width:620px; } }