/* KDP Book Formatting – bookshop-style portfolio.
   Books stand on wooden shelves at their real relative trim size; picking one opens a reader under its shelf.
   Tokens repeat the landing palette so the shortcode also works on ordinary theme pages. */
.kdpbf-pf, .pf-hero, .pf-teaser{
  --orange:#FD9900;--orange-dk:#E38900;--orange-soft:#FFF4E0;--ink:#1A1A1A;--text:#333;--grey:#6B6B6B;--line:#E6E2DC;
  --wall:#F6EFE4;--wall-dk:#EADFCD;--wood:#A8743F;--wood-lt:#C08A52;--wood-dk:#6E4526;--desk:#EFE6D8;
  --sans:"Figtree",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--serif:"Literata",Georgia,serif;
  --u:26px;--slot:calc(10.6 * var(--u));--plank:16px;
}
.kdpbf-pf *{box-sizing:border-box}
.kdpbf-pf{font-family:var(--sans);color:var(--text)}
.kdpbf-pf button{font-family:inherit}
.kdpbf-pf :focus-visible{outline:3px solid var(--orange);outline-offset:3px}

/* ---------- page hero ---------- */
.pf-hero{background:var(--orange-soft);padding:56px 0 46px!important}
.pf-hero h1{font-size:clamp(2.2rem,5vw,3.4rem);margin-bottom:.25em}
.pf-hero .sub{color:var(--text);font-size:1.15rem;margin:6px 0 18px;max-width:58ch}
.pf-facts{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px 22px;font-weight:600;color:var(--ink)}
.pf-facts li{display:flex;align-items:center;gap:8px}
.pf-facts li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--orange)}
.pf-facts b{font-weight:900}
.pf-body{padding:34px 0 70px!important}
.pf-intro{max-width:70ch;margin:0 0 22px;color:var(--grey)}

