/* Playbook pages (/blog/playbooks/ and its download pages): gated resource, layout of an ebook page (copy and cover left, form right).
   Built on the cinematic layer (gz.css tokens, buttons, labels, pills) and follows the light/dark theme. */
.pb-page{--pb-section:clamp(3.5rem,8vw,6.5rem);overflow-x:clip}
.pb-i{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pb-page h1,.pb-page h2,.pb-page h3,.pb-page h4{font-family:var(--gz-font-display);font-weight:var(--fw-heavy);font-stretch:var(--stretch-display);letter-spacing:var(--tracking-heading);line-height:var(--lh-heading);text-wrap:balance}

/* Hero */
.pb-hero{position:relative;padding:clamp(1.5rem,4vw,2.5rem) 0 var(--pb-section)}
.pb-hero::before{content:"";position:absolute;inset:0;background-image:radial-gradient(var(--grid-dot) 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(180deg,#000 30%,transparent 95%);-webkit-mask-image:linear-gradient(180deg,#000 30%,transparent 95%);pointer-events:none}
.pb-crumbs{position:relative;display:flex;flex-wrap:wrap;gap:.5rem;font-family:var(--gz-font-mono);font-size:var(--gz-fs-label);letter-spacing:.08em;text-transform:uppercase;color:var(--text-tertiary)}
.pb-crumbs a{color:var(--text-secondary);text-decoration:none}
.pb-crumbs a:hover{color:var(--text-primary)}
.pb-hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(2rem,5vw,5rem);align-items:start;margin-top:2rem}
.pb-hero-copy{display:grid;gap:1.5rem;padding-top:.5rem}
.pb-hero h1{font-size:clamp(2.5rem,5.4vw,5rem);font-weight:var(--fw-black);line-height:.95;letter-spacing:-.04em}
.pb-kw{background:var(--highlight-bg);color:var(--highlight-fg);padding:0 .12em;border-radius:var(--radius-xs);box-decoration-break:clone;-webkit-box-decoration-break:clone}
.pb-lead{font-size:var(--gz-fs-lead);line-height:var(--lh-prose);color:var(--text-secondary);max-width:52ch}
.pb-pills,.pb-tools{display:flex;flex-wrap:wrap;gap:.6rem;margin:0;padding:0;list-style:none}
.pb-cover-row{display:flex;align-items:center;gap:clamp(1.25rem,3vw,2.5rem);margin-top:.5rem}
.pb-cover{flex:none;width:clamp(190px,21vw,280px);height:auto;border-radius:3px;transform:rotate(-2.5deg);box-shadow:0 0 0 1px rgb(255 255 255 / 8%),0 28px 60px rgb(0 0 0 / 55%)}
:root[data-theme="light"] .pb-cover{box-shadow:0 0 0 1px rgb(0 0 0 / 6%),0 24px 50px rgb(10 10 10 / 25%)}
.pb-cover-note{display:grid;gap:.75rem;color:var(--text-secondary)}
.pb-cover-note strong{color:var(--text-primary)}
.pb-cover-note ul{display:grid;gap:.6rem;margin:0;padding:0;list-style:none}
.pb-cover-note li{display:flex;gap:.6rem}
.pb-cover-note .pb-i{margin-top:.2rem;width:18px;height:18px;color:var(--accent-text)}
:root[data-theme="light"] .pb-cover-note .pb-i{color:var(--gz-blue)}

/* Form card */
.pb-form-card{position:sticky;top:96px;scroll-margin-top:96px;padding:clamp(1.25rem,2.5vw,2rem);background:var(--surface-raised);border:1px solid var(--border-subtle);border-top:3px solid var(--gz-yellow);border-radius:var(--radius-md);box-shadow:var(--shadow-node)}
:root[data-theme="light"] .pb-form-card{box-shadow:0 8px 24px rgb(10 10 10 / 8%)}
.pb-form-card h2{font-size:1.5rem;margin-bottom:.35rem}
.pb-form-intro{color:var(--text-secondary);font-size:.9375rem;margin-bottom:1.25rem!important}
.pb-nojs{margin-bottom:1rem!important;font-weight:var(--fw-semibold)}
.pb-fields{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.pb-field{display:grid;gap:.35rem;align-content:start}
.pb-field--full{grid-column:1/-1}
.pb-field label{font-size:.8125rem;font-weight:var(--fw-semibold)}
.pb-opt{font-weight:var(--fw-regular);color:var(--text-tertiary)}
.pb-field input,.pb-field select{width:100%;min-height:48px;padding:.65rem .8rem;border:1px solid var(--border-control);border-radius:var(--radius-sm);background:var(--surface-sunken);color:var(--text-primary);font:400 1rem var(--gz-font-body)}
.pb-field input:hover,.pb-field select:hover{border-color:var(--text-secondary)}
.pb-field input[aria-invalid="true"]{border-color:var(--text-danger)}
.pb-check{display:flex;gap:.7rem;align-items:flex-start;font-size:.8125rem;line-height:1.5;color:var(--text-secondary)}
.pb-check input{width:20px;height:20px;margin:.1rem 0 0;accent-color:var(--gz-blue);flex:none}
.pb-check input[aria-invalid="true"]{outline:2px solid var(--text-danger);outline-offset:2px}
.pb-submit{width:100%;margin-top:1.1rem;min-height:56px;font-size:1rem}
.pb-submit[disabled]{opacity:.7;cursor:progress}
.pb-status{margin-top:.8rem!important;font-size:.875rem;color:var(--text-danger)}
.pb-status:focus{outline:none}
.pb-fine{margin-top:.8rem!important;font-size:.75rem;line-height:1.5;color:var(--text-tertiary)}
.pb-success{display:grid;gap:.9rem}
.pb-success:focus{outline:none}
.pb-success p{color:var(--text-secondary)}
.pb-badge{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--gz-yellow);color:var(--gz-black)}

/* Sections */
.pb-band{padding:var(--pb-section) 0;border-top:1px solid var(--border-subtle)}
.pb-band--sunken{background:var(--surface-sunken)}
.pb-head{display:grid;gap:1rem;max-width:760px;margin-bottom:clamp(2rem,4vw,3.5rem)}
.pb-head h2{font-size:clamp(2rem,4vw,3.25rem);letter-spacing:var(--tracking-display)}
.pb-head p{color:var(--text-secondary);font-size:1.0625rem;max-width:60ch}
.pb-head .gz-btn{justify-self:start}

.pb-stages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.5rem,3vw,2.5rem)}
.pb-stage h3{display:flex;align-items:center;justify-content:space-between;gap:1rem;font-size:1.25rem;padding-bottom:1rem;border-bottom:2px solid var(--text-primary)}
.pb-stage h3 small{font-family:var(--gz-font-mono);font-size:var(--gz-fs-micro);font-weight:var(--fw-medium);letter-spacing:.12em;color:var(--text-tertiary)}
.pb-wf{margin:0;padding:0;list-style:none}
.pb-wf li{display:grid;grid-template-columns:auto 1fr;gap:1rem;padding:1.15rem 0;border-bottom:1px solid var(--border-subtle)}
.pb-num{width:36px;height:36px;display:grid;place-items:center;border-radius:var(--radius-xs);background:var(--gz-yellow);color:var(--gz-black);font-family:var(--gz-font-mono);font-size:.8125rem;font-weight:var(--fw-semibold)}
.pb-wf h4{font-size:1.0625rem;font-weight:var(--fw-bold);letter-spacing:-.01em;line-height:1.25;margin-bottom:.3rem}
.pb-wf p{color:var(--text-secondary);font-size:.9rem;line-height:1.55}

.pb-split{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.pb-split .pb-head{margin-bottom:0}
.pb-sample{margin:0;background:var(--surface-raised);border:1px solid var(--border-subtle);border-radius:var(--radius-md);overflow:hidden}
.pb-sample-head{display:flex;justify-content:space-between;gap:1rem;padding:.9rem 1.25rem;border-bottom:1px solid var(--border-subtle);font-family:var(--gz-font-mono);font-size:var(--gz-fs-micro);letter-spacing:.12em;text-transform:uppercase;color:var(--text-tertiary)}
.pb-sample-body{padding:1.5rem 1.25rem 1.25rem}
.pb-sample-body h3{font-size:1.25rem;margin:.6rem 0 1.25rem}
.pb-steps{margin:0 0 1.25rem;padding:0;list-style:none}
.pb-steps li{position:relative;display:grid;grid-template-columns:44px 1fr;gap:1rem;align-items:center;padding:.55rem 0}
.pb-steps li:not(:last-child)::after{content:"";position:absolute;left:21px;top:calc(50% + 22px);height:calc(100% - 44px);width:2px;background:var(--border-default)}
.pb-node{width:44px;height:44px;display:grid;place-items:center;border-radius:10px;background:var(--surface-sunken);border:1px solid var(--border-default);color:var(--text-primary)}
.pb-node--sys{background:var(--gz-blue);border-color:var(--gz-blue-edge);color:var(--gz-white)}
.pb-node--human{background:var(--gz-yellow);border-color:var(--gz-yellow);color:var(--gz-black)}
.pb-steps strong{display:block;font-size:.9375rem}
.pb-steps span{font-size:.8125rem;color:var(--text-secondary)}

.pb-who,.pb-related{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.pb-who>div,.pb-related a{display:grid;align-content:start;gap:.5rem;padding:1.5rem;border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--surface-raised)}
.pb-who h3,.pb-related h3{font-size:1.125rem}
.pb-who p,.pb-related p{color:var(--text-secondary);font-size:.9375rem}
.pb-related a{color:var(--text-primary);text-decoration:none;transition:border-color var(--gz-micro),transform var(--gz-normal) var(--gz-ease-out)}
.pb-related a:hover{color:var(--text-primary);border-color:var(--text-secondary);transform:translateY(calc(-1 * var(--lift-distance)))}

.pb-final{padding:clamp(3rem,6vw,5rem) 0;background:var(--gz-yellow);color:var(--gz-black)}
.pb-final .gz-shell{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem}
.pb-final h2{font-size:clamp(1.75rem,3.4vw,2.75rem);max-width:22ch}
.pb-final .gz-btn:focus-visible{outline-color:var(--gz-black)}

/* Playbook list (/blog/playbooks/) */
.pb-head--list{margin:2rem 0 clamp(2rem,4vw,3rem);position:relative}
.pb-head--list h1{font-size:clamp(2.5rem,5.4vw,4.5rem);font-weight:var(--fw-black);line-height:.95;letter-spacing:-.04em}
.pb-list{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1rem,2.5vw,1.75rem);margin:0;padding:0;list-style:none}
.pb-card{display:grid;grid-template-columns:clamp(120px,14vw,170px) 1fr;gap:clamp(1rem,2.5vw,1.75rem);align-items:start;padding:clamp(1.25rem,2.5vw,1.75rem);background:var(--surface-raised);border:1px solid var(--border-subtle);border-radius:var(--radius-md);transition:border-color var(--gz-micro)}
.pb-card:hover{border-color:var(--text-secondary)}
.pb-card__cover img{display:block;width:100%;height:auto;border-radius:3px;box-shadow:0 14px 30px rgb(0 0 0 / 35%)}
.pb-card__body{display:grid;gap:.85rem;align-content:start}
.pb-card h2{font-size:clamp(1.375rem,2.2vw,1.75rem)}
.pb-card h2 a{color:var(--text-primary);text-decoration:none}
.pb-card h2 a:hover{text-decoration:underline;text-underline-offset:.15em}
.pb-card p{color:var(--text-secondary);font-size:.9375rem;line-height:1.55}
.pb-card .gz-btn{justify-self:start}
.pb-empty{grid-column:1/-1;padding:1.5rem;border:1px dashed var(--border-default);border-radius:var(--radius-md);color:var(--text-secondary)}

@media (max-width:900px){
  .pb-list{grid-template-columns:1fr}
  .pb-hero-grid,.pb-split{grid-template-columns:1fr}
  .pb-form-card{position:static}
  .pb-stages{grid-template-columns:1fr}
  .pb-who,.pb-related{grid-template-columns:1fr 1fr}
}
@media (max-width:540px){
  .pb-card{grid-template-columns:1fr}
  .pb-card__cover{width:min(50vw,180px)}
  .pb-fields,.pb-who,.pb-related{grid-template-columns:1fr}
  .pb-cover-row{flex-direction:column;align-items:flex-start}
  .pb-cover{width:min(60vw,240px)}
}
@media (prefers-reduced-motion:reduce){.pb-related a,.pb-card{transition:none}.pb-related a:hover{transform:none}}