/* Страница «Поттериана» (/potteriana/) поверх /seo-pages.css: шапка, подвал, .wrap, .primary, .textlink, .eyebrow,
   крошки — общие. Макет: design-archive/2026-10-22/potteriana-page/final2.html. Генератор — tools/lib/potteriana-page.mjs,
   скрипт — potteriana.js. Автор: AlmazNurmukhametov */
.pt-tv{position:relative;background:#101013;border-radius:14px;padding:9px 9px 11px;box-shadow:0 0 0 1px #ffffff14,0 30px 80px #000c}
.pt-tv:after{content:"";position:absolute;left:50%;bottom:-14px;width:120px;height:7px;transform:translateX(-50%);border-radius:0 0 8px 8px;background:#1b1b1f}
.pt-tv video{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:6px;background:#000;object-fit:cover}
.pt-acts{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;margin-top:18px}
.pt-status{font-size:13px;color:#ffc84a;min-height:0}
.pt-status:empty{display:none}

/* первый экран: заголовок, демо-партия и вопрос — три области; на телефоне подряд: заголовок → ТВ → вопрос */
.pt-h{display:grid;grid-template-columns:minmax(0,410px) minmax(0,1fr);grid-template-areas:"t s" "a s";column-gap:48px;align-items:start;padding:6px 0 34px}
.pt-title{grid-area:t}
.pt-title h1{font:400 clamp(32px,3.3vw,48px)/1.04 "Russo One","Golos Text",sans-serif;letter-spacing:-.3px;margin:12px 0}
.pt-lead{color:#cfcad5;font-size:16px;line-height:1.55}
.pt-stage{grid-area:s;padding-top:34px;scroll-margin-top:12px;min-width:0}
.pt-tvcap{display:flex;justify-content:space-between;gap:16px;margin-top:26px;font-size:13px;color:#a9a4b1}
.pt-tvcap b{color:#cfcad5;font-weight:600}
.pt-ask{grid-area:a;margin-top:20px}
.pt-tag{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-size:13px;color:#a9a4b1}
.pt-tag i{width:8px;height:8px;flex:none;border-radius:50%;background:#e5534b;box-shadow:0 0 0 4px #e5534b33;animation:pt-rec 1.6s ease-in-out infinite}
@keyframes pt-rec{50%{opacity:.35}}
.pt-tag b{color:#f5f2ec;font-weight:600}
.pt-q{font:500 20px/1.3 Literata,Georgia,serif;margin-bottom:6px;color:#f5f2ec}
.pt-hint{font-size:14px;color:#a9a4b1;margin-bottom:14px}
.pt-opts{display:grid;gap:8px;transition:opacity .3s}
.pt-opts button{display:flex;gap:12px;align-items:center;min-height:48px;border-radius:12px;border:1px solid #ffffff2e;background:#ffffff0b;padding:9px 14px;text-align:left;font-size:15px;line-height:1.3;transition:border-color .2s,background .2s,opacity .3s}
.pt-opts button b{font:italic 500 16px Literata,Georgia,serif;color:#ffc84a;width:16px;flex:none}
.pt-opts button:hover:not(:disabled){border-color:#ffc84aaa;background:#ffc84a12}
.pt-opts button:disabled{cursor:default}
.pt-opts button.pt-ok{border-color:#7fe0a0;background:#7fe0a01f;color:#f5f2ec}
.pt-opts button.pt-bad{border-color:#f0a093;background:#f0a0931a;color:#f5f2ec}
.pt-opts button.pt-dim{opacity:.45}
.pt-wait .pt-opts{opacity:.45}
.pt-res{margin-top:14px;font-size:15px;color:#cfcad5}
.pt-res:empty{display:none}
.pt-res b{color:#f5f2ec}
.pt-see{display:flex;width:100%;justify-content:center;align-items:center;min-height:50px;margin-top:12px;border-radius:14px;border:1px solid #ffc84a;color:#ffc84a;font-weight:600;background:none}
.pt-skip{font-size:13px;color:#a9a4b1;text-decoration:underline;text-underline-offset:4px;background:none;border:0;padding:6px 0}
.pt-see[hidden],.pt-skip[hidden]{display:none}
@media(max-width:900px){
  .pt-h{grid-template-columns:1fr;grid-template-areas:"t" "s" "a";row-gap:16px;padding-top:0}
  .pt-stage{padding-top:0}
  .pt-title h1{font-size:28px;margin:8px 0 0}
  .pt-lead,.pt-tvcap{display:none}
  .pt-ask{margin-top:6px}
  .pt-q{font-size:18px}
  .pt-tag{margin-bottom:6px}
  .pt-hint{margin-bottom:10px}
}

/* предметы — оглавление глав */
.pt-objs{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:30px 0 0;border-top:1px solid #ffffff1f}
.pt-obj{display:grid;grid-template-rows:110px auto;gap:8px;justify-items:center;align-items:center;text-align:center;padding:10px 6px 14px;border-radius:14px;transition:background .25s}
.pt-obj:hover{background:#ffffff08}
.pt-obj>img{height:110px;width:auto;max-width:100%;object-fit:contain;filter:drop-shadow(0 12px 18px #000a) brightness(.9);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.pt-obj>img.pt-obj-map{height:80px}
.pt-obj:hover>img{transform:translateY(-5px) rotate(-2deg)}
.pt-obj span{font-weight:600;font-size:15px;line-height:1.3}
.pt-obj span b{display:block;font:italic 500 13px Literata,Georgia,serif;color:#ffc84a}
.pt-np{display:block;width:150px;background:#e9dcc0;padding:6px 8px 8px;border-radius:2px;transform:rotate(3deg);box-shadow:0 12px 20px #000a;transition:transform .35s}
.pt-obj:hover .pt-np{transform:rotate(0) translateY(-5px)}
.pt-np img{display:block;width:100%;height:auto}
.pt-np i{display:block;height:46px;margin-top:5px;background:url(/img/editions/hp-goblet-pressPhotoSmall-dragon.webp) center/cover;filter:sepia(.5)}
@media(max-width:700px){.pt-objs{grid-template-columns:repeat(4,minmax(110px,1fr));overflow-x:auto;scrollbar-width:none}.pt-obj{grid-template-rows:80px auto}.pt-obj>img{height:80px}.pt-obj>img.pt-obj-map{height:56px}.pt-np{width:110px}.pt-np i{height:30px}}

/* главы */
.pt-chead{padding:70px 0 0}
.pt-chead h2{font:400 clamp(28px,3.2vw,44px)/1.05 "Russo One","Golos Text",sans-serif;margin-bottom:8px}
.pt-chead p{color:#cfcad5;max-width:600px}
.pt-chap{display:flex;align-items:flex-end;gap:18px;padding:60px 0 16px;scroll-margin-top:16px}
.pt-chap>b{font:italic 400 clamp(52px,6vw,84px)/.8 Literata,Georgia,serif;color:#ffc84a}
.pt-chap span{display:grid;gap:2px;font-weight:600;font-size:18px;padding-bottom:4px;border-bottom:1px solid #ffffff1f;flex:1}
.pt-chap em{font-style:normal;font-weight:400;font-size:14px;color:#a9a4b1;padding-bottom:10px}
.pt-panel{position:relative;width:min(1280px,calc(100% - 80px));margin:0 auto;border-radius:24px;overflow:hidden;box-shadow:0 0 0 1px #ffffff1a,0 30px 70px #0009;padding:44px 0}
.pt-bg{position:absolute;inset:0;background:center/cover;filter:brightness(.3)}
.pt-pgrid{position:relative;width:calc(100% - 88px);margin:auto;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr);gap:40px;align-items:center}
.pt-ptext{border-radius:18px;padding:26px 26px 28px;background:#0b0b10c9;border:1px solid #ffffff14;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.pt-mech{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.3px;padding:4px 10px;border-radius:20px;background:#ffc84a22;color:#ffc84a;margin-bottom:14px}
.pt-ptext h2{margin-bottom:12px}
.pt-ptext p{color:#cfcad5;font-size:15px;margin-bottom:12px}
.pt-ptext p b{color:#f5f2ec;font-weight:600}
.pt-ptext .pt-meta{font-size:13px;color:#a9a4b1;margin-bottom:4px}
.pt-vcap{margin-top:22px;font-size:12px;color:#a9a4b1}
.pt-p1 h2{font:400 clamp(26px,2.6vw,36px)/1.08 "Russo One","Golos Text",sans-serif;color:#f3e3c0}
.pt-p2 h2{font:400 clamp(40px,4vw,58px)/1 "Great Vibes",cursive;color:#e8dcc2}
.pt-p3{background:#2a2016}
.pt-p3 .pt-bg{background-image:url(/img/editions/hp-azkaban-mapPaper.webp);filter:brightness(.92) sepia(.15)}
.pt-p3 .pt-ptext{background:#f3e6c8e6;border-color:#4a352333}
.pt-p3 h2{font:italic 600 clamp(28px,2.8vw,40px)/1.05 Literata,Georgia,serif;color:#3a2614}
.pt-p3 .pt-ptext p,.pt-p3 .pt-ptext .pt-meta{color:#4a3523}.pt-p3 .pt-ptext p b{color:#2a1a0c}
.pt-p3 .pt-mech{background:#3a26141a;color:#7a4b1d}
.pt-p3 .primary{background:#3a2614;color:#f6ead2}.pt-p3 .textlink,.pt-p3 .pt-vcap{color:#4a3523}
.pt-p4{background:#e7d9bb}
.pt-p4 .pt-bg{background:linear-gradient(#e9dcc0,#d9c8a4);filter:none}
.pt-p4 .pt-ptext{background:transparent;border:0;padding:0;-webkit-backdrop-filter:none;backdrop-filter:none}
.pt-mast{display:block;width:min(360px,100%);height:auto;margin:0 0 8px;mix-blend-mode:multiply}
.pt-p4 h2{font:700 clamp(22px,2.2vw,30px)/1.15 Literata,Georgia,serif;color:#241a12;border-top:2px solid #241a12;border-bottom:1px solid #241a12;padding:8px 0}
.pt-p4 .pt-ptext p,.pt-p4 .pt-ptext .pt-meta{color:#3d3024}.pt-p4 .pt-ptext p b{color:#1a120b}
.pt-p4 .pt-mech{background:#7d1f1418;color:#7d1f14}
.pt-p4 .primary{background:#241a12;color:#f3e8d0}.pt-p4 .textlink,.pt-p4 .pt-vcap{color:#3d3024}
.pt-p3 .pt-status,.pt-p4 .pt-status{color:#7d1f14}
@media(max-width:900px){.pt-panel{width:calc(100% - 24px);padding:20px 0;border-radius:18px}.pt-pgrid{grid-template-columns:1fr;gap:20px;width:calc(100% - 28px)}.pt-pgrid>div:last-child{order:-1}.pt-ptext{padding:18px}.pt-chap{padding-top:44px}}

.pt-end{padding:60px 0 10px;text-align:center}
.pt-end h2{font:400 clamp(28px,3vw,42px)/1.1 "Russo One","Golos Text",sans-serif;margin-bottom:12px}
.pt-end>p{color:#cfcad5;margin-bottom:6px}
.pt-end .pt-acts{justify-content:center}
.pt-note{font-size:12px;color:#a9a4b1;margin-top:22px}
@media(prefers-reduced-motion:reduce){.pt-tag i{animation:none}.pt-obj>img,.pt-np,.pt-opts button{transition:none}}
