/* ============================================================
 * CSS-патч — фиксы 3C-after
 * Вставить в КОНЕЦ httpdocs/assets/css/main.css
 * ============================================================ */

/* ===== ОБЛАКО ТЕГОВ В СВЁРНУТОМ БЛОКЕ ===== */
.tags-cloud-collapse {
    margin: 48px 0 24px;
    border-top: 1px solid var(--border-soft);
    padding-top: 20px;
}
.tags-cloud-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    padding: 8px 0;
    font-size: 14px;
    color: var(--ink-soft);
    list-style: none;
    transition: color 0.15s ease;
}
.tags-cloud-summary::-webkit-details-marker { display: none; }
.tags-cloud-summary::after {
    content: "▾";
    font-size: 12px;
    margin-left: 8px;
    transition: transform 0.2s ease;
}
.tags-cloud-collapse[open] .tags-cloud-summary::after { transform: rotate(180deg); }
.tags-cloud-summary:hover { color: var(--ink); }
.tags-cloud-summary-text {
    font-weight: 600;
    color: var(--ink);
}
.tags-cloud-summary-hint {
    color: var(--ink-soft);
    font-size: 13px;
    margin-left: auto;
    padding-right: 6px;
}
.tags-cloud-collapse .tags-cloud {
    margin-top: 14px;
    padding: 18px 22px;
    background: var(--bg-cream);
    border-radius: 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
}
.tag-pill {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    background: white;
    border: 1px solid var(--border-soft);
    border-radius: 999px;
    color: var(--ink);
    text-decoration: none;
    font-size: 13px;
    transition: all 0.15s ease;
    white-space: nowrap;
}
.tag-pill::before {
    content: "#";
    color: var(--accent);
    font-weight: 600;
    margin-right: 2px;
}
.tag-pill:hover {
    background: var(--accent);
    border-color: var(--accent);
    transform: translateY(-1px);
}
.tag-pill.tag-w-1 { font-size: 12px; opacity: 0.85; }
.tag-pill.tag-w-2 { font-size: 13px; }
.tag-pill.tag-w-3 { font-size: 14px; font-weight: 600; }
.tag-pill.tag-w-4 { font-size: 15px; font-weight: 600; }
.tag-pill.tag-w-5 { font-size: 15px; font-weight: 700; background: var(--bg-sand); }

/* ===== УНИВЕРСАЛЬНЫЙ КОНВЕРСИОННЫЙ CTA-БЛОК ===== */
/* Используется на /blog, /teg, /otzyvy, /faq, /ceny, /о-враче, /second-opinion */
.bottom-conversion-cta {
    margin: 48px 0 24px;
    padding: 40px 36px;
    background: linear-gradient(135deg, #1a2942 0%, #0d2a52 100%);
    border-radius: 18px;
    color: white;
    position: relative;
    overflow: hidden;
}
.bottom-conversion-cta::before {
    content: "";
    position: absolute;
    top: -40px; right: -40px;
    width: 220px; height: 220px;
    background: radial-gradient(circle, rgba(212, 175, 55, 0.18) 0%, transparent 70%);
    pointer-events: none;
}
.bottom-cta-eyebrow {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--accent);
    font-weight: 700;
    margin-bottom: 10px;
}
.bottom-cta-title {
    color: white;
    font-size: 26px;
    line-height: 1.25;
    margin: 0 0 14px;
    font-weight: 700;
    letter-spacing: -0.01em;
    max-width: 720px;
}
.bottom-cta-text {
    color: rgba(255,255,255,0.88);
    font-size: 16px;
    line-height: 1.6;
    max-width: 660px;
    margin: 0 0 24px;
}
.bottom-cta-buttons {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}
.bottom-conversion-cta .btn-primary {
    background: var(--accent);
    color: var(--ink);
    padding: 14px 28px;
    border-radius: 999px;
    font-weight: 700;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    transition: transform 0.15s ease;
}
.bottom-conversion-cta .btn-primary:hover { transform: translateY(-2px); }
.bottom-conversion-cta .btn-secondary {
    background: transparent;
    color: white;
    border: 1.5px solid rgba(255,255,255,0.4);
    padding: 13px 26px;
    border-radius: 999px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.15s ease;
}
.bottom-conversion-cta .btn-secondary:hover {
    border-color: rgba(255,255,255,0.8);
    background: rgba(255,255,255,0.06);
}
.bottom-cta-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    padding-top: 18px;
    border-top: 1px solid rgba(255,255,255,0.12);
    font-size: 13px;
    color: rgba(255,255,255,0.7);
}

@media (max-width: 700px) {
    .bottom-conversion-cta { padding: 28px 22px; margin: 36px -8px; border-radius: 14px; }
    .bottom-cta-title { font-size: 21px; }
    .bottom-cta-text { font-size: 15px; }
    .bottom-cta-buttons { flex-direction: column; }
    .bottom-conversion-cta .btn-primary,
    .bottom-conversion-cta .btn-secondary { width: 100%; text-align: center; }
    .bottom-cta-meta { flex-direction: column; gap: 8px; font-size: 12.5px; }
}

/* Алиас: на /blog и /teg блок имеет класс .blog-bottom-cta — повторяем стили */
.blog-bottom-cta {
    margin: 48px 0 24px;
    padding: 40px 36px;
    background: linear-gradient(135deg, #1a2942 0%, #0d2a52 100%);
    border-radius: 18px;
    color: white;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.blog-bottom-cta-inner {
    position: relative;
    z-index: 1;
    max-width: 680px;
    margin: 0 auto;
}
.blog-bottom-cta::before {
    content: "";
    position: absolute;
    top: -40px; right: -40px;
    width: 220px; height: 220px;
    background: radial-gradient(circle, rgba(212, 175, 55, 0.18) 0%, transparent 70%);
}
.blog-bottom-cta h3 {
    color: white;
    font-size: 26px;
    line-height: 1.3;
    margin: 0 0 14px;
}
.blog-bottom-cta p {
    color: rgba(255,255,255,0.88);
    font-size: 16px;
    line-height: 1.6;
    margin: 0 0 22px;
}
.blog-bottom-cta-buttons {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
}
.blog-bottom-cta .btn-primary {
    background: var(--accent);
    color: var(--ink);
    padding: 14px 28px;
    border-radius: 999px;
    font-weight: 700;
    text-decoration: none;
    display: inline-flex;
    transition: transform 0.15s ease;
}
.blog-bottom-cta .btn-primary:hover { transform: translateY(-2px); }
.blog-bottom-cta .btn-secondary {
    background: transparent;
    color: white;
    border: 1.5px solid rgba(255,255,255,0.4);
    padding: 13px 26px;
    border-radius: 999px;
    text-decoration: none;
    font-weight: 600;
}
.blog-bottom-cta .btn-secondary:hover { border-color: rgba(255,255,255,0.8); }

@media (max-width: 700px) {
    .blog-bottom-cta { padding: 28px 22px; margin: 36px -8px; border-radius: 14px; }
    .blog-bottom-cta h3 { font-size: 21px; }
    .blog-bottom-cta p { font-size: 15px; }
    .blog-bottom-cta-buttons { flex-direction: column; }
    .blog-bottom-cta .btn-primary,
    .blog-bottom-cta .btn-secondary { width: 100%; }
}

/* ===== ПРАЙС-ХАБ (/ceny) ===== */
.price-hub-table-wrap {
    background: white;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 2px 16px rgba(13,43,92,0.06);
    border: 1px solid var(--border-soft);
}
.price-hub-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14.5px;
}
.price-hub-table thead {
    background: var(--accent-deep);
    color: white;
}
.price-hub-table th {
    text-align: left;
    padding: 14px 16px;
    font-weight: 700;
    font-size: 12.5px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.price-hub-table td {
    padding: 16px;
    border-top: 1px solid var(--border-soft);
    vertical-align: top;
}
.price-hub-table tbody tr:hover { background: var(--bg-cream); }

.price-hub-name {
    font-weight: 700;
    color: var(--ink);
    font-size: 15px;
    margin-bottom: 4px;
    line-height: 1.3;
}
.price-hub-desc {
    color: var(--ink-soft);
    font-size: 13px;
    line-height: 1.45;
}
.price-hub-cell { white-space: nowrap; }
.price-hub-amount {
    font-weight: 700;
    color: var(--ink);
    font-size: 15px;
    font-variant-numeric: tabular-nums;
}
.price-hub-link {
    color: var(--accent-deep);
    text-decoration: none;
    font-weight: 600;
    font-size: 13.5px;
    white-space: nowrap;
}
.price-hub-link:hover { text-decoration: underline; }

.price-hub-notes {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 32px;
}
.price-hub-note {
    padding: 18px 22px;
    background: var(--bg-cream);
    border-radius: 12px;
    border-left: 3px solid var(--accent);
    font-size: 14px;
    line-height: 1.6;
    color: var(--ink-soft);
}
.price-hub-note strong {
    display: block;
    color: var(--ink);
    margin-bottom: 6px;
    font-size: 14px;
}

@media (max-width: 900px) {
    .price-hub-notes { grid-template-columns: 1fr; }
    .price-hub-table { font-size: 13px; display: block; overflow-x: auto; }
    .price-hub-table th, .price-hub-table td { padding: 11px 12px; }
}

/* ===== ЛОГОТИП КОЛЬЦЕВАЯ АНИМАЦИЯ ===== */
.logo-with-ring { display: inline-block; }
.logo-ring-wrap {
    position: relative;
    display: inline-block;
    line-height: 0;
}
.logo-ring {
    position: absolute;
    top: 50%; left: 50%;
    width: 64px; height: 64px;
    transform: translate(-50%, -50%);
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.3s ease;
}
.logo-ring circle {
    fill: none;
    stroke: var(--accent, #d4af37);
    stroke-width: 2;
    stroke-dasharray: 289;     /* 2 × π × 46 ≈ 289 */
    stroke-dashoffset: 289;
    transform-origin: 50% 50%;
}
.logo-with-ring:hover .logo-ring,
.logo-with-ring:focus-visible .logo-ring {
    opacity: 1;
}
.logo-with-ring:hover .logo-ring circle {
    animation: logoRingDraw 1.2s ease-out forwards;
}
@keyframes logoRingDraw {
    0%   { stroke-dashoffset: 289; transform: rotate(-90deg); }
    100% { stroke-dashoffset: 0;   transform: rotate(270deg); }
}

/* На главной — кольцо тонко пульсирует, обращая внимание */
body.is-home .logo-ring {
    opacity: 0.5;
}
body.is-home .logo-ring circle {
    animation: logoRingPulse 4s ease-in-out infinite;
}
@keyframes logoRingPulse {
    0%, 100% { stroke-dashoffset: 289; transform: rotate(-90deg); }
    50%      { stroke-dashoffset: 0;   transform: rotate(270deg); }
}

/* ===== УСИЛЕНИЕ КНОПОК ГОЛОСОВАНИЯ ОТЗЫВОВ — мини-CTA после полезности ===== */
.review-helpful-conv-hint {
    display: block;
    margin-top: 10px;
    font-size: 12.5px;
    color: var(--ink-soft);
    font-style: italic;
}
.review-helpful-conv-hint a {
    color: var(--accent-deep);
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px dotted currentColor;
}
.review-helpful-conv-hint a:hover { border-bottom-style: solid; }
/* ============================================================
 * CSS-патч 3B-content — стили для полных статей блога
 * Вставить в КОНЕЦ httpdocs/assets/css/main.css
 *
 * Уже есть в main.css: .doctor-quote — НЕ дублирую, только дополняю
 * ============================================================ */

/* ===== ВСТУПЛЕНИЕ СТАТЬИ ===== */
.article-content .article-lead {
    font-size: 19px;
    line-height: 1.55;
    color: var(--ink);
    font-weight: 500;
    margin: 0 0 32px;
    padding: 20px 24px;
    background: linear-gradient(180deg, var(--bg-cream) 0%, transparent 100%);
    border-left: 4px solid var(--accent);
    border-radius: 0 12px 12px 0;
}

/* ===== ЗАГОЛОВКИ ВНУТРИ СТАТЬИ ===== */
.article-content h2 {
    font-size: 26px;
    font-weight: 700;
    margin: 40px 0 16px;
    color: var(--ink);
    line-height: 1.25;
    letter-spacing: -0.01em;
}
.article-content h3 {
    font-size: 19px;
    font-weight: 700;
    margin: 28px 0 12px;
    color: var(--ink);
    line-height: 1.35;
}

/* Параграфы и списки */
.article-content p { margin: 0 0 16px; line-height: 1.7; color: var(--ink); font-size: 16px; }
.article-content ul, .article-content ol { margin: 0 0 20px; padding-left: 24px; }
.article-content li { margin-bottom: 8px; line-height: 1.65; }
.article-content strong { color: var(--ink); font-weight: 700; }
.article-content a { color: var(--accent-deep); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.article-content a:hover { text-decoration-thickness: 2px; }

/* ===== ТАБЛИЦЫ ===== */
.article-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 24px 0;
    background: white;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(13,43,92,0.06);
    font-size: 14.5px;
}
.article-content table thead {
    background: var(--accent-deep);
    color: white;
}
.article-content table th {
    padding: 12px 16px;
    text-align: left;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.article-content table td {
    padding: 12px 16px;
    border-top: 1px solid var(--border-soft);
    vertical-align: top;
    line-height: 1.45;
}
.article-content table tbody tr:hover {
    background: var(--bg-cream);
}

/* ===== ВРЕЗКА С ЦИТАТОЙ ВРАЧА (уже есть в main.css — дополняю) ===== */
/* Для HTML вида:
   <div class="doctor-quote">
     <blockquote>текст</blockquote>
     <cite>А.В. Мартынов</cite>
   </div>
   Доп. стили на случай если базовых не хватит */
.article-content .doctor-quote {
    margin: 32px 0;
}
.article-content .doctor-quote blockquote {
    margin: 0 0 10px;
    font-size: 17px;
    font-style: italic;
    line-height: 1.55;
    color: var(--ink);
}
.article-content .doctor-quote cite {
    display: block;
    font-style: normal;
    font-weight: 700;
    color: var(--accent-deep);
    font-size: 14px;
    letter-spacing: 0.02em;
}

/* ===== БЛОК CTA В КОНЦЕ СТАТЬИ ===== */
.article-content .article-cta {
    margin: 48px 0 32px;
    padding: 32px;
    background: linear-gradient(135deg, var(--accent-deep) 0%, var(--ink) 100%);
    border-radius: 16px;
    color: white;
    text-align: center;
}
.article-content .article-cta h3 {
    color: white;
    font-size: 24px;
    margin: 0 0 12px;
}
.article-content .article-cta p {
    color: rgba(255,255,255,0.92);
    font-size: 16px;
    line-height: 1.55;
    max-width: 620px;
    margin: 0 auto 22px;
}
.article-content .article-cta .btn-primary,
.article-content .article-cta .btn-secondary {
    display: inline-block;
    margin: 6px 4px;
    padding: 12px 28px;
    border-radius: 999px;
    font-weight: 700;
    text-decoration: none;
    transition: transform 0.15s ease;
}
.article-content .article-cta .btn-primary {
    background: var(--accent);
    color: var(--ink);
}
.article-content .article-cta .btn-secondary {
    background: transparent;
    color: white;
    border: 1.5px solid rgba(255,255,255,0.5);
}
.article-content .article-cta .btn-primary:hover,
.article-content .article-cta .btn-secondary:hover {
    transform: translateY(-2px);
}

/* ===== ДИСКЛЕЙМЕР ===== */
.article-content .article-disclaimer {
    margin-top: 28px;
    padding: 16px 20px;
    background: var(--bg-cream);
    border-radius: 10px;
    font-size: 13px;
    color: var(--ink-soft);
    line-height: 1.55;
}
.article-content .article-disclaimer em { font-style: italic; }

/* ===== АДАПТИВ МОБИЛЬНЫЙ ===== */
@media (max-width: 700px) {
    .article-content .article-lead { font-size: 16.5px; padding: 16px 18px; }
    .article-content h2 { font-size: 22px; margin: 32px 0 14px; }
    .article-content h3 { font-size: 17px; margin: 22px 0 10px; }
    .article-content p { font-size: 15.5px; }
    .article-content table { font-size: 13px; display: block; overflow-x: auto; }
    .article-content table th,
    .article-content table td { padding: 10px 12px; }
    .article-content .article-cta { padding: 24px 18px; margin: 32px -12px; border-radius: 12px; }
    .article-content .article-cta h3 { font-size: 20px; }
    .article-content .article-cta p { font-size: 14.5px; }
    .article-content .article-cta .btn-primary,
    .article-content .article-cta .btn-secondary {
        display: block;
        margin: 8px 0;
    }
    .article-content .doctor-quote blockquote { font-size: 15.5px; }
}

/* ============================================================
 * КНОПКИ ГОЛОСОВАНИЯ ОТЗЫВОВ — взаимодействие + анимация
 * ============================================================ */
.review-helpful {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px dashed var(--border-soft, #e5e7eb);
}
.review-vote-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.review-vote-question {
    font-size: 13px;
    color: var(--ink-soft, #64748b);
    margin-right: 4px;
}
.vote-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: white;
    border: 1px solid var(--border-soft, #e5e7eb);
    border-radius: 999px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink, #0f172a);
    transition: all 0.15s ease;
    line-height: 1;
}
.vote-btn:hover {
    background: var(--bg-cream, #fdf8f0);
    border-color: var(--accent, #d4af37);
    transform: translateY(-1px);
}
.vote-btn:active { transform: translateY(0); }
.vote-btn.voted {
    background: var(--accent, #d4af37);
    border-color: var(--accent, #d4af37);
    color: var(--ink, #0f172a);
}
.vote-btn.vote-up-btn.voted {
    background: #16a34a;
    border-color: #16a34a;
    color: white;
}
.vote-btn.vote-down-btn.voted {
    background: #94a3b8;
    border-color: #94a3b8;
    color: white;
}
.vote-svg { flex-shrink: 0; }
.vote-text { font-weight: 600; }
.vote-num {
    background: var(--bg-cream, #fdf8f0);
    padding: 1px 7px;
    border-radius: 999px;
    font-variant-numeric: tabular-nums;
    font-size: 12px;
    color: var(--ink, #0f172a);
}
.vote-btn.voted .vote-num {
    background: rgba(255,255,255,0.35);
    color: inherit;
}
.review-helpful.voting .vote-btn {
    pointer-events: none;
    opacity: 0.6;
}
.review-helpful-conv-hint {
    margin-top: 10px;
    padding: 10px 14px;
    background: var(--bg-cream, #fdf8f0);
    border-radius: 8px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--ink, #0f172a);
    animation: hintFadeIn 0.4s ease;
}
.review-helpful-conv-hint a {
    color: var(--accent-deep, #92722a);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
}
@keyframes hintFadeIn {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* =====================================================================
   ПАКЕТ 2026-05-28 · мобильное меню, фикс логотипа, кнопки клиники,
   соцсети, конверсионная 404
   ===================================================================== */

/* ---------- ГАМБУРГЕР-КНОПКА ---------- */
.nav-toggle{
    display:none;
    width:44px;height:44px;
    border:0;background:transparent;cursor:pointer;
    padding:10px;border-radius:10px;
    flex-shrink:0;
    -webkit-tap-highlight-color:transparent;
}
.nav-toggle span{
    display:block;height:2px;width:100%;
    background:var(--ink);border-radius:2px;
    transition:transform .25s ease, opacity .2s ease;
}
.nav-toggle span + span{margin-top:5px;}
.nav-toggle.is-active span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.is-active span:nth-child(2){opacity:0;}
.nav-toggle.is-active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ---------- ВЫЕЗЖАЮЩЕЕ МОБИЛЬНОЕ МЕНЮ ---------- */
.mobile-nav-overlay{
    position:fixed;inset:0;z-index:140;
    background:rgba(13,42,82,.45);
    opacity:0;transition:opacity .25s ease;
    -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
}
body.mobile-nav-open .mobile-nav-overlay{opacity:1;}

.mobile-nav{
    position:fixed;top:0;right:0;z-index:150;
    width:min(82vw,340px);height:100dvh;height:100vh;
    background:var(--surface,#fff);
    box-shadow:-12px 0 40px rgba(13,42,82,.18);
    padding:78px 22px 28px;
    display:flex;flex-direction:column;gap:2px;
    transform:translateX(100%);
    transition:transform .26s cubic-bezier(.4,0,.2,1);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
}
body.mobile-nav-open .mobile-nav{transform:translateX(0);}
.mobile-nav a{
    display:block;padding:13px 12px;border-radius:10px;
    font-size:16px;font-weight:600;color:var(--ink);
    text-decoration:none;transition:background .15s ease;
}
.mobile-nav a:active,.mobile-nav a:hover{background:rgba(13,42,82,.05);}
.mobile-nav .mobile-nav-highlight{color:#b8902f;}
.mobile-nav .mobile-nav-cta{
    margin-top:14px;background:var(--whatsapp,#25a25a);color:#fff;
    text-align:center;font-weight:700;padding:15px;border-radius:12px;
}
.mobile-nav .mobile-nav-cta:hover{background:#1ea855;}
.mobile-nav-clinics{margin-top:18px;padding-top:16px;border-top:1px solid var(--border,#e7ebf0);}
.mobile-nav-clinics a{
    font-size:14px;font-weight:600;color:var(--ink-soft);padding:9px 12px;
}
body.mobile-nav-open{overflow:hidden;}

@media (max-width:900px){
    .nav-toggle{display:block;}
}

/* ---------- ФИКС ЛОГОТИПА (обрезалась буква D на iPhone) ---------- */
@media (max-width:900px){
    .header-inner{gap:10px;min-width:0;}
    .logo{min-width:0;}
    .logo-wave-wrap{max-width:62vw;}
    .logo-img,.logo-img-base,.logo-img-gold{width:auto;max-width:100%;height:auto;}
    .logo-img-base{height:40px;}
}
@media (max-width:600px){
    .header-inner{padding-left:2px;}
    .logo-img-base{height:36px;}
    .btn-wa-header{padding:8px 12px;font-size:13px;}
}
@media (max-width:380px){
    .logo-img-base{height:32px;}
    .btn-wa-header{padding:7px 10px;font-size:12px;}
    .nav-toggle{width:40px;height:40px;padding:9px;}
}
/* страховка от горизонтального сдвига, который и срезал «D» */
html,body{overflow-x:clip;}

/* ---------- КНОПКИ «ПОЗВОНИТЬ / WHATSAPP» В ПЛАШКЕ ВЫБРАННОЙ КЛИНИКИ ---------- */
.pcb-contact-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.pcb-call,.pcb-wa{
    display:inline-flex;align-items:center;gap:6px;
    font-size:13px;font-weight:700;text-decoration:none;
    padding:7px 13px;border-radius:8px;white-space:nowrap;
}
.pcb-call{background:#0d2a52;color:#fff;}
.pcb-call:hover{background:#143a6e;color:#fff;}
.pcb-wa{background:var(--whatsapp,#25a25a);color:#fff;}
.pcb-wa:hover{background:#1ea855;color:#fff;}

/* ---------- WHATSAPP/СОЦСЕТИ В ФУТЕРЕ ---------- */
.footer-clinic-mini .footer-wa{
    display:inline-flex;align-items:center;gap:5px;margin-top:3px;
    font-size:13px;font-weight:600;color:var(--whatsapp,#25a25a);text-decoration:none;
}
.footer-clinic-mini .footer-wa:hover{text-decoration:underline;}
.footer-socials{
    display:flex;gap:10px;flex-wrap:wrap;margin-top:14px;
}
.footer-socials a{
    display:inline-flex;align-items:center;justify-content:center;
    width:40px;height:40px;border-radius:50%;
    background:rgba(255,255,255,.08);color:#cdd6e2;
    font-size:13px;font-weight:700;text-decoration:none;
    transition:background .15s ease,color .15s ease,transform .15s ease;
}
.footer-socials a:hover{background:var(--accent,#d4af37);color:#0d2a52;transform:translateY(-2px);}
.footer-socials-title{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#8b97a8;margin-top:18px;}

/* ---------- КОНВЕРСИОННАЯ / ВЕСЁЛАЯ 404 ---------- */
.error-404{padding:60px 0 80px;text-align:center;}
.error-404 h1{
    font-size:clamp(96px,22vw,200px);line-height:.9;font-weight:800;
    color:var(--accent,#d4af37);margin:0;letter-spacing:-.02em;
}
.error-404 .e404-tooth{font-size:clamp(40px,9vw,72px);display:block;margin:-6px 0 6px;}
.error-404-lead{font-size:18px;color:var(--ink-soft);max-width:640px;margin:14px auto 6px;line-height:1.55;}
.error-404-sub{font-size:15px;color:var(--ink-muted,#8b97a8);max-width:560px;margin:0 auto 26px;}
.error-404-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:36px;}
.error-404-quick{
    display:flex;gap:10px;flex-wrap:wrap;justify-content:center;max-width:720px;margin:0 auto 46px;
}
.error-404-quick a{
    background:var(--surface,#fff);border:1.5px solid var(--border,#e7ebf0);
    padding:10px 16px;border-radius:999px;font-size:14px;font-weight:600;
    color:var(--ink);text-decoration:none;transition:all .15s ease;
}
.error-404-quick a:hover{border-color:var(--accent,#d4af37);transform:translateY(-2px);}
.error-404-articles{max-width:920px;margin:0 auto;text-align:left;}
.error-404-articles h2{font-size:20px;text-align:center;margin-bottom:22px;color:var(--ink);}
.error-404-articles-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;}
.error-404-article-card{
    display:flex;flex-direction:column;gap:8px;justify-content:space-between;
    background:var(--surface,#fff);border:1px solid var(--border,#e7ebf0);
    border-radius:14px;padding:18px;text-decoration:none;transition:all .15s ease;
}
.error-404-article-card:hover{border-color:var(--accent,#d4af37);box-shadow:0 8px 24px rgba(13,42,82,.08);transform:translateY(-3px);}
.e404-art-title{font-size:15px;font-weight:700;color:var(--ink);line-height:1.35;}
.e404-art-meta{font-size:13px;color:var(--accent,#b8902f);font-weight:600;}

/* =====================================================================
   ЭТАП 4 · виджет онлайн-записи /zapis
   ===================================================================== */
.zb-card{background:var(--surface,#fff);border:1px solid var(--border,#e7ebf0);border-radius:18px;padding:24px;box-shadow:0 10px 40px rgba(13,42,82,.06);}
.zb-step{margin-bottom:22px;}
.zb-label{font-size:13px;font-weight:800;letter-spacing:.02em;color:#0d2a52;margin-bottom:10px;text-transform:uppercase;}
.zb-hint{color:var(--ink-soft,#6b7785);font-size:14px;padding:8px 0;}
.zb-clinics{display:flex;gap:10px;flex-wrap:wrap;}
.zb-clinic{padding:11px 20px;border-radius:10px;border:1.5px solid var(--border,#e7ebf0);background:#fff;font-weight:700;cursor:pointer;color:var(--ink,#0f172a);transition:all .15s;}
.zb-clinic.active{background:#0d2a52;color:#fff;border-color:#0d2a52;}
.zb-days{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch;}
.zb-day{flex:0 0 auto;width:62px;padding:10px 0;border-radius:12px;border:1.5px solid var(--border,#e7ebf0);background:#fff;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px;transition:all .15s;}
.zb-day:hover{border-color:#d4af37;}
.zb-day.active{background:#0d2a52;color:#fff;border-color:#0d2a52;}
.zb-day-dow{font-size:11px;text-transform:uppercase;opacity:.7;}
.zb-day-num{font-size:20px;font-weight:800;line-height:1;}
.zb-day-m{font-size:11px;opacity:.7;}
.zb-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:8px;}
.zb-slot{padding:11px 0;border-radius:10px;border:1.5px solid var(--border,#e7ebf0);background:#f5fbf7;font-weight:700;cursor:pointer;transition:all .15s;}
.zb-slot:hover{border-color:#1f7a45;}
.zb-slot.active{background:#1f7a45;color:#fff;border-color:#1f7a45;}
.zb-form{display:flex;flex-direction:column;gap:12px;position:relative;}
.zb-consent{font-size:13px;color:var(--ink-soft,#6b7785);display:flex;gap:8px;align-items:flex-start;}
.zb-error{background:#fce4e4;border:1px solid #f1bcbc;color:#8b2c2c;padding:10px 14px;border-radius:8px;font-size:14px;}
.zb-success{text-align:center;padding:24px 8px;}
.zb-success-icon{width:64px;height:64px;border-radius:50%;background:#1f7a45;color:#fff;font-size:34px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;}
.zb-success h3{margin:0 0 8px;font-size:22px;color:#0d2a52;}
.zb-success p{color:var(--ink-soft,#6b7785);margin-bottom:18px;}


/* ============================================================
   БЛОК КЕЙСОВ (до/после, хирургия, видео)
   Куда: дописать В КОНЕЦ файла assets/css/main-additions.css
   Ничего существующего не меняем — только добавляем классы .case-*
   Бренд-цвет навигации: #0D2B5C
   ============================================================ */

.case-card{border:1px solid #e4e8f0;border-radius:14px;overflow:hidden;margin:24px 0;background:#fff;box-shadow:0 6px 26px rgba(13,43,92,.07)}
.case-card .case-ba{display:grid;grid-template-columns:1fr 1fr;gap:0}
.case-card .case-col{position:relative}
.case-card .case-col img{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:16/11}
.case-card .case-single img{display:block;width:100%;height:auto}
.case-card .case-tag{position:absolute;top:12px;left:12px;font-size:12px;font-weight:700;letter-spacing:.04em;padding:6px 12px;border-radius:8px;color:#fff}
.case-card .tag-do{background:#c0492c}
.case-card .tag-posle{background:#1d9e75}
.case-card .case-body{padding:16px 20px}
.case-card .case-meta{font-size:13px;color:#5b6678;margin:0 0 8px;text-transform:uppercase;letter-spacing:.06em;font-weight:600}
.case-card .case-body p{margin:0 0 10px;font-size:16px;line-height:1.6}
.case-note{font-size:13px;color:#5b6678;margin:6px 0 18px}

/* Раскрытие графичных хирургических фото с предупреждением */
.case-graphic{border:1px dashed #c9b6a0;border-radius:12px;margin:20px 0;background:#fbf7f2}
.case-graphic>summary{cursor:pointer;list-style:none;padding:14px 18px;font-weight:700;color:#8a5a2a;display:flex;align-items:center;gap:8px}
.case-graphic>summary::-webkit-details-marker{display:none}
.case-graphic>summary::before{content:"\26A0";font-size:18px}
.case-graphic[open]>summary{border-bottom:1px dashed #e0d3c2}
.case-graphic .case-graphic-body{padding:14px 18px}
.case-graphic .case-graphic-body img{width:100%;height:auto;border-radius:8px;margin:8px 0}

/* Видео-кейс */
.case-video{margin:20px 0}
.case-video video{width:100%;height:auto;border-radius:12px;background:#000}
.case-video figcaption{font-size:13px;color:#5b6678;margin-top:6px}

/* Сетка «история в фото» (много кадров одного случая) */
.case-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}
.case-gallery img{width:100%;height:100%;object-fit:cover;aspect-ratio:1/1;border-radius:8px}

@media(max-width:640px){
  .case-card .case-ba{grid-template-columns:1fr}
  .case-gallery{grid-template-columns:repeat(2,1fr)}
}