/* «Отзывы» (/otzyvy/): книга отзывов во всю страницу.
   Сверху - четыре аптечные мензурки рейтингов (движок fx/menz.js, запуск js/otzyvy.js). Ниже - развороты книги отзывов:
   каждый .otz-list - разворот (на телефоне - один лист), бумага разлинована, отзывы записаны по строкам, дата - оттиск
   датера стилями (без движка), имя организации - оттиск её штампа. Внизу - чистый лист с пером и окно отзыва тем же листом.
   Длинная страница лёгкая: у отзыва нет ни тени, ни фильтра, ни своего слоя; тень и переплёт - одна на разворот.
   Строка листа - --lh (целое число px): высота каждого отзыва кратна ей, поэтому линовка совпадает со строками текста. */

.pg-otzyvy{--lh:30px;--ro:26px;--pen-a:#1a1005;--pen-b:#1b2242;--pen-c:#3a2410;--stamp:#7a2416;--stamp-org:#2a2f66;
  --rule:rgba(74,47,20,.22);--mline:rgba(138,31,22,.34);--wf:200px;--wq:210px;
  --page:linear-gradient(100deg,#e3d3a8 0%,#ebdcb8 14%,#f0e3c2 55%,#e7d7ae 100%);
  --ruled:repeating-linear-gradient(180deg,rgba(0,0,0,0) 0,rgba(0,0,0,0) calc(var(--ro) - 1px),var(--rule) calc(var(--ro) - 1px),var(--rule) var(--ro),rgba(0,0,0,0) var(--ro),rgba(0,0,0,0) var(--lh));
  --quill:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 340 240'%3E%3Cdefs%3E%3ClinearGradient id='g' gradientUnits='userSpaceOnUse' x1='232' y1='104' x2='186' y2='192'%3E%3Cstop offset='0' stop-color='%23b9a67c'/%3E%3Cstop offset='.3' stop-color='%23efe5c9'/%3E%3Cstop offset='.43' stop-color='%23fdf8ea'/%3E%3Cstop offset='.62' stop-color='%23eadfc2'/%3E%3Cstop offset='1' stop-color='%23a8946a'/%3E%3C/linearGradient%3E%3CclipPath id='c'%3E%3Cpath d='M85 63 C105 62 125 68 142 76 C152 81 162 86 172 91 L171 106 L186 97 C200 104 212 111 223 117 C240 126 254 137 266 148 L263 162 L277 158 C284 166 289 171 293 176 C306 192 318 208 326 222 C304 224 282 222 264 217 C250 213 238 208 228 204 L231 188 L214 197 C206 193 200 190 194 186 L207 166 L184 179 C158 159 135 135 116 115 C104 101 93 80 85 63 Z'/%3E%3C/clipPath%3E%3C/defs%3E%3Cpath d='M85 63 C105 62 125 68 142 76 C152 81 162 86 172 91 L171 106 L186 97 C200 104 212 111 223 117 C240 126 254 137 266 148 L263 162 L277 158 C284 166 289 171 293 176 C306 192 318 208 326 222 C304 224 282 222 264 217 C250 213 238 208 228 204 L231 188 L214 197 C206 193 200 190 194 186 L207 166 L184 179 C158 159 135 135 116 115 C104 101 93 80 85 63 Z' transform='translate(7 10)' fill='%231c1206' fill-opacity='.3'/%3E%3Cpath d='M85 63 C105 62 125 68 142 76 C152 81 162 86 172 91 L171 106 L186 97 C200 104 212 111 223 117 C240 126 254 137 266 148 L263 162 L277 158 C284 166 289 171 293 176 C306 192 318 208 326 222 C304 224 282 222 264 217 C250 213 238 208 228 204 L231 188 L214 197 C206 193 200 190 194 186 L207 166 L184 179 C158 159 135 135 116 115 C104 101 93 80 85 63 Z' fill='url(%23g)' stroke='%236b5530' stroke-width='.9' stroke-linejoin='round'/%3E%3Cg clip-path='url(%23c)'%3E%3Cpath d='M90.8 66.7 L105.5 71.6M90.8 66.7 L104.4 80.5M96.2 70.3 L114.1 70.4M96.2 70.3 L105.5 90.7M101.6 73.9 L121.4 71.1M101.6 73.9 L108.2 98.4M107.0 77.4 L128.5 72.2M107.0 77.4 L111.3 105.5M112.5 81.0 L135.4 73.5M112.5 81.0 L114.7 112.1M117.9 84.6 L142.1 75.1M117.9 84.6 L118.3 118.5M123.3 88.2 L148.8 76.8M123.3 88.2 L122.0 124.7M128.7 91.8 L155.3 78.7M128.7 91.8 L125.9 130.6M134.2 95.3 L161.8 80.8M134.2 95.3 L129.9 136.3M139.6 98.9 L168.1 82.9M139.6 98.9 L134.0 141.9M145.0 102.5 L174.4 85.2M145.0 102.5 L138.2 147.3M150.4 106.1 L180.6 87.7M150.4 106.1 L142.5 152.5M155.9 109.7 L186.7 90.2M155.9 109.7 L147.0 157.6M161.3 113.2 L192.7 92.9M161.3 113.2 L151.5 162.5M166.7 116.8 L198.7 95.6M166.7 116.8 L156.2 167.2M172.1 120.4 L204.6 98.5M172.1 120.4 L161.0 171.8M177.6 124.0 L210.3 101.6M177.6 124.0 L165.9 176.2M183.0 127.6 L216.1 104.7M183.0 127.6 L170.9 180.4M188.4 131.2 L221.7 108.0M188.4 131.2 L176.0 184.5M193.8 134.7 L227.2 111.4M193.8 134.7 L181.2 188.4M199.3 138.3 L232.7 114.9M199.3 138.3 L186.5 192.2M204.7 141.9 L238.1 118.5M204.7 141.9 L191.9 195.7M210.1 145.5 L243.4 122.3M210.1 145.5 L197.4 199.2M215.5 149.1 L248.7 126.1M215.5 149.1 L203.1 202.4M221.0 152.6 L253.8 130.1M221.0 152.6 L208.8 205.5M226.4 156.2 L258.9 134.2M226.4 156.2 L214.7 208.4M231.8 159.8 L263.9 138.5M231.8 159.8 L220.7 211.2M237.2 163.4 L268.8 142.8M237.2 163.4 L226.7 213.8M242.7 167.0 L273.6 147.3M242.7 167.0 L232.9 216.2M248.1 170.6 L278.4 151.9M248.1 170.6 L239.2 218.5M253.5 174.1 L283.1 156.6M253.5 174.1 L245.6 220.6M258.9 177.7 L287.6 161.4M258.9 177.7 L252.1 222.5M264.4 181.3 L292.2 166.4M264.4 181.3 L258.7 224.3M269.8 184.9 L296.6 171.5M269.8 184.9 L265.5 225.9M275.2 188.5 L300.9 176.7M275.2 188.5 L272.3 227.3M280.6 192.0 L305.1 182.1M280.6 192.0 L279.3 228.5M286.1 195.6 L309.3 187.7M286.1 195.6 L286.4 229.6M291.5 199.2 L313.3 193.4M291.5 199.2 L293.7 230.3M296.9 202.8 L317.1 199.4M296.9 202.8 L301.1 230.8M302.3 206.4 L320.7 205.8M302.3 206.4 L308.9 230.9M307.7 209.9 L323.6 213.2M307.7 209.9 L317.0 230.4M313.2 213.5 L327.9 218.5M313.2 213.5 L326.7 227.5' fill='none' stroke='%237a643c' stroke-opacity='.42' stroke-width='.7'/%3E%3C/g%3E%3Cpath d='M14.0 16.0 L27.0 21.8 L94.8 66.1 L322.9 219.4 L322.4 220.2 L91.8 70.6 L24.4 25.6 Z' fill='%23e9dcb8' stroke='%236b5530' stroke-width='.7' stroke-linejoin='round'/%3E%3Cpath d='M14.0 16.0 L27.0 21.8 L28.2 25.4 L24.4 25.6 Z' fill='%231c1206'/%3E%3Cpath d='M15.3 16.8 L34.0 29.2' stroke='%231c1206' stroke-width='.8' fill='none'/%3E%3C/svg%3E");
  --flourish:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 34' fill='none' stroke='%232a1a08' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 21 C36 6 70 6 98 17 C116 24 130 29 147 23 C160 18 160 6 149 7 C137 9 141 26 162 26 C204 26 242 5 295 12' stroke-width='1.7'/%3E%3Cpath d='M40 25 C62 31 88 31 108 26 M196 15 C216 8 240 6 262 9' stroke-width='.8' stroke-opacity='.65'/%3E%3C/svg%3E");}

/* ---------- рейтинги: аптечные мензурки (разметка и стили - fx/menz_demo.html; названием площадки остаётся её логотип, как у них) ----------
   Без скрипта стекло и уровень рисуют ::before/::after по --v (= оценка/5); с модулем они прячутся (.menz-live). */
.pg-otzyvy .sec-rates{padding-bottom:clamp(30px,5vw,56px)}
.pg-otzyvy .sec-rates .sec-h{margin-bottom:0}
.pg-otzyvy .menzs{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 10px;margin-top:22px}
.pg-otzyvy .menzs>li:last-child:nth-child(odd){grid-column:1/-1;justify-self:center;width:calc(50% - 5px)}      /* площадок три: третья стоит по центру под двумя */
.pg-otzyvy .menz{display:flex;flex-direction:column;align-items:center;color:inherit;text-decoration:none}
.pg-otzyvy .menz-glass{position:relative;display:block;width:100%;height:clamp(210px,56vw,250px)}
.pg-otzyvy .menz-glass::before{content:"";position:absolute;left:50%;top:13%;bottom:26%;width:24%;transform:translateX(-50%);
  border:1px solid rgba(241,232,210,.55);border-top-color:rgba(241,232,210,.3);border-radius:0 0 3px 3px}
.pg-otzyvy .menz-glass::after{content:"";position:absolute;left:50%;bottom:calc(26% + 1px);width:calc(24% - 2px);height:calc(3% + var(--v,0) * 49%);transform:translateX(-50%);
  background-color:#9a6f28;
  background-image:radial-gradient(#fbe3a1 .6px,transparent 1.1px),radial-gradient(#c98d2f .7px,transparent 1.2px),radial-gradient(#f0be62 .6px,transparent 1.1px);
  background-size:4px 4px,5px 5px,3px 3px;background-position:0 0,2px 1px,1px 2px}
.pg-otzyvy .menz-glass.menz-live::before,.pg-otzyvy .menz-glass.menz-live::after{content:none}
.pg-otzyvy .menz-label{position:relative;display:block;width:min(150px,86%);margin-top:-2px;padding:11px 8px 8px;text-align:center;color:var(--ink);
  background:linear-gradient(175deg,#efe1bd 0%,#e4d3a8 62%,#d8c595 100%);transition:filter .3s}
.pg-otzyvy .menz-label::after{content:"";position:absolute;inset:4px;border:1px solid rgba(90,58,30,.34);pointer-events:none}
.pg-otzyvy .menz-logo{display:block;height:19px;width:auto;max-width:74%;margin:0 auto 5px;object-fit:contain;filter:grayscale(1) brightness(.42) contrast(1.9);opacity:.9;mix-blend-mode:multiply}      /* знак площадки одной краской, как оттиск на этикетке - так же, как в этом блоке на главной */
.pg-otzyvy .menz-word{display:block;font-family:var(--text);font-weight:400;font-style:italic;font-size:.86rem;line-height:1.2;letter-spacing:.06em;color:#5a3a1e;margin:0}
.pg-otzyvy .menz-num{display:block;font-family:var(--serif);font-weight:500;font-size:1.9rem;line-height:1;color:#2a1c0a;margin-top:2px}
.pg-otzyvy .menz:hover .menz-label{filter:brightness(1.06)}

/* ---------- книга отзывов ---------- */
.pg-otzyvy .sec-otz{isolation:isolate}                                         /* переплёт (::before, z-index:-1) остаётся внутри раздела */
.pg-otzyvy .sec-otz .sec-h3{margin-bottom:calc(var(--lh) + 2px)}
/* лист (телефон): корешок слева, поля и красная черта, срез страниц справа и снизу, под листом - кожаный переплёт */
.pg-otzyvy .otz-list{position:relative;display:block;columns:auto;max-width:720px;margin:0 auto calc(var(--lh) + 22px);padding:calc(var(--lh) * 2) 15px calc(var(--lh) * 2) 37px;color:var(--pen-a);
  background:
    linear-gradient(90deg,rgba(40,26,8,.36) 0,rgba(40,26,8,.1) 9px,rgba(40,26,8,0) 24px),
    linear-gradient(var(--mline),var(--mline)) 26px 0/1px 100% no-repeat,
    linear-gradient(var(--mline),var(--mline)) 29px 0/1px 100% no-repeat,
    var(--ruled) 0 var(--lh)/100% calc(100% - var(--lh) * 2) no-repeat,
    var(--page);
  box-shadow:2px 2px 0 #dccb9d,3px 3px 0 #8f7d55,5px 5px 0 #e3d3a8,6px 6px 0 #8f7d55,8px 8px 0 #d6c594,9px 9px 0 #7b6943}
.pg-otzyvy .otz-list::before{content:"";position:absolute;z-index:-1;left:-8px;right:-17px;top:-8px;bottom:-18px;border-radius:2px 5px 5px 2px;
  background:linear-gradient(90deg,#2b0d0a 0,#4a1611 12px,#5c1c15 50%,#4a1611 100%);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.55),inset 0 0 0 3px #4a1611,inset 0 0 0 4px rgba(217,179,99,.5),0 14px 22px rgba(0,0,0,.45)}
.pg-otzyvy .otz-list[data-total]::after{content:"";position:absolute;left:68%;top:calc(100% - 1px);width:15px;height:50px;pointer-events:none;
  background:linear-gradient(90deg,#5e130f 0,#9a2a1f 38%,#7a1b14 70%,#560f0c 100%);clip-path:polygon(0 0,100% 0,100% 100%,50% calc(100% - 9px),0 100%);transform:rotate(3deg);transform-origin:50% 0}      /* ляссе */
/* запись: штемпель даты и звёзды - одна строка листа, ниже текст; между записями - пустая строка */
.pg-otzyvy .otz{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:5px;align-items:center;margin:0;padding:0 0 var(--lh);background:none;box-shadow:none;color:var(--pen,var(--pen-a));break-inside:avoid;page-break-inside:avoid;-webkit-column-break-inside:avoid}
.pg-otzyvy .otz:nth-child(3n+2){--pen:var(--pen-b)}                           /* разные посетители - разные чернила */
.pg-otzyvy .otz:nth-child(4n+3){--pen:var(--pen-c)}
.pg-otzyvy .otz-date{grid-column:1;display:flex;align-items:center;height:var(--lh);margin:0;padding-right:7px;font-size:1rem;letter-spacing:0;color:var(--stamp)}
.pg-otzyvy .otz-date time{display:block;padding:0 6px 0 9px;font:700 .86rem/21px var(--text);letter-spacing:.16em;white-space:nowrap;border:1.5px solid currentColor;border-radius:1px;outline:1px solid currentColor;outline-offset:1.5px;opacity:.82;transform:rotate(-1.6deg)}
.pg-otzyvy .otz:nth-child(2n) .otz-date time{transform:rotate(1.2deg) translateX(3px)}       /* оттиски ложатся неровно и с разной силой */
.pg-otzyvy .otz:nth-child(3n) .otz-date time{transform:rotate(-2.6deg) translateY(1px);opacity:.68}
.pg-otzyvy .otz:nth-child(5n) .otz-date time{transform:rotate(.5deg) translateX(1px);opacity:.92}
.pg-otzyvy .otz-stars{grid-column:2;height:var(--lh);margin:0;font-size:1.02rem;line-height:var(--lh);letter-spacing:.14em;color:#8a4b12;white-space:nowrap;overflow:hidden}
.pg-otzyvy .otz-t{grid-column:1/-1;margin:0;font:italic 500 1.38rem/var(--lh) var(--serif);letter-spacing:.005em;overflow-wrap:break-word}
.pg-otzyvy .otz-who{grid-column:1/-1;justify-self:start;margin:0;font:600 1.3rem/var(--lh) var(--serif);letter-spacing:.01em;color:var(--pen,var(--pen-a));overflow-wrap:break-word}
/* запись без даты (группа, школа): сверху оттиск штампа организации */
.pg-otzyvy .otz:not(:has(.otz-date)) .otz-who{position:relative;padding:0 11px;font:700 .86rem/var(--lh) var(--text);letter-spacing:.09em;color:var(--stamp-org);opacity:.84;transform:rotate(-1.1deg)}
.pg-otzyvy .otz:not(:has(.otz-date)) .otz-who::before{content:"";position:absolute;inset:3px 0;border:1.5px solid currentColor;border-radius:1px;outline:1px solid currentColor;outline-offset:1.5px}
.pg-otzyvy .otz:not(:has(.otz-date)):nth-child(2n) .otz-who{transform:rotate(.9deg)}
.pg-otzyvy .otz:not(:has(.otz-date)) .otz-stars{grid-column:1/-1}
/* свёрнутые развороты и кнопка */
.pg-otzyvy .more{margin-top:0}
.pg-otzyvy .sec-otz .more-act{margin-top:6px}

/* ---------- «Посещали наш музей?»: чистый лист книги и перо ---------- */
.pg-otzyvy .sec-otz-add{overflow:hidden;padding-top:clamp(18px,3vw,34px);padding-bottom:clamp(40px,6vw,70px)}
@supports (overflow:clip){.pg-otzyvy .sec-otz-add{overflow:visible;overflow-x:clip}}
.pg-otzyvy .otz-blank{position:relative;max-width:720px;margin:0 auto;padding:calc(var(--lh) * 1.5) 16px calc(var(--lh) * 1.5) 37px;color:var(--pen-a);
  background:
    linear-gradient(90deg,rgba(40,26,8,.3) 0,rgba(40,26,8,.08) 9px,rgba(40,26,8,0) 24px),
    linear-gradient(var(--mline),var(--mline)) 26px 0/1px 100% no-repeat,
    linear-gradient(var(--mline),var(--mline)) 29px 0/1px 100% no-repeat,
    var(--page);
  box-shadow:2px 2px 0 #dccb9d,3px 3px 0 #8f7d55,0 20px 36px rgba(0,0,0,.5)}
.pg-otzyvy .otz-blank .sec-h3{position:relative;margin:0;color:#160d04;font-size:clamp(1.62rem,6.2vw,2.5rem);line-height:1.14}
/* росчерк под заголовком: рисуется слева направо, перо ведёт его остриём и остаётся лежать на листе */
.pg-otzyvy .otz-blank .sec-h3::after{content:"";display:block;width:var(--wf);height:calc(var(--wf) * .1133);margin:12px auto 0;background:var(--flourish) 0 0/100% 100% no-repeat;transition:clip-path 1.7s cubic-bezier(.45,.05,.3,1);clip-path:inset(-4px 0 -4px 0)}
.pg-otzyvy .otz-blank .sec-h3::before{content:"";position:absolute;z-index:2;left:calc(50% + var(--wf) * .483 - var(--wq) * .041);top:calc(100% - var(--wf) * .0737 - var(--wq) * .0471);width:var(--wq);height:calc(var(--wq) * .7059);
  background:var(--quill) 0 0/100% 100% no-repeat;pointer-events:none;transform-origin:4.1% 6.7%;transition:transform 1.7s cubic-bezier(.45,.05,.3,1);
  transform:translate(0,0) rotate(7deg) scaleX(-1)}                     /* телефон: перо отражено и лежит на пустых строках листа, за край экрана не уходит */
.js .pg-otzyvy .sec-otz-add:not(.in) .sec-h3::after{clip-path:inset(-4px 100% -4px 0)}
.js .pg-otzyvy .sec-otz-add:not(.in) .sec-h3::before{transform:translate(calc(var(--wf) * -.966),-5px) rotate(1deg) scaleX(-1)}
.pg-otzyvy .otz-blank .act{margin:0}
.pg-otzyvy .otz-blank .act::before{content:"";display:block;height:calc(var(--lh) * 3);margin:2px 0 calc(var(--lh) - 4px);background:var(--ruled)}      /* пустые строки - место для записи */
.pg-otzyvy .otz-blank .btn{background:#2a1a08;color:#f1e8d2;border-color:#2a1a08;font-weight:400}
.pg-otzyvy .otz-blank .btn:hover{background:#4a2f14;border-color:#4a2f14;color:#f1e8d2}

/* ---------- окно отзыва: тот же лист книги; пишут по линейкам, оценку ставят звёздами ---------- */
.pg-otzyvy #m-otzyv .modal-box{max-width:600px;padding:calc(var(--lh) * 1.2) 18px calc(var(--lh) * 1.2) 40px;color:var(--pen-a);
  background:
    linear-gradient(90deg,rgba(40,26,8,.3) 0,rgba(40,26,8,.08) 9px,rgba(40,26,8,0) 24px),
    linear-gradient(var(--mline),var(--mline)) 27px 0/1px 100% no-repeat,
    linear-gradient(var(--mline),var(--mline)) 30px 0/1px 100% no-repeat,
    var(--page);
  box-shadow:2px 2px 0 #dccb9d,3px 3px 0 #8f7d55,5px 5px 0 #e3d3a8,6px 6px 0 #8f7d55,0 26px 50px rgba(0,0,0,.6)}
.pg-otzyvy #m-otzyv .modal-box::after{display:none}
.pg-otzyvy #m-otzyv .modal-note{margin-bottom:calc(var(--lh) * .5);font-style:italic;font-size:1rem;line-height:1.4;color:#4a2f14}
.pg-otzyvy #m-otzyv .frm{gap:0}
.pg-otzyvy #m-otzyv .f{margin-bottom:calc(var(--lh) * .5)}
.pg-otzyvy #m-otzyv .f>.ic{left:0;top:calc(var(--lh) * .5 - 4px);color:#6b4a1c}
.pg-otzyvy #m-otzyv p.f:nth-of-type(3)>.ic{top:3px}
.pg-otzyvy #m-otzyv .f:has(textarea)>.ic{top:3px}
.pg-otzyvy #m-otzyv .f input,.pg-otzyvy #m-otzyv .f textarea{padding:calc(var(--lh) * .5 - 8px) 8px calc(var(--lh) * .5 - 9px) 30px;border:0;border-bottom:1px solid rgba(74,47,20,.5);background-color:rgba(0,0,0,0);
  font:italic 500 1.38rem/var(--lh) var(--serif);color:var(--pen-b)}
.pg-otzyvy #m-otzyv .f textarea{min-height:calc(var(--lh) * 5 + 1px);padding-top:0;padding-bottom:0;border-bottom:0;background-image:var(--ruled);background-attachment:local;resize:vertical}
.pg-otzyvy #m-otzyv .f input::placeholder,.pg-otzyvy #m-otzyv .f textarea::placeholder{color:#6b5632;opacity:1}
.pg-otzyvy #m-otzyv .f input:focus,.pg-otzyvy #m-otzyv .f textarea:focus{outline:1px dashed #5a3a1e;outline-offset:3px;border-color:#2a1a08}
.pg-otzyvy #m-otzyv .f.bad input,.pg-otzyvy #m-otzyv .f.bad textarea{border-color:#8a1f16;background-color:rgba(138,31,22,.07)}
.pg-otzyvy #m-otzyv .stars{margin:calc(var(--lh) * .3) 0 calc(var(--lh) * .5)}
.pg-otzyvy #m-otzyv .stars legend{font-style:italic;font-size:1.04rem;color:#4a2f14;margin-bottom:2px}
.pg-otzyvy #m-otzyv .agree{margin-bottom:8px}
.pg-otzyvy #m-otzyv .agree-note{margin:0 0 14px}
.pg-otzyvy #m-otzyv .frm-msg{margin-bottom:12px}
/* оценка: пять звёзд в ряд. Цифра остаётся подписью для чтения с экрана, кружок выбора прозрачен и лежит поверх звезды */
.js .pg-otzyvy #m-otzyv .stars{gap:0 2px}
.js .pg-otzyvy #m-otzyv .stars label{position:relative;gap:0;padding:0 3px;font-size:0}
.js .pg-otzyvy #m-otzyv .stars input{position:absolute;inset:0;width:100%;height:100%;margin:0;border:0;border-radius:0;background:none;opacity:0}
.js .pg-otzyvy #m-otzyv .stars b{display:block;font-size:2.3rem;line-height:1.15;color:rgba(0,0,0,0);-webkit-text-stroke:1.2px #8a4b12;transition:color .18s}
.js .pg-otzyvy #m-otzyv .stars[data-v="1"] label:nth-of-type(-n+1) b,
.js .pg-otzyvy #m-otzyv .stars[data-v="2"] label:nth-of-type(-n+2) b,
.js .pg-otzyvy #m-otzyv .stars[data-v="3"] label:nth-of-type(-n+3) b,
.js .pg-otzyvy #m-otzyv .stars[data-v="4"] label:nth-of-type(-n+4) b,
.js .pg-otzyvy #m-otzyv .stars[data-v="5"] label:nth-of-type(-n+5) b{color:#8a4b12}
.js .pg-otzyvy #m-otzyv .stars input:focus-visible+span b{outline:2px solid #5a3a1e;outline-offset:2px}
.js .pg-otzyvy #m-otzyv .stars label:hover b{-webkit-text-stroke-color:#5b1d0e}

@media (min-width:700px){
  .pg-otzyvy .menzs{grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 24px;margin-top:30px;max-width:860px;margin-left:auto;margin-right:auto}
  .pg-otzyvy .menzs>li:last-child:nth-child(odd){grid-column:auto;justify-self:stretch;width:auto}
  .pg-otzyvy .menz-glass{height:clamp(270px,23vw,330px)}
  .pg-otzyvy .menz-label{width:min(164px,88%);padding:13px 10px 10px}
  .pg-otzyvy .menz-logo{height:21px}
  .pg-otzyvy .menz-num{font-size:2.1rem}
  .pg-otzyvy{--wf:280px;--wq:200px}
  .pg-otzyvy .otz-blank .sec-h3::before{transform:translate(0,0) rotate(0deg) scaleX(1)}             /* шире телефона перо лежит наискось, остриём к концу росчерка; на планшете целиком на листе */
  .js .pg-otzyvy .sec-otz-add:not(.in) .sec-h3::before{transform:translate(calc(var(--wf) * -.966),-5px) rotate(-5deg) scaleX(1)}
  .pg-otzyvy .otz-list{padding-left:52px;padding-right:30px;
    background:
      linear-gradient(90deg,rgba(40,26,8,.36) 0,rgba(40,26,8,.1) 9px,rgba(40,26,8,0) 24px),
      linear-gradient(var(--mline),var(--mline)) 37px 0/1px 100% no-repeat,
      linear-gradient(var(--mline),var(--mline)) 40px 0/1px 100% no-repeat,
      var(--ruled) 0 var(--lh)/100% calc(100% - var(--lh) * 2) no-repeat,
      var(--page)}
  .pg-otzyvy .otz-blank{padding:calc(var(--lh) * 1.5) 40px calc(var(--lh) * 1.5) 60px;
    background:
      linear-gradient(90deg,rgba(40,26,8,.3) 0,rgba(40,26,8,.08) 9px,rgba(40,26,8,0) 24px),
      linear-gradient(var(--mline),var(--mline)) 37px 0/1px 100% no-repeat,
      linear-gradient(var(--mline),var(--mline)) 40px 0/1px 100% no-repeat,
      var(--page)}
  .pg-otzyvy #m-otzyv .modal-box{padding:calc(var(--lh) * 1.4) 40px calc(var(--lh) * 1.4) 62px;
    background:
      linear-gradient(90deg,rgba(40,26,8,.3) 0,rgba(40,26,8,.08) 9px,rgba(40,26,8,0) 24px),
      linear-gradient(var(--mline),var(--mline)) 39px 0/1px 100% no-repeat,
      linear-gradient(var(--mline),var(--mline)) 42px 0/1px 100% no-repeat,
      var(--page)}
}
/* ПК: разворот - две страницы, посередине сгиб; срез страниц с обеих сторон и снизу */
@media (min-width:900px){
  .pg-otzyvy .sec-rates{padding-top:16px}
  .pg-otzyvy .menzs{margin-top:8px}
  .pg-otzyvy .menz-glass{height:clamp(250px,21vw,300px)}
}
@media (min-width:980px){
  .pg-otzyvy{--lh:32px;--ro:28px;--wq:300px}             /* на широком экране перо крупнее и свешивается за край листа */
  .pg-otzyvy .otz-list{max-width:none;columns:2;column-gap:96px;column-fill:balance;padding:calc(var(--lh) * 2) 52px;margin-bottom:calc(var(--lh) + 30px);
    background:
      linear-gradient(90deg,rgba(40,26,8,0) calc(50% - 60px),rgba(255,251,236,.36) calc(50% - 38px),rgba(40,26,8,.1) calc(50% - 13px),rgba(40,26,8,.48) calc(50% - .5px),rgba(40,26,8,.48) calc(50% + .5px),rgba(40,26,8,.1) calc(50% + 13px),rgba(255,251,236,.36) calc(50% + 38px),rgba(40,26,8,0) calc(50% + 60px)),
      linear-gradient(var(--mline),var(--mline)) 37px 0/1px 100% no-repeat,
      linear-gradient(var(--mline),var(--mline)) 40px 0/1px 100% no-repeat,
      linear-gradient(var(--mline),var(--mline)) calc(50% + 33px) 0/1px 100% no-repeat,
      linear-gradient(var(--mline),var(--mline)) calc(50% + 36px) 0/1px 100% no-repeat,
      var(--ruled) 0 var(--lh)/100% calc(100% - var(--lh) * 2) no-repeat,
      linear-gradient(90deg,#e0cfa2 0%,#ebdcb8 9%,#f1e5c5 44%,#f1e5c5 56%,#ebdcb8 91%,#e0cfa2 100%);
    box-shadow:2px 2px 0 #dccb9d,-2px 2px 0 #dccb9d,3px 3px 0 #8f7d55,-3px 3px 0 #8f7d55,5px 5px 0 #e3d3a8,-5px 5px 0 #e3d3a8,6px 6px 0 #8f7d55,-6px 6px 0 #8f7d55,8px 8px 0 #d6c594,-8px 8px 0 #d6c594,9px 9px 0 #7b6943,-9px 9px 0 #7b6943}
  .pg-otzyvy .otz-list::before{left:-18px;right:-18px;top:-9px;bottom:-19px;border-radius:5px;
    background:linear-gradient(90deg,#4a1611 0,#5c1c15 18%,#5c1c15 46%,#2b0d0a 50%,#5c1c15 54%,#5c1c15 82%,#4a1611 100%)}
  .pg-otzyvy .otz-list[data-total]::after{left:calc(50% - 7px)}
  .pg-otzyvy .otz-t{font-size:1.46rem}
  .pg-otzyvy .otz-who{font-size:1.36rem}
  .pg-otzyvy .otz-stars{font-size:1.12rem}
  .pg-otzyvy #m-otzyv .modal-box{max-width:640px}
}