/* ---------- jump links ---------- */
.pf-jump{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:0 0 20px;font-size:.95rem}
.pf-jump span{color:var(--grey);font-weight:600;margin-right:4px}
.pf-jump a{color:var(--ink);text-decoration:none;font-weight:700;border:2px solid var(--line);border-radius:999px;padding:7px 14px;background:#fff}
.pf-jump a:hover{border-color:var(--ink)}

/* ---------- the bookcase ---------- */
.pf-case{background:linear-gradient(180deg,var(--wall),var(--wall) 60%,var(--wall-dk));border:14px solid var(--wood);border-top-width:16px;border-radius:10px;
  box-shadow:inset 0 10px 24px -14px rgba(60,35,10,.45),0 20px 40px -24px rgba(60,35,10,.5);padding:8px 0 4px;position:relative}
.pf-case::before{content:"";position:absolute;inset:-14px;border-radius:10px;pointer-events:none;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.12),inset 0 0 0 4px rgba(0,0,0,.08)}
.pf-shelf{padding:24px 28px 8px;scroll-margin-top:150px}
.pf-shelf+.pf-shelf{border-top:1px solid rgba(110,69,38,.12)}
.pf-shelf-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:6px}
.pf-shelf-head h2{font:800 1.35rem/1.2 var(--sans)!important;color:var(--ink);letter-spacing:-.01em;margin:0 0 4px!important;display:flex;align-items:center;gap:10px}
.pf-n{font-size:.78rem;font-weight:800;background:#fff;color:var(--wood-dk);border-radius:999px;padding:3px 9px}
.pf-shelf-head p{margin:0;color:var(--grey);font-size:.97rem;max-width:62ch}
.pf-arrows{display:flex;gap:8px;flex:none}
.pf-arrows[hidden]{display:none}
.pf-arrow{width:40px;height:40px;border-radius:50%;border:2px solid var(--wood);background:#fff;color:var(--wood-dk);font:700 1.4rem/1 var(--sans);cursor:pointer;display:grid;place-items:center;padding-bottom:3px}
.pf-arrow:hover:not(:disabled){background:var(--wood);color:#fff}
.pf-arrow:disabled{opacity:.35;cursor:default}

.pf-unit{position:relative}
.pf-unit::before{content:"";position:absolute;left:-28px;right:-28px;top:var(--slot);height:var(--plank);z-index:0;
  background:linear-gradient(180deg,var(--wood-lt) 0,var(--wood) 45%,var(--wood-dk) 100%);
  box-shadow:0 10px 16px -6px rgba(60,35,10,.45),inset 0 2px 0 rgba(255,255,255,.18)}
.pf-row{position:relative;z-index:1;list-style:none;margin:0;padding:0 2px 14px;display:flex;gap:26px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:var(--wood) transparent}
.pf-row::-webkit-scrollbar{height:8px}.pf-row::-webkit-scrollbar-thumb{background:var(--wood);border-radius:8px}
.pf-item{flex:none;width:max(calc(var(--w) * var(--u)), 146px);scroll-snap-align:start;margin:0}
.pf-pick{all:unset;box-sizing:border-box;display:block;width:100%;cursor:pointer;text-align:left}
.pf-slot{height:var(--slot);display:flex;align-items:flex-end;justify-content:center;padding-top:14px}
.pf-bk{position:relative;display:block;width:calc(var(--w) * var(--u));height:calc(var(--h) * var(--u));border-radius:2px 5px 5px 2px;overflow:hidden;background:#ddd;
  box-shadow:7px 0 14px -6px rgba(40,22,6,.55),0 1px 2px rgba(0,0,0,.25);transform-origin:50% 100%;transition:transform .28s cubic-bezier(.2,.7,.3,1),box-shadow .28s}
.pf-bk img{width:100%;height:100%;object-fit:cover;display:block}
.pf-bk::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(0,0,0,.32) 0,rgba(255,255,255,.22) 2.5%,rgba(0,0,0,.1) 4.5%,transparent 9%,transparent 94%,rgba(0,0,0,.12) 100%)}
.pf-pick:hover .pf-bk,.pf-pick:focus-visible .pf-bk{transform:translateY(-12px) rotate(-1.5deg);box-shadow:12px 14px 22px -8px rgba(40,22,6,.5)}
.pf-pick[aria-expanded="true"] .pf-bk{transform:translateY(-16px);box-shadow:0 18px 26px -10px rgba(40,22,6,.55),0 0 0 3px var(--orange)}
.pf-pick:focus-visible{outline:none}
.pf-pick:focus-visible .pf-card-text .pf-name{text-decoration:underline;text-decoration-color:var(--orange);text-decoration-thickness:3px;text-underline-offset:3px}
.pf-type{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:16% 12% 14%}
.pf-type.t0{background:#1d1b19;color:#fff}.pf-type.t1{background:#2f4858;color:#fff}.pf-type.t2{background:#7a3b2e;color:#fff}.pf-type.t3{background:#3d5a3f;color:#fff}
.pf-type-t{font:700 clamp(.8rem,calc(var(--u) * .6),1.15rem)/1.15 var(--serif);display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.pf-type-t::after{content:"";display:block;width:34%;height:3px;background:var(--orange);margin-top:10px}
.pf-type-a{font:italic .74rem/1.3 var(--serif);opacity:.85}
.pf-card-text{display:grid;gap:2px;margin-top:calc(var(--plank) + 12px);padding:0 2px}
.pf-name{font:800 .98rem/1.25 var(--sans);color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pf-by{font:italic .9rem/1.3 var(--serif);color:var(--grey);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.pf-kind{font:700 .76rem/1.3 var(--sans);color:var(--grey);margin-top:4px}
.pf-kind.is-client{color:#9A5C00}
.pf-kind.is-client::before{content:"★ ";color:var(--orange)}
.pf-sub{font-size:.8rem;color:var(--grey)}

/* ---------- reader (opens under the shelf) ---------- */
.pf-reader{margin:6px 22px 26px;background:#fff;border-radius:18px;box-shadow:0 24px 50px -20px rgba(60,35,10,.45),0 0 0 1px rgba(110,69,38,.12);padding:22px 24px 24px;position:relative;scroll-margin-top:110px}
.pf-reader[hidden]{display:none}
.pf-reader:focus{outline:none}
.pf-reader::before{content:"";position:absolute;top:-9px;left:var(--tip,60px);width:18px;height:18px;background:#fff;transform:rotate(45deg);box-shadow:-1px -1px 0 rgba(110,69,38,.12)}
.pf-r-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:14px}
.pf-r-kind{margin:0 0 4px;font:800 .78rem/1.2 var(--sans);letter-spacing:.04em;text-transform:uppercase;color:#9A5C00}
.pf-reader h3{font:900 clamp(1.35rem,2.6vw,1.8rem)/1.15 var(--sans)!important;color:var(--ink);letter-spacing:-.02em;margin:0!important}
.pf-r-by{margin:4px 0 0;font:italic 1rem/1.4 var(--serif);color:var(--grey)}
.pf-r-close{flex:none;border:2px solid var(--ink);background:#fff;color:var(--ink);border-radius:999px;padding:9px 16px;font:700 .92rem/1 var(--sans);cursor:pointer;display:inline-flex;gap:8px;align-items:center}
.pf-r-close span{font-size:1.2rem;line-height:.8}
.pf-r-close:hover{background:var(--ink);color:#fff}
.pf-r-body{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:26px}
.pf-desk{background:var(--desk);border-radius:14px;padding:12px 14px 12px;display:grid;grid-template-rows:auto auto auto;min-width:0}
.pf-views{display:inline-flex;justify-self:start;background:#fff;border-radius:999px;padding:4px;gap:2px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.pf-views button{border:0;background:transparent;border-radius:999px;padding:8px 14px;height:34px;font:700 .88rem/1 var(--sans);color:var(--grey);cursor:pointer;margin:0}
.pf-views button[aria-pressed="true"]{background:var(--ink);color:#fff}
.pf-views button[hidden],.pf-views[hidden]{display:none}
.pf-stage{position:relative;height:clamp(340px,60vh,560px);display:grid;place-items:center;margin:10px 0 6px;min-width:0}
.pf-spread,.pf-cover{grid-area:1/1;display:flex;justify-content:center;align-items:center;max-width:100%;max-height:100%}
.pf-cover[hidden],.pf-spread[hidden]{display:none}
.pf-cover{flex-direction:column;gap:14px;height:100%;width:100%}
.pf-cover figure{margin:0;display:grid;gap:6px;justify-items:center;min-height:0;flex:1 1 0;width:100%;grid-template-rows:minmax(0,1fr) auto}
.pf-cover img{max-width:100%;max-height:100%;object-fit:contain;box-shadow:0 14px 28px -10px rgba(40,22,6,.45);border-radius:2px}
.pf-cover figcaption{font-size:.84rem;font-weight:700;color:var(--wood-dk)}
.pf-cover .pf-type{position:relative;inset:auto;width:min(260px,70%);aspect-ratio:2/3;box-shadow:0 14px 28px -10px rgba(40,22,6,.45)}
.pf-spread{perspective:2400px;position:relative}
.pf-pg{position:relative;background:#fff;overflow:hidden;box-shadow:0 14px 30px -10px rgba(40,22,6,.45)}
.pf-pg img,.pf-pg canvas{display:block;width:100%;height:100%;object-fit:contain;background:#fff}
.pf-pg.blank{background:transparent;box-shadow:none}
.pf-spread.two .pf-pg.l::after{content:"";position:absolute;inset:0 0 0 auto;width:12%;background:linear-gradient(90deg,transparent,rgba(0,0,0,.12));pointer-events:none}
.pf-spread.two .pf-pg.r::after{content:"";position:absolute;inset:0 auto 0 0;width:10%;background:linear-gradient(270deg,transparent,rgba(0,0,0,.15));pointer-events:none}
.pf-leaf{position:absolute;top:0;transform-style:preserve-3d;z-index:3;transition:transform .6s cubic-bezier(.45,.05,.3,1)}
.pf-leaf .face{position:absolute;inset:0;backface-visibility:hidden;background:#fff;overflow:hidden}
.pf-leaf .face img{width:100%;height:100%;object-fit:contain;display:block}
.pf-leaf .back{transform:rotateY(180deg)}
.pf-status{position:absolute;left:50%;bottom:6px;transform:translateX(-50%);margin:0;background:rgba(40,22,6,.75);color:#fff;font-size:.82rem;padding:6px 12px;border-radius:999px}
.pf-status[hidden]{display:none}
.pf-empty-note{color:var(--wood-dk);text-align:center;max-width:36ch;line-height:1.5;font-weight:600}
.pf-turn{display:flex;align-items:center;justify-content:space-between;gap:10px}
.pf-turn[hidden]{display:none}
.pf-turn button{border:0;background:var(--ink);color:#fff;border-radius:999px;padding:11px 18px;font:700 .92rem/1 var(--sans);cursor:pointer;display:inline-flex;gap:6px;align-items:center}
.pf-turn button span{font-size:1.25rem;line-height:.6}
.pf-turn button:hover:not(:disabled){background:#333}
.pf-turn button:disabled{background:rgba(0,0,0,.12);color:rgba(0,0,0,.35);cursor:default}
.pf-count{font:700 .9rem/1 var(--sans);color:var(--wood-dk);font-variant-numeric:tabular-nums;text-align:center}
.pf-notes{display:flex;flex-direction:column;gap:16px;min-width:0}
.pf-r-desc{margin:0;color:var(--text);line-height:1.6}
.pf-r-desc[hidden]{display:none}
.pf-r-did h4{font:800 1rem/1.2 var(--sans);color:var(--ink);margin:0 0 8px}
.pf-r-did ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.pf-r-did li{position:relative;padding-left:26px;font-size:.96rem}
.pf-r-did li::before{content:"✓";position:absolute;left:0;top:1px;width:18px;height:18px;border-radius:50%;background:#76E994;color:#0b3b1c;font:900 .7rem/18px var(--sans);text-align:center}
.pf-r-did[hidden]{display:none}
.pf-r-facts{margin:0;display:grid;border-top:1px solid var(--line)}
.pf-r-facts div{display:grid;grid-template-columns:100px 1fr;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:.93rem}
.pf-r-facts dt{color:var(--grey)}
.pf-r-facts dd{margin:0;font-weight:700;color:var(--ink)}
.pf-r-rev:empty{display:none}
.pf-r-rev{background:var(--wall);border-radius:14px;padding:12px}
.pf-r-rev video,.pf-r-rev iframe{width:100%;aspect-ratio:16/10;border:0;border-radius:10px;background:#111;display:block}
.pf-r-rev p{margin:8px 0 0;font:400 .95rem/1.45 var(--serif);color:var(--ink)}
.pf-r-rev b{display:block;font:800 .86rem/1.3 var(--sans);margin-top:4px}
.pf-r-price{background:var(--orange-soft);border-radius:16px;padding:16px;display:grid;gap:8px;margin-top:auto}
.pf-r-price-t{margin:0;font-weight:800;color:var(--ink)}
.pf-r-price-v{margin:0 0 4px;color:var(--text);font-size:.95rem}
.pf-r-price .btn{display:flex;align-items:center;justify-content:center;font:800 1rem/1 var(--sans);padding:15px 18px;border-radius:999px;text-decoration:none;background:var(--orange);color:#000}
.pf-r-price .btn:hover{background:var(--orange-dk)}
.pf-r-wa,.pf-r-amazon{text-align:center;font-weight:700;font-size:.92rem;color:var(--ink)}
.pf-r-amazon[hidden]{display:none}

/* ---------- landing strip ---------- */
.pf-teaser{background:#fff}
.pf-teaser-head{display:flex;flex-wrap:wrap;gap:16px 30px;align-items:flex-end;justify-content:space-between;margin-bottom:26px}
.pf-teaser-head .sub{margin:0}
.pf-teaser .pf-shelf-head{justify-content:flex-end;margin:0}
.pf-teaser .pf-shelf-head>div:first-child{display:none}
.pf-teaser .pf-shelf{padding-top:16px}

/* ---------- video reviews ---------- */
.pf-reviews{margin-top:60px}
.pf-reviews h2{margin-bottom:24px}
.pf-vid-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:22px}
.pf-vid{margin:0;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;display:flex;flex-direction:column}
.pf-vid-frame{aspect-ratio:4/5;background:#1d1b19;position:relative}
.pf-vid-frame video,.pf-vid-frame iframe{width:100%;height:100%;display:block;border:0;object-fit:cover;background:#1d1b19}
.pf-vid-play{all:unset;position:absolute;inset:0;display:grid;place-items:center;cursor:pointer}
.pf-vid-play img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.9}
.pf-vid-icon{position:relative;width:68px;height:68px;border-radius:50%;background:var(--orange);color:#000;display:grid;place-items:center;font-size:1.4rem;padding-left:4px;box-shadow:0 10px 24px rgba(0,0,0,.35)}
.pf-vid figcaption{padding:16px 18px 18px}
.pf-vid blockquote{margin:0 0 10px;font:400 1rem/1.5 var(--serif);color:var(--ink)}
.pf-vid cite{display:block;font-style:normal;font-weight:800;color:var(--ink)}
.pf-vid small{color:var(--grey)}

/* ---------- small screens ---------- */
@media (max-width:900px){
  .pf-r-body{grid-template-columns:1fr}
  .pf-r-price{margin-top:0}
}
@media (max-width:640px){
  .kdpbf-pf,.pf-teaser{--u:19px}
  .pf-case{border-width:9px;border-top-width:10px}
  .pf-shelf{padding:18px 16px 6px}
  .pf-unit::before{left:-16px;right:-16px}
  .pf-row{gap:18px}
  .pf-arrows{display:none!important}
  .pf-jump{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;margin-right:-16px}
  .pf-jump a{white-space:nowrap;flex:none}
  .pf-jump span{flex:none}
  .pf-item{width:max(calc(var(--w) * var(--u)), 124px)}
  .pf-reader{margin:6px 8px 18px;padding:16px 14px 18px}
  .pf-r-head{flex-direction:column-reverse}
  .pf-r-close{align-self:flex-end}
  .pf-desk{padding:10px 8px}
  .pf-stage{height:clamp(300px,58vh,480px)}
  .pf-turn button{padding:10px 14px}
}
@media (prefers-reduced-motion:reduce){.pf-bk,.pf-leaf{transition:none}}

/* ---------- theme-proofing ----------
   Themes and Elementor kits style every <button> and <img> (orange fills, borders, padding, height:auto).
   These rules use two classes + !important so the bookshelf looks the same on any theme. */
.kdpbf-pf button.pf-pick,.kdpbf-pf button.pf-pick:hover,.kdpbf-pf button.pf-pick:focus,.kdpbf-pf button.pf-pick:active{
  all:unset!important;box-sizing:border-box!important;display:block!important;width:100%!important;cursor:pointer!important;text-align:left!important;background:none!important;box-shadow:none!important}

.kdpbf-pf .pf-bk img,.kdpbf-pf .pf-pg img,.kdpbf-pf .pf-leaf img{width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:cover!important;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important}
.kdpbf-pf .pf-pg img,.kdpbf-pf .pf-leaf img{object-fit:contain!important;background:#fff}
.kdpbf-pf .pf-cover img{width:auto!important;height:auto!important;max-width:100%!important;max-height:100%!important}
.kdpbf-pf .pf-arrows button.pf-arrow{width:40px!important;height:40px!important;min-height:0!important;padding:0 0 3px!important;margin:0!important;border:2px solid var(--wood)!important;border-radius:50%!important;background:#fff!important;color:var(--wood-dk)!important;font:700 1.4rem/1 var(--sans)!important;box-shadow:none!important;text-transform:none!important;letter-spacing:0!important}
.kdpbf-pf .pf-arrows button.pf-arrow:hover:not(:disabled){background:var(--wood)!important;color:#fff!important}
.kdpbf-pf .pf-views button{height:34px!important;min-height:0!important;padding:0 14px!important;margin:0!important;border:0!important;border-radius:999px!important;background:transparent!important;color:var(--grey)!important;font:700 .88rem/1 var(--sans)!important;box-shadow:none!important;text-transform:none!important;letter-spacing:0!important}
.kdpbf-pf .pf-views button[aria-pressed="true"]{background:var(--ink)!important;color:#fff!important}
.kdpbf-pf .pf-turn button{height:auto!important;min-height:0!important;padding:11px 18px!important;margin:0!important;border:0!important;border-radius:999px!important;background:var(--ink)!important;color:#fff!important;font:700 .92rem/1 var(--sans)!important;box-shadow:none!important;text-transform:none!important;letter-spacing:0!important}
.kdpbf-pf .pf-turn button:disabled{background:rgba(0,0,0,.12)!important;color:rgba(0,0,0,.35)!important}
.kdpbf-pf .pf-r-close{height:auto!important;min-height:0!important;margin:0!important;padding:9px 16px!important;border:2px solid var(--ink)!important;border-radius:999px!important;background:#fff!important;color:var(--ink)!important;font:700 .92rem/1 var(--sans)!important;box-shadow:none!important;text-transform:none!important;letter-spacing:0!important}
.kdpbf-pf .pf-r-close:hover{background:var(--ink)!important;color:#fff!important}
.kdpbf-pf .pf-vid-play{all:unset!important;position:absolute!important;inset:0!important;display:grid!important;place-items:center!important;cursor:pointer!important}
.kdpbf-pf ul.pf-row,.kdpbf-pf li.pf-item{list-style:none!important;margin:0;padding-left:0}
.kdpbf-pf ul.pf-row{margin:0!important;padding:0 2px 14px!important}
.kdpbf-pf li.pf-item::before,.kdpbf-pf li.pf-item::marker{content:none!important}
.kdpbf-pf .pf-jump a{text-decoration:none!important}
.kdpbf-pf .pf-views{display:inline-flex!important;flex-wrap:nowrap!important;align-items:center!important;align-self:start!important;height:42px!important;padding:4px!important;gap:2px!important;width:max-content!important}
.kdpbf-pf .pf-views[hidden],.kdpbf-pf .pf-views button[hidden]{display:none!important}
.kdpbf-pf .pf-r-did ul,.kdpbf-pf .pf-r-did li,.kdpbf-pf .pf-jump{list-style:none!important}
.kdpbf-pf .pf-r-did li::marker{content:none!important}