/* Фермерский портал 2026 — single-auto.css (статья, задача 06b): оценка, «Поделиться», карточка автора,
   «Есть вопрос?», комментарии, «Читайте также», нижняя панель телефона. Макет: design/pages/statya.html,
   phone-statya.html. Токены — main.css. */

/* ---------- «Статья помогла?» + «Поделиться» (одна серая карточка, если идут подряд) ---------- */
.sgl-rate,.sgl-share{background:var(--mist);border-radius:30px;padding:22px 26px}
.sgl-rate{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px}
.sgl-rate__t{font-size:20px;font-weight:600;line-height:1.3}
.sgl-rate__r{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
.sgl-rate__stars{display:flex}
.star{width:44px;height:44px;border:0;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;border-radius:12px;color:var(--ink)}
.star path{fill:#fff;stroke:var(--ink);stroke-width:1.6;stroke-linejoin:round;transition:fill .15s ease}
.star.on path{fill:var(--acc)}
.sgl-rate:not(.is-done) .sgl-rate__stars:hover .star path{fill:var(--acc)}
.sgl-rate:not(.is-done) .sgl-rate__stars .star:hover~.star path{fill:#fff}
.star:focus-visible{outline:2px solid var(--leaf);outline-offset:0}
.star:disabled{cursor:default}
.sgl-rate__msg{font-size:12px;color:var(--muted)}
.sgl-rate__msg:empty{display:none}

.sgl-share{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.sgl-share__t{font-size:15px;font-weight:600;margin-right:6px}
.shr{display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:14.5px;font-weight:600;cursor:pointer;color:var(--ink)}
.shr:hover{border-color:var(--ink)}
.shr:focus-visible{outline:2px solid var(--leaf);outline-offset:1px}
.sgl-share__msg{flex-basis:100%;font-size:12px;color:var(--muted)}
.sgl-share__msg:empty{display:none}

.sgl-rate:has(+.sgl-share){border-bottom-left-radius:0;border-bottom-right-radius:0;padding-bottom:16px}
.sgl-rate+.sgl-share{position:relative;margin-top:-24px;border-top-left-radius:0;border-top-right-radius:0;padding-top:17px}
.sgl-rate+.sgl-share::before{content:"";position:absolute;left:26px;right:26px;top:0;border-top:1px solid var(--line)}

/* ---------- Карточка автора ---------- */
.sgl-acard{display:flex;flex-wrap:wrap;gap:18px;align-items:center;border:1px solid var(--line);border-radius:30px;padding:20px 24px}
.sgl-after>.sgl-acard{margin-top:-8px}
.sgl-acard .sgl-ava{width:84px;height:84px}
.sgl-acard .sgl-ava--letter{font-size:38px}
.sgl-acard__txt{flex:1 1 360px;display:flex;flex-direction:column;gap:6px;min-width:0}
.sgl-acard__k{font-size:11px;color:var(--muted)}
.sgl-acard__name{font-size:19px;font-weight:600;line-height:1.3;overflow-wrap:anywhere}
.sgl-acard__bio{font-size:15px;line-height:1.55;color:#344A3C}

/* ---------- «Есть вопрос?» (правая колонка) ---------- */
.sgl-ask{background:var(--ink);color:#fff;padding:22px;display:flex;flex-direction:column;gap:12px}
.sgl-ask__t{font-size:24px;line-height:1}
.sgl-ask__d{font-size:14px;line-height:1.5;color:#C9D3CC}
.sgl-ask__btn{height:46px;font-size:14px}

/* ---------- Комментарии ---------- */
.sgl-comments{border-top:0;padding-top:0}
.sgl-comments .comment-respond{border:1px solid var(--line);border-radius:30px;padding:22px 24px}
.cmt-form input[type=text],.cmt-form input[type=email],.cmt-form textarea{background:var(--mist);border-color:transparent}
.cmt-form input:focus,.cmt-form textarea:focus{background:#fff}
.cmt-form .form-submit input[type=submit]{background:var(--acc);color:var(--ink)}
.cmt-form .form-submit input[type=submit]:hover{background:#F2C52E}
.cmt-list .comment-author{font-weight:600}
.cmt-list .comment-metadata{font-family:var(--f-mono);font-size:11.5px;color:var(--muted);margin:2px 0 8px}
.cmt-list .reply a{font-size:14px;font-weight:600;text-decoration:underline}

/* ---------- «Читайте также» ---------- */
.sgl-rel{padding-top:90px}
.sgl-rel__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 32px;margin-bottom:24px}
.sgl-rel__t{margin:0;font-size:clamp(34px,4.2vw,52px);line-height:.95}
.sgl-rel__all{display:inline-flex;align-items:center;gap:6px;min-height:40px;font-size:15px;font-weight:600}
.sgl-rel__all:hover{text-decoration:underline}
.sgl-rel__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.sgl-rel__card{padding:10px 10px 20px;display:flex;flex-direction:column;gap:14px;color:var(--ink)}
.sgl-rel__card .ico{width:44px;height:44px}
.sgl-rel__card:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(15,34,25,.10)}
.sgl-rel__img{display:block;width:100%;height:170px;border-radius:20px;object-fit:cover;background:var(--tint)}
.sgl-rel__img--ph{display:flex;align-items:center;justify-content:center;color:var(--leaf)}
.sgl-rel__txt{display:flex;flex-direction:column;gap:6px;padding:0 8px}
.sgl-rel__meta{font-size:11px;color:var(--muted)}
.sgl-rel__title{font-size:18px;font-weight:600;line-height:1.3}

/* ---------- Нижняя панель телефона ---------- */
.sgl-mbar{display:none}

@media (max-width:900px){
	.sgl-rate,.sgl-share{border-radius:22px;padding:16px}
	.sgl-rate{flex-direction:column;align-items:flex-start;gap:12px}
	.sgl-rate__t{font-size:17px}
	.sgl-rate .star svg{width:28px;height:28px}
	.sgl-rate:has(+.sgl-share){padding-bottom:12px}
	.sgl-rate+.sgl-share{padding-top:13px;gap:6px}
	.sgl-rate+.sgl-share::before{left:16px;right:16px}
	.sgl-share__t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
	.shr{height:44px;padding:0 14px;font-size:14px}
	.sgl-share--native .shr--copy{display:none}
	.sgl-acard{flex-direction:column;align-items:flex-start;border-radius:24px;padding:20px}
	.sgl-acard__txt{flex-basis:auto}
	.sgl-comments .comment-respond{border-radius:24px;padding:18px 16px}
	.sgl-rel{padding-top:60px}
	.sgl-rel__head{flex-direction:column;align-items:flex-start;gap:8px}
	.sgl-rel__grid{grid-template-columns:minmax(0,1fr)}

	.sgl-mbar:not([hidden]){position:fixed;left:10px;right:10px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:25;display:flex;align-items:center;gap:8px;background:var(--ink);color:#fff;border-radius:22px;padding:8px 8px 8px 16px;box-shadow:0 10px 30px rgba(15,34,25,.25);transition:transform .25s ease,opacity .25s ease}
	.sgl-mbar.is-off{transform:translateY(calc(100% + 24px));opacity:0;pointer-events:none}
	.sgl-mbar__now{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}
	.sgl-mbar__txt{font-size:10.5px;color:#C9D3CC;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
	.sgl-mbar__bar{height:4px;border-radius:999px;background:#2A4535;overflow:hidden}
	.sgl-mbar__bar i{display:block;height:100%;background:var(--acc);transform:scaleX(0);transform-origin:0 50%}
	.sgl-mbar__toc{flex:none;height:44px;padding:0 14px;border-radius:14px;border:0;background:var(--acc);color:var(--ink);font-size:13px;font-weight:600;cursor:pointer}
	.sgl-mbar__shr{flex:none;width:44px;height:44px;border-radius:14px;border:0;background:#1F3A2A;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
	.sgl-mbar button:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
}

@media (prefers-reduced-motion:reduce){
	.star path,.sgl-mbar:not([hidden]),.sgl-rel__card{transition:none}
}

@media print{
	.sgl-rate,.sgl-share,.sgl-mbar,.sgl-ask,.sgl-rel,.sgl-comments{display:none !important}
}