/*
 * Дополнительные стили для Laravel-специфичных view-блоков,
 * которых нет в исходной верстке Docs2/site/styles.css:
 *   @font-face Poppins — self-hosted (DSGVO: без обращений к fonts.gstatic.com).
 *   .cms-content       — обёртка для TinyMCE-контента (blog, legal, city-landing).
 *   .ac-suggest        — dropdown autocomplete на /umzugsunternehmen-finden.
 *   .pagination        — links() от paginator.
 *
 * Подключается ВТОРЫМ после styles.css в public/layouts/app.blade.php.
 */

/* === Poppins self-hosted (DSGVO-safe, грузится всегда, без cookie-gate) ====
 * 5 weights × (latin + latin-ext) = 10 файлов в ./fonts/.
 * latin-ext нужен для немецких ä/ö/ü/ß (U+0100-...).
 * Источник: Google Fonts CSS API v2, скачано одноразово.
 */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url('./fonts/poppins-300-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url('./fonts/poppins-300-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('./fonts/poppins-400-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('./fonts/poppins-400-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('./fonts/poppins-600-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('./fonts/poppins-600-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 300;
    font-display: swap;
    src: url('./fonts/poppins-300italic-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 300;
    font-display: swap;
    src: url('./fonts/poppins-300italic-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('./fonts/poppins-400italic-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('./fonts/poppins-400italic-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* === CMS-блоки на системных страницах (содержимое из pages.content_html) ===
 * Каскад reproduces исходные `.h2 / .body-xs / .ask5__disclaimer-text / .calc16__note`
 * стили внутри родительских контейнеров, чтобы вёрстка не разъезжалась, даже если
 * TinyMCE снимет класс при редактировании. Каждое правило аффектит только свой
 * блок — не трогает остальные h2/p на странице.
 */
.mission__text h2 {
    margin: 0;
    font-size: 28px;
    line-height: 1.4;
    font-weight: 600;
    color: #1c2030;
}
.mission__text p {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
}

.ask5__disclaimer p {
    margin: 0;
    font-size: 11px;
    line-height: 1.4;
    font-weight: 300;
    font-style: italic;
    color: #6b5f79;
}

.calc16__notes p {
    margin: 0;
}

/* ============================================================================
 * Blog-Builder (Phase 1 + 2) — намespace .blog-builder__*.
 * 1-в-1 с дизайн-языком existing .blog1/.blog2/.blog3/.blog4/.blog9 (styles.css).
 * Используется когда $post->content_blocks != NULL в show.blade.php.
 * ============================================================================
 */
.blog-builder {
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

/* ---------- Header / hero ------------------------------------------------- */
.blog-builder__header {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.blog-builder__title {
    margin: 0;
    font-size: 28px;
    line-height: 1.4;
    font-weight: 600;
    color: #1c2030;
    text-wrap: balance;
}
.blog-builder__intro {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
}

/* Subtitle — h2/h3 на верхнем уровне (как .blog2__faces-title) */
.blog-builder__subtitle {
    margin: 0;
    font-size: 20px;
    line-height: 1.4;
    font-weight: 600;
    color: #2a2a2a;
}
.blog-builder__subtitle--center { text-align: center; }
.blog-builder__subtitle--h3 { font-size: 18px; }
.blog-builder__hero {
    width: 100%;
    border-radius: 32px;
    background-image: linear-gradient(164deg, #9d64e2 0%, #7b40c2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px 0;
}
.blog-builder__hero-img {
    width: 309px;
    height: 206px;
    max-width: 100%;
    display: block;
    object-fit: contain;
}

/* ---------- Paragraph (TinyMCE inline output) ---------------------------- */
.blog-builder__p {
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
}
.blog-builder__p p { margin: 0 0 12px; }
.blog-builder__p p:last-child { margin: 0; }
.blog-builder__p a { color: #7b40c2; text-decoration: underline; }
.blog-builder__p strong { font-weight: 600; color: #222021; }
.blog-builder__p ul, .blog-builder__p ol { margin: 0 0 12px 22px; }
.blog-builder__grad {
    background-image: linear-gradient(174deg, #9d64e2 0%, #7b40c2 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  /*  font-weight: 500;*/
}

/* ---------- Lists: bullets, checks --------------------------------------- */
.blog-builder__bullets {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.blog-builder__bullet {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
}
.blog-builder__bullet-dot {
    width: 4px;
    height: 4px;
    margin-top: 8px;
    border-radius: 999px;
    background: var(--text-secondary);
    flex: 0 0 auto;
}
.blog-builder__bullet-text { flex: 1 1 auto; }

.blog-builder__checks {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.blog-builder__check {
    display: flex;
    gap: 8px;
    align-items: flex-start;
}
.blog-builder__check-icon {
    width: 14px;
    height: 14px;
    margin-top: 3px;
    flex: 0 0 auto;
    display: block;
}
.blog-builder__check-text {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
    flex: 1 1 auto;
}

/* check-list варианты: inline-md (blog4) — крупная иконка + bold-текст */
.blog-builder__checks--inline-md .blog-builder__check-icon {
    width: 22px;
    height: 22px;
    margin-top: 0;
}
.blog-builder__checks--inline-md .blog-builder__check-text {
    font-weight: 500;
    color: #222021;
}

/* check-list вариант: box (blog9) — checkbox 24×24 с border, иконка 16×16 внутри */
.blog-builder__checks--box .blog-builder__check {
    align-items: flex-start;
}
.blog-builder__check-box {
    width: 24px;
    height: 24px;
    border: 1px solid rgba(164, 155, 175, 0.35);
    border-radius: 6px;
    padding: 4px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
}
.blog-builder__check-box img {
    width: 16px;
    height: 16px;
    display: block;
}
.blog-builder__checks--box .blog-builder__check-text {
    margin-top: 2px;
}

/* ---------- Divider ------------------------------------------------------- */
.blog-builder__divider {
    width: 100%;
    height: 1px;
    border: 0;
    background: rgba(164, 155, 175, 0.35);
    margin: 0;
}
.blog-builder__divider--svg {
    background: none;
    height: auto;
    display: block;
}

/* ---------- Numbered step (info-card children) --------------------------- */
.blog-builder__step {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.blog-builder__step-title {
    margin: 0;
    padding-left: 24px;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 600;
    color: #222021;
}
.blog-builder__step-title ::marker {
    font-weight: 600;
    color: #222021;
}
.blog-builder__step-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
}
.blog-builder__step-body p { margin: 0; }
.blog-builder__step-body strong { font-weight: 600; color: #222021; }

/* ---------- Labeled block (.blog3__block / .blog9__group) ---------------- */
.blog-builder__labeled {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.blog-builder__labeled-label {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 500;
    color: #222021;
}
.blog-builder__labeled-items {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.blog-builder__labeled-item {
    display: flex;
    gap: 8px;
    align-items: center;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
}
.blog-builder__labeled-dot {
    width: 4px;
    height: 4px;
    border-radius: 999px;
    background: var(--text-secondary);
    flex: 0 0 auto;
}

/* ---------- Lead (.blog3__lead) ------------------------------------------ */
.blog-builder__lead {
    display: flex;
    gap: 8px;
    align-items: center;
}
.blog-builder__lead-dot {
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: #222021;
    flex: 0 0 auto;
}
.blog-builder__lead-text {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 500;
    color: #222021;
}

/* ---------- Icon-line (.blog3__icon-line) -------------------------------- */
.blog-builder__icon-line {
    display: flex;
    gap: 8px;
    align-items: flex-start;
}
.blog-builder__icon-line-img {
    width: 14px;
    height: 14px;
    margin-top: 2px;
    flex: 0 0 auto;
    display: block;
}
.blog-builder__icon-line-text {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
}

/* ---------- Flag (.blog3__flag) — без фона ------------------------------- */
.blog-builder__flag {
    display: flex;
    gap: 8px;
    align-items: center;
}
.blog-builder__flag-icon {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
    display: block;
}
.blog-builder__flag-text {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
}

/* ---------- Note --------------------------------------------------------- */
.blog-builder__note {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
}
.blog-builder__note--inline {
    font-weight: 300;
    color: var(--text-secondary);
}
.blog-builder__note--final {
    font-size: 16px;
    font-weight: 600;
    background-image: linear-gradient(177deg, #9d64e2 0%, #7b40c2 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

/* ---------- Info-card (.card.blog__card обёртка) ------------------------- */
.blog-builder__info {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

/* ---------- Callout (.blog2__callout) ------------------------------------ */
.blog-builder__callout {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.blog-builder__callout-badge {
    width: 30px;
    height: 30px;
    padding: 4px;
    border-radius: 8px;
    background-image: var(--grad-purple);
    display: flex;
    align-items: center;
    justify-content: center;
}
.blog-builder__callout-badge img {
    width: 22px;
    height: 22px;
    display: block;
}
.blog-builder__callout-copy {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.blog-builder__callout-title {
    margin: 0;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 600;
    color: #222021;
}
.blog-builder__callout-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
}
.blog-builder__callout-body p { margin: 0; }
.blog-builder__callout-accent {
    margin: 0;
    font-size: 14px;
    line-height: 1.2;
    font-weight: 300;
    /* Ярче фирменного градиента (#9d64e2→#7b40c2) по просьбе клиента: та же
       гамма, но выше насыщенность — строка заметнее, контраст к белой карточке
       при этом не падает (3.9:1 было / 4.0:1 стало). Класс используется ТОЛЬКО
       блоком callout (сейчас — пост vermittler-auf-dem-umzugsmarkt), поэтому
       общий брендовый градиент сайта не затронут. */
    background-image: linear-gradient(177deg, #a855f7 0%, #7c3aed 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

/* ---------- Mini-list-card (.blog3__mini) -------------------------------- */
.blog-builder__mini,
.blog-builder__dialog {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.blog-builder__mini-badge,
.blog-builder__dialog-badge {
    width: 30px;
    height: 30px;
    padding: 4px;
    border-radius: 8px;
    background-image: var(--grad-purple);
    display: flex;
    align-items: center;
    justify-content: center;
}
.blog-builder__mini-badge img,
.blog-builder__dialog-badge img {
    width: 22px;
    height: 22px;
    display: block;
}
.blog-builder__mini-title,
.blog-builder__dialog-title {
    margin: 0;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 600;
    color: #222021;
}
.blog-builder__mini-list {
    margin: 0;
    padding-left: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
}
.blog-builder__mini-n {
    font-weight: 500;
    color: #222021;
}

/* ---------- Dialog-card (.blog3__dialog) --------------------------------- */
.blog-builder__quotes {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.blog-builder__quote {
    display: flex;
    gap: 8px;
    align-items: center;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
}
.blog-builder__quote-dot {
    width: 4px;
    height: 4px;
    border-radius: 999px;
    background: var(--text-secondary);
    flex: 0 0 auto;
}
.blog-builder__dialog-closing {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
}

/* ---------- Checkcard (.blog9__checkcard) -------------------------------- */
.blog-builder__checkcard {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.blog-builder__checkcard-title {
    margin: 0;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 600;
    color: #222021;
}
.blog-builder__checkcard-items {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.blog-builder__checkcard-item {
    display: flex;
    gap: 8px;
    align-items: flex-start;
}
.blog-builder__checkcard-box {
    width: 24px;
    height: 24px;
    border: 1px solid rgba(164, 155, 175, 0.35);
    border-radius: 6px;
    padding: 4px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
}
.blog-builder__checkcard-box img {
    width: 16px;
    height: 16px;
    display: block;
}
.blog-builder__checkcard-text {
    margin: 2px 0 0;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
    flex: 1 1 auto;
}
.blog-builder__checkcard-final {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 500;
    background-image: linear-gradient(175deg, #9d64e2 0%, #7b40c2 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

/* ---------- Lifehack-card (.blog9__lifehacks) ---------------------------- */
.blog-builder__lifehack {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.blog-builder__lifehack-badge {
    width: 30px;
    height: 30px;
    padding: 4px;
    border-radius: 8px;
    background: var(--grad-purple);
    display: flex;
    align-items: center;
    justify-content: center;
}
.blog-builder__lifehack-badge img {
    width: 22px;
    height: 22px;
    display: block;
}
.blog-builder__lifehack-title {
    margin: 0;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 600;
    color: #222021;
}

/* ---------- Big-card (.blog4__big) --------------------------------------- */
.blog-builder__big {
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.blog-builder__big-section {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.blog-builder__big-h {
    margin: 0;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 600;
    color: #222021;
}
.blog-builder__big-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
}
.blog-builder__big-body p { margin: 0; }
.blog-builder__big-mix {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
}

/* ---------- Side-cards (.blog4__cards) ----------------------------------- */
.blog-builder__side-cards {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.blog-builder__side-card {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.blog-builder__side-badge {
    width: 30px;
    height: 30px;
    padding: 4px;
    border-radius: 8px;
    background: var(--grad-purple);
    display: flex;
    align-items: center;
    justify-content: center;
}
.blog-builder__side-badge img {
    width: 22px;
    height: 22px;
    display: block;
}
.blog-builder__side-title {
    margin: 0;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 600;
    color: #222021;
}
.blog-builder__side-items {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.blog-builder__side-item {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.blog-builder__side-item-title {
    font-size: 14px;
    line-height: 1.4;
    font-weight: 500;
    color: #222021;
}
.blog-builder__side-item-body {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 300;
    color: var(--text-secondary);
}

/* ---------- Raw-html fallback (для непонятых конвертером кусков) --------- */
.blog-builder__raw {
    margin: 0;
    padding: 12px 14px;
    background: #fff5d5;
    border: 1px dashed #e8c970;
    border-radius: 6px;
    font-size: 14px;
    line-height: 1.5;
    color: #1c2030;
}
.blog-builder__raw::before {
    content: 'raw-html (нераспознано конвертером)';
    display: block;
    font-size: 11px;
    color: #6b5004;
    margin: 0 0 6px;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.blog-builder__raw h2,
.blog-builder__raw h3 { margin: 8px 0; font-weight: 600; color: #1c2030; }
.blog-builder__raw p { margin: 0 0 8px; }

@media (max-width: 600px) {
    .blog-builder { gap: 30px; }
    .blog-builder__title { font-size: 24px; }
    .blog-builder__hero { border-radius: 20px; padding: 14px 0; }
}

/* === CMS-контент (TinyMCE / parsed HTML) ===================================*/
.cms-content h2 { font-size: 22px; margin: 24px 0 12px; }
.cms-content h3 { font-size: 18px; margin: 20px 0 10px; }
.cms-content h4 { font-size: 16px; margin: 16px 0 8px; }
.cms-content p  { margin: 0 0 12px; }
.cms-content ul,
.cms-content ol { margin: 0 0 12px 22px; }
.cms-content li { margin: 4px 0; }
.cms-content blockquote {
    margin: 12px 0;
    padding: 8px 14px;
    border-left: 3px solid #d6d8e0;
    color: #555;
    font-style: italic;
}
.cms-content a { color: #2c5aa0; }

/* Таблицы в CMS-контенте (legal/cookies, company.about). Card-look с лёгкой
   лавандовой шапкой; на mobile (≤640px) — block + overflow-x:auto чтобы
   широкая таблица не распирала viewport (например 4-колоночная /cookies). */
.cms-content table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin: 16px 0;
    background: var(--bg-card);
    border-radius: 14px;
    box-shadow: var(--shadow-card);
    overflow: hidden;
    font-size: 14px;
}
/* Reset border от HTML-атрибута <table border="1"> из TinyMCE-контента. */
.cms-content table th,
.cms-content table td { border: 0; }
.cms-content thead th {
    background: #f3edfb;
    text-align: left;
    padding: 12px 14px;
    color: var(--text-secondary);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 11.5px;
    border-bottom: 1px solid #e9e2f0;
}
.cms-content tbody td {
    padding: 11px 14px;
    border-bottom: 1px solid #f0ecf6;
    color: var(--text-primary);
    vertical-align: top;
}
.cms-content tbody tr:last-child td { border-bottom: 0; }
.cms-content tbody tr:nth-child(even) td { background: #fbfaff; }
.cms-content tbody tr:hover td { background: #f6f3fb; }
.cms-content tbody td:first-child {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 12.5px;
    color: #4a445b;
}

@media (max-width: 640px) {
    .cms-content table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        border-radius: 12px;
    }
    .cms-content thead, .cms-content tbody { display: table; width: max-content; min-width: 100%; }
    .cms-content thead th,
    .cms-content tbody td { padding: 9px 12px; font-size: 13px; }
}

/* === Autocomplete (search6) ================================================*/
.search6__form { position: relative; }

.ac-suggest {
    list-style: none;
    margin: 0;
    padding: 4px 0;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 50;
    background: #fff;
    border: 1px solid #c8cdd9;
    border-top: 0;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.08);
    max-height: 320px;
    overflow-y: auto;
}
.ac-suggest__item { margin: 0; }
.ac-suggest__item a {
    display: block;
    padding: 8px 12px;
    color: #222;
    text-decoration: none;
    font-size: 14px;
}
.ac-suggest__item a:hover {
    background: #f4f6f8;
}
.ac-suggest__item--city a::before    { content: '🏙  '; opacity: 0.6; }
.ac-suggest__item--company a::before { content: '🏢  '; opacity: 0.6; }

/* === Pagination (Laravel paginator) =========================================*/
.pagination {
    display: flex;
    gap: 6px;
    margin: 20px 0;
    list-style: none;
    padding: 0;
    flex-wrap: wrap;
}
.pagination li {
    display: inline-block;
}
.pagination li a,
.pagination li span {
    display: inline-block;
    padding: 6px 10px;
    border: 1px solid #c8cdd9;
    border-radius: 4px;
    color: #2c5aa0;
    background: #fff;
    font-size: 13px;
    text-decoration: none;
}
.pagination li.active span,
.pagination li a:hover {
    background: #2c5aa0;
    color: #fff;
    border-color: #2c5aa0;
}
.pagination li.disabled span {
    color: #999;
    background: #f4f4f4;
}

/* === Generic empty-state (no-results) =======================================*/
.no-results {
    padding: 32px 14px;
    text-align: center;
    color: #555;
}
.no-results img { max-width: 120px; margin: 0 auto 12px; display: block; }

/* === Страница компании /umzugsunternehmen-finden/firma/{slug} ============== */
.crumbs {
    font-size: 13px;
    color: #6a6f7d;
    margin: 12px 0 18px;
    line-height: 1.6;
}
.crumbs a { color: #2c5aa0; text-decoration: none; }
.crumbs a:hover { text-decoration: underline; }
.crumbs__sep { margin: 0 6px; color: #aab; }
.crumbs__current { color: #2a2a2a; font-weight: 600; }

/* Внутри rank8__header: H1 сверху, breadcrumbs справа под ним. */
.rank8__header .crumbs {
    text-align: right;
    margin: 6px 0 14px;
}

.firma__rating {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 10px 0 0;
    font-size: 14px;
    color: #444;
}
.firma__stars { color: #f0a500; letter-spacing: 1px; font-size: 16px; }
.firma__rating-num { font-weight: 600; color: #2a2a2a; }
.firma__rating-count { color: #6a6f7d; }

.firma__panels {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
    margin: 22px 0;
    width: 100%;
    align-self: stretch;
}

.firma__panel {
    background: #fff;
    border: 1px solid #e3e6ee;
    border-radius: 12px;
    padding: 20px 22px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.03);
}
.firma__panel-title {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 14px;
    color: #1c2237;
}
.firma__contacts-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
@media (min-width: 640px) {
    .firma__panel--contacts .firma__contacts-list {
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 20px;
    }
    .firma__panel--contacts .firma__contact {
        flex: 1 1 0;
        min-width: 0;
    }
    .firma__panel--contacts .firma__contact--address {
        flex: 0 1 190px;
        max-width: 190px;
    }
}
.firma__contact {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 14px;
    color: #333;
}
.firma__contact-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    margin-top: 2px;
    opacity: 0.75;
}
.firma__contact a { color: #2c5aa0; text-decoration: none; word-break: break-all; }
.firma__contact a:hover { text-decoration: underline; }
.firma__contact-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #8a90a0;
    margin-bottom: 1px;
}

.firma__about {
    font-size: 14px;
    line-height: 1.65;
    color: #2a2a2a;
}
.firma__about p { margin: 0 0 12px; }

.firma__similar { margin-top: 32px; }
.firma__similar-title {
    font-size: 22px;
    font-weight: 600;
    margin: 0 0 14px;
    color: #1c2237;
}

/* === Расширения reg15f__* (auth + carrier register) ======================== */
.reg15f__modal--wide { width: 920px; }

.reg15f__group {
    border: 0;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.reg15f__group-legend {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #6b5f79;
    padding: 0;
    margin: 4px 0 0;
}
.reg15f__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
.reg15f__row--zip { grid-template-columns: 160px 1fr; }
@media (max-width: 600px) {
    .reg15f__row,
    .reg15f__row--zip { grid-template-columns: 1fr; }
}

.reg15f__err {
    display: block;
    color: #c33;
    font-size: 12px;
    margin-top: 2px;
}

/* textarea с тем же классом .reg15f__input — переопределяем фиксированный
   height 36px (styles.css), даём ≈ 10 строк по умолчанию и vertical-resize. */
textarea.reg15f__input {
    height: auto;
    min-height: 240px;
    line-height: 1.5;
    resize: vertical;
}

.reg15f__alt {
    margin: 4px 0 0;
    font-size: 12px;
    line-height: 1.4;
    color: #6b5f79;
    text-align: center;
}
.reg15f__alt a {
    color: #2c5aa0;
    text-decoration: none;
    margin-left: 4px;
}

/* Показать/скрыть пароль — обёртка вставляется скриптом password-toggle.js
   вокруг каждого input.reg15f__input[type=password], разметку в Blade менять
   не нужно. */
.reg15f__pass-wrap {
    position: relative;
    display: block;
    width: 100%;
}
.reg15f__input--pass {
    padding-right: 40px;
}
.reg15f__pass-toggle {
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    color: #6b5f79;
}
.reg15f__pass-toggle:hover { color: #222021; }
.reg15f__pass-toggle svg { width: 18px; height: 18px; }
.reg15f__alt a:hover { text-decoration: underline; }

/* === /fuer-umzugsunternehmen — пара кнопок Registrieren + Anmelden ========= */
.biz14__cta {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: center;
}
.biz14__btn--ghost {
    --btn-grad: transparent;
    background: #fff;
    color: #3a2e1f;
    border: 1px solid #f0a500;
    box-shadow: none;
}
.biz14__btn--ghost:hover { background: #fff7e2; }

/* === Кабинет перевозчика (Stage 10) ======================================== */
.main--firma-cabinet { padding: 24px 0 60px; }

.firma-cabinet {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 24px;
    align-items: flex-start;
}
@media (max-width: 860px) {
    .firma-cabinet { grid-template-columns: 1fr; }
}

/* min-width: 0 на grid items — иначе содержимое (KPI auto-fill / широкие
   таблицы) распирает grid track выше 1fr и контейнер выходит за viewport. */
.firma-cabinet__aside,
.firma-cabinet__content { min-width: 0; }

.firma-cabinet__aside {
    background: #fff;
    border-radius: 24px;
    box-shadow: var(--shadow-card, 0 8px 24px rgba(0,0,0,0.05));
    padding: 20px 18px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    position: sticky;
    top: 20px;
}
/* На mobile aside идёт первым row, sticky не имеет смысла + сжимает padding. */
@media (max-width: 860px) {
    .firma-cabinet__aside { position: static; top: auto; }
    .firma-cabinet__content { padding: 18px; }
}
.firma-cabinet__brand {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 4px 6px 10px;
    border-bottom: 1px solid #f0ecf6;
}
.firma-cabinet__brand-label {
    font-size: 11px;
    color: #9d96aa;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.firma-cabinet__brand-name {
    font-size: 14px;
    color: #222021;
    word-break: break-word;
}

.firma-cabinet__nav {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.firma-cabinet__nav a {
    display: block;
    padding: 9px 12px;
    border-radius: 10px;
    font-size: 14px;
    color: #4a445b;
    text-decoration: none;
    transition: background 0.12s;
}
.firma-cabinet__nav a:hover { background: #f6f3fb; }
.firma-cabinet__nav a.is-active {
    background: linear-gradient(176deg, #ffd253 0%, #f9a51a 100%);
    color: #3a2e1f;
    font-weight: 600;
}

.firma-cabinet__logout {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #eae4f3;
}
.firma-cabinet__logout button {
    width: 100%;
    background: #fff;
    border: 1px solid #d8dce8;
    text-align: center;
    padding: 10px 14px;
    color: #4a445b;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    border-radius: 10px;
    transition: background 160ms ease, border-color 160ms ease, color 160ms ease;
}
.firma-cabinet__logout button::before {
    content: '↩  ';
    opacity: 0.7;
    margin-right: 2px;
}
.firma-cabinet__logout button:hover {
    background: #fdecec;
    border-color: #f1bcbc;
    color: #8a1f1f;
}

.firma-cabinet__content {
    background: #fff;
    border-radius: 24px;
    box-shadow: var(--shadow-card, 0 8px 24px rgba(0,0,0,0.05));
    padding: 28px;
    min-height: 480px;
}

.firma-cabinet__flash {
    padding: 12px 16px;
    border-radius: 10px;
    margin: 0 0 18px;
    font-size: 14px;
}
.firma-cabinet__flash--ok  { background: #e9f7ec; border-left: 4px solid #4a9d5e; color: #1d6b35; }
.firma-cabinet__flash--err { background: #fdecec; border-left: 4px solid #c84a4a; color: #8a1f1f; }
.firma-cabinet__flash--err ul { margin: 6px 0 0 20px; }

.firma-cabinet h1 {
    margin: 0 0 20px;
    font-size: 22px;
    font-weight: 600;
    color: #222021;
}
.firma-cabinet h2 {
    margin: 24px 0 12px;
    font-size: 16px;
    font-weight: 600;
    color: #222021;
}

.firma-cabinet__tabs {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    border-bottom: 1px solid #f0ecf6;
    margin: 0 0 18px;
    padding: 0;
}
.firma-cabinet__tabs a {
    padding: 8px 14px;
    border-radius: 10px 10px 0 0;
    font-size: 13px;
    color: #6b5f79;
    text-decoration: none;
    border: 1px solid transparent;
    border-bottom: 0;
}
.firma-cabinet__tabs a.is-active {
    background: #f6f3fb;
    color: #222021;
    border-color: #f0ecf6;
}

.firma-kpi {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 14px;
    margin: 0 0 24px;
}
.firma-kpi__card {
    background: #f9f7fd;
    border: 1px solid #f0ecf6;
    border-radius: 14px;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.firma-kpi__label { font-size: 12px; color: #6b5f79; text-transform: uppercase; letter-spacing: 0.05em; }
.firma-kpi__value { font-size: 28px; font-weight: 600; color: #222021; line-height: 1.1; }

.firma-cabinet__table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}
/* На mobile широкая таблица: display:block + overflow-x:auto, иначе колонки
   с длинными строками («Berlin → Frankfurt am Main») распирают контейнер. */
@media (max-width: 600px) {
    .firma-cabinet__table { display: block; overflow-x: auto; white-space: nowrap; }
}
.firma-cabinet__table th,
.firma-cabinet__table td {
    border-bottom: 1px solid #f0ecf6;
    padding: 10px 8px;
    text-align: left;
    vertical-align: top;
}
.firma-cabinet__table th { font-size: 12px; color: #6b5f79; text-transform: uppercase; letter-spacing: 0.05em; }

/* Ссылки внутри таблиц кабинета — визуально явные, не как обычный текст. */
.firma-cabinet__table tbody tr:hover { background: #faf8fd; }
.firma-cabinet__table tbody a {
    color: #5a6cc1;
    text-decoration: none;
    font-weight: 600;
    border-bottom: 1px dashed #c5cae8;
    padding-bottom: 1px;
    transition: color 0.12s, border-color 0.12s;
}
.firma-cabinet__table tbody a:hover {
    color: #2c3a8a;
    border-bottom-style: solid;
    border-bottom-color: #2c3a8a;
}
/* Маленькие inline-actions в таблице (bearbeiten, ansehen) — тоньше. */
.firma-cabinet__table tbody td:last-child a { font-weight: 500; font-size: 13px; }

.firma-pill {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.6;
}
.firma-pill--active    { background: #e6f6ea; color: #1d6b35; }
.firma-pill--draft     { background: #fdf4d6; color: #8a5a14; }
.firma-pill--expired   { background: #f2eef6; color: #6b5f79; }
.firma-pill--completed { background: #e8eef7; color: #2c5aa0; }
.firma-pill--deleted   { background: #fdecec; color: #8a1f1f; }
.firma-pill--new       { background: #fff3d6; color: #8a5a14; }
.firma-pill--viewed    { background: #e8eef7; color: #2c5aa0; }
.firma-pill--answered  { background: #e6f6ea; color: #1d6b35; }
.firma-pill--closed    { background: #f2eef6; color: #6b5f79; }
.firma-pill--spam      { background: #fdecec; color: #8a1f1f; }

.firma-cabinet__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 18px;
    align-items: center;
}

/* Кнопки кабинета — общая база (наследует от reg15f__submit, добавляем варианты). */
.firma-cabinet__btn {
    border: 0;
    border-radius: 10px;
    padding: 10px 20px;
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    line-height: 1.4;
}
.firma-cabinet__btn--primary {
    background-image: linear-gradient(176deg, #ffd253 0%, #f9a51a 100%);
    color: #3a2e1f;
}
.firma-cabinet__btn--ghost {
    background: #e8eef7;
    color: #2c5aa0;
}
.firma-cabinet__btn--ghost:hover { background: #d8e4f3; }
.firma-cabinet__btn--danger {
    background: #fff;
    color: #c84a4a;
    border: 1px solid #f1bcbc;
}
.firma-cabinet__btn--danger:hover { background: #fdecec; border-color: #c84a4a; }
.firma-cabinet__btn--link {
    background: none;
    color: #6b5f79;
    padding: 10px 8px;
    font-weight: 500;
}
.firma-cabinet__btn--link:hover { color: #2c3a8a; text-decoration: underline; }

.firma-cabinet__map {
    width: 100%;
    height: 360px;
    border-radius: 14px;
    border: 1px solid #e3e6ee;
    background: #f6f3fb;
    overflow: hidden;
    margin: 18px 0;
}

/* === Beiladung public (Stage 12) =========================================== */
/* Перераспределение beil-табло (2026-05-16, по запросу):
 *   - Startort = Zielort одинаковой ширины
 *   - Datum −1 плитка, Freie m³ −1 плитка → отдаются start/ziel/company
 *
 * Плитка = 12px width + 2px gap = 14px единица; -2 в конце (без последнего gap).
 * Index (form):     8/18/18/4/23 → 110+250+250+54+320 = 984 + 4×10px gap = 1024.
 * Results (2026-07-10, по запросу клиента): отступы между колонками увеличены
 * с 3px до 10px — как на /beiladung. Колонка company сужена 348→320
 * (лимит символов в results.blade.php тоже уменьшен 25→23), чтобы сумма
 * осталась 1024px — .beil__results имеет overflow:hidden, шире нельзя.
 * Results:          8/18/18/4/23 → 110+250+250+54+320 = 984 + 4×10px gap = 1024.
 */
.beil--form .beil__table-head,
.beil--form .beil__row {
    grid-template-columns: 110px 250px 250px 54px 320px;
}
.beil--results .beil__table-head,
.beil--results .beil__row {
    grid-template-columns: 110px 250px 250px 54px 320px;
}

/* Mobile: сбрасываем 5-колоночную сетку — каждая ячейка отдельной строкой,
   label сверху, табло снизу. Заголовок-строка таблицы скрыта (labels у ячеек). */
@media (max-width: 1100px) {
    .beil--form .beil__table-head,
    .beil--results .beil__table-head {
        display: none;
    }
    .beil--form .beil__row,
    .beil--results .beil__row {
        grid-template-columns: 1fr;
        row-gap: 12px;
    }
}

/* Order page: 2-колоночный layout (sidebar + form) */
.beil-order__grid {
    display: grid;
    grid-template-columns: minmax(280px, 380px) 1fr;
    gap: 22px;
    align-items: flex-start;
    margin-top: 22px;
}
@media (max-width: 860px) {
    .beil-order__grid { grid-template-columns: 1fr; }
}
.beil-order__sidebar { display: flex; flex-direction: column; gap: 16px; }
.beil-order__panel {
    background: #fff;
    border: 1px solid #e3e6ee;
    border-radius: 14px;
    padding: 18px 22px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.03);
}
.beil-order__panel-title { margin: 0 0 12px; font-size: 14px; text-transform: uppercase; letter-spacing: 0.05em; color: #6b5f79; }
.beil-order__company { margin: 0 0 8px; font-weight: 600; font-size: 16px; color: #1c2237; }
.beil-order__panel p { margin: 4px 0; font-size: 14px; }
.beil-order__panel a { color: #2c5aa0; text-decoration: none; }
.beil-order__panel a:hover { text-decoration: underline; }
.beil-order__map {
    width: 100%;
    height: 320px;
    border-radius: 14px;
    border: 1px solid #e3e6ee;
    background: #f6f3fb;
    overflow: hidden;
}
.beil-order__form { background: #fff; border-radius: 14px; padding: 22px; border: 1px solid #e3e6ee; }
.beil-order__form fieldset { padding: 0; border: 0; margin: 0 0 16px; }
.firma-cabinet__map-stub {
    background: repeating-linear-gradient(45deg, #f6f3fb, #f6f3fb 10px, #f0ecf6 10px, #f0ecf6 20px);
    border-radius: 14px;
    padding: 60px 20px;
    text-align: center;
    color: #6b5f79;
    font-size: 13px;
    margin: 18px 0;
}

/* === Cookie consent banner (spatie/laravel-cookie-consent) ================ */
/* Перекрывает дефолтные Tailwind-классы спатье — у нас Tailwind не подключён. */
.cookie-banner {
    position: fixed;
    left: 16px;
    right: 16px;
    bottom: 16px;
    z-index: 1000;
    background: #1c2237;
    color: #fff;
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
    padding: 16px 18px;
    max-width: 980px;
    margin: 0 auto;
    animation: cookie-banner-slide-up 280ms ease-out;
}
@keyframes cookie-banner-slide-up {
    from { transform: translateY(20px); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}
.cookie-banner__inner {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}
.cookie-banner__icon {
    font-size: 26px;
    line-height: 1;
    flex: 0 0 auto;
}
.cookie-banner__message {
    flex: 1 1 280px;
    margin: 0;
    font-size: 13.5px;
    line-height: 1.55;
    color: #e9ecf5;
}
.cookie-banner__message a { color: #ffd253; text-decoration: underline; }
.cookie-banner__message a:hover { color: #ffe79d; }
.cookie-banner__btn {
    flex: 0 0 auto;
    background-image: linear-gradient(162.89deg, #ffd253 0%, #f9a51a 100%);
    color: #3a2e1f;
    border: 0;
    border-radius: 10px;
    padding: 10px 22px;
    font-weight: 700;
    font-size: 13px;
    cursor: pointer;
    transition: filter 160ms ease, box-shadow 160ms ease;
    box-shadow: 0 4px 10px rgba(249, 165, 26, 0.35);
}
.cookie-banner__btn:hover { filter: brightness(1.05) saturate(1.05); }
.cookie-banner__btn:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}
@media (max-width: 600px) {
    .cookie-banner { left: 8px; right: 8px; bottom: 8px; padding: 14px; }
    .cookie-banner__inner { gap: 10px; }
    .cookie-banner__icon { font-size: 22px; }
    .cookie-banner__message { font-size: 13px; flex-basis: 100%; }
    .cookie-banner__btn { width: 100%; padding: 11px 18px; }
}

/* ── AI-Helfer (25.10.2026): этапы ответа, источник и оценки — как в бета-чате aipanel.
   Разметку создаёт script.js (раздел AI CHAT). */
.ask5__reply {
  align-self: flex-start;
  max-width: 85%;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ask5__reply .ask5__bubble { max-width: 100%; }
.ask5__progress {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  line-height: 18px;
}
.ask5__progress .ask5__dots { flex-shrink: 0; }
.ask5__answer > :last-child { margin-bottom: 0; }
.ask5__bubble--ai ol {
  margin: 10px 0 14px 18px;
  list-style: decimal;
}
.ask5__bubble--ai a {
  color: #ffffff;
  text-decoration: underline;
  text-underline-offset: 2px;
  overflow-wrap: anywhere;
}
.ask5__bubble--ai a:hover { opacity: 0.85; }
.ask5__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 14px;
  padding: 0 6px;
  font-size: 12px;
  font-weight: 300;
  color: #6b5f79;
}
.ask5__rate {
  display: flex;
  gap: 4px;
  margin-left: auto;
}
.ask5__rate-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font: inherit;
  font-size: 12px;
  font-weight: 300;
  color: #6b5f79;
  background: none;
  border: 0;
  border-radius: 999px;
  padding: 4px 9px;
  cursor: pointer;
  transition: background 0.18s ease, color 0.18s ease;
}
.ask5__rate-btn svg {
  width: 14px;
  height: 14px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ask5__rate-btn:hover { background: #eee1fc; color: #7b40c2; }
.ask5__rate-btn:focus-visible { outline: 2px solid #9d64e2; outline-offset: 1px; }
.ask5__rate-btn:disabled { cursor: default; }
.ask5__send:disabled { opacity: 0.6; cursor: default; }
@media (max-width: 720px) {
  .ask5__reply { max-width: 92%; }
}
@media (prefers-reduced-motion: reduce) {
  .ask5__dots span { animation: none; opacity: 0.9; }
}