/* ============================
   GLOBAL — плоская клиника
============================ */
body {
    background:#f5f7f8;
    color:#243544;
    font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

h1,h2,h3 {
    color:#2f4e63;
}

/* ============================
   HERO — плоский хирургический
============================ */
.hero {
    background:#eef2f4;
    padding:80px 20px;
    border-bottom:1px solid #cdd6dd;
    border-radius:2px;
}

/* ============================
   CTA BUTTON — мягкий оранжевый
============================ */
.cta-btn {
    background:#e6a56a; /* мягкий фарма-оранжевый */
    color:#000000;      /* жирный черный текст */
    font-weight:800;
    padding:18px 40px;
    border-radius:4px;
    font-size:1.2rem;
    text-decoration:none;
    display:inline-block;
    box-shadow:none;
    transition:background .2s ease, transform .2s ease;
}

.cta-btn:hover {
    background:#d8955f;
    transform:translateY(1px);
}

/* ============================
   CARDS — плоские клинические
============================ */
.card {
    border:1px solid #cdd6dd;
    border-radius:4px;
    background:#ffffff;
    box-shadow:none;
}

#toc a {
    text-decoration:none;
    color:#2f4e63;
}
#toc a:hover {
    text-decoration:underline;
}

.equal-card {
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    height:100%;
}

/* ============================
   CTA ANIMATIONS
============================ */
@keyframes ctaPulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.04); }
    100% { transform: scale(1); }
}
.cta-pulse { animation: ctaPulse 6s ease-in-out infinite; }

.cta-btn-hover:hover { animation: none; }

.cta-animated {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}
.cta-animated.show {
    opacity: 1;
    transform: translateY(0);
}

/* ============================
   SVG ICONS — бирюза
============================ */
.benefit-icon {
    width:38px;
    height:38px;
    margin-bottom:10px;
    fill:#2fb8b8;
    opacity:0.9;
}

/* ============================
   RELATED LINKS (TILES)
============================ */
.tile {
    background:#ffffff;
    border:1px solid #cdd6dd;
    border-radius:4px;
    padding:20px;
    height:100%;
    transition:background .2s ease, transform .2s ease;
}

.tile:hover {
    background:#eef2f4;
    border-color:#bcc7cf;
    transform:translateY(-2px);
}

.tile h5 {
    color:#243544;
    font-weight:700;
    margin-bottom:6px;
}

.tile p {
    color:#2f4e63;
    margin:0;
    font-size:0.95rem;
}

.tile-link {
    text-decoration:none;
    color:inherit;
}

/* ============================
   FAQ — плоский ACCORDION
============================ */
.accordion-item {
    border:1px solid #cdd6dd;
    border-radius:4px;
    overflow:hidden;
}

.accordion-button {
    background:#eef2f4;
    color:#243544;
    font-weight:600;
    border:none;
    box-shadow:none;
    border-radius:0;
}

.accordion-button:not(.collapsed) {
    background:#e2eaee;
    color:#243544;
}

.accordion-button:hover {
    background:#f3f6f7;
}

.accordion-button:focus {
    border-color:#2fb8b8;
    box-shadow:0 0 0 0.15rem rgba(47, 184, 184, 0.45);
}

.accordion-body {
    background:#ffffff;
    color:#243544;
    border-top:1px solid #cdd6dd;
}

/* ============================
   TABLES — мягкий header + линии
============================ */
.table-responsive {
    width:100%;
    overflow-x:auto;
    margin-top:24px;
    border:1px solid #cdd6dd;
    border-radius:4px;
    background:#fff;
}

.table-responsive table {
    width:100%;
    border-collapse:collapse;
    font-size:.92rem;
}

/* Заголовки — очень мягкий оранжевый */
.table-responsive th {
    background:#f8efe7; /* почти белый, лёгкий оранжевый оттенок */
    color:#2f4e63;
    font-weight:700;
    text-align:left;
    padding:14px 16px;

    border-bottom:1px solid #dcdfe3;
    border-right:1px solid #e3e6ea; /* вертикальные линии */
}

.table-responsive th:last-child {
    border-right:none;
}

/* Ячейки — линии по всем сторонам */
.table-responsive td {
    padding:14px 16px;
    color:#334a5c;

    border-bottom:1px solid #e6e9ed; /* горизонтальные линии */
    border-right:1px solid #eef1f4;  /* вертикальные линии */
}

.table-responsive td:last-child {
    border-right:none;
}

.table-responsive tr:last-child td {
    border-bottom:none;
}

.table-responsive tr:hover td {
    background:#fafcff;
}

/* ============================
   IMAGES
============================ */
.page-img {
    max-width:360px;
    border-radius:4px;
}

@media (max-width: 768px) {
    .page-img {
        float:none !important;
        display:block !important;
        margin:0 auto 24px auto !important;
        width:100% !important;
        max-width:100% !important;
    }
}

/* CTA BOX */
.cta-box {
    background:#eef2f4;
    border:1px solid #cdd6dd;
    border-radius:4px;
    padding:24px;
    margin-top:24px;
}

.cta-box-title {
    color:#243544;
    font-weight:800;
    margin-bottom:16px;
}

.cta-box-text {
    font-size:1.05rem;
    color:#2f4e63;
    font-weight:600;
    margin-bottom:24px;
}

/* BADGES */
.cta-badges {
    margin-bottom:20px;
}

.badge-clinical {
    padding:8px 12px;
    font-weight:700;
    border-radius:4px;
    margin-right:6px;
    display:inline-block;
    color:#0a0a0a;
}

.badge-pink   { background:#f7dce2; }
.badge-yellow { background:#faeac7; }
.badge-green  { background:#e6f3d6; }
.badge-purple { background:#f1e2ff; }

/* ============================
   Sticky CTA — только кнопка
============================ */
.sticky-cta {
    position:fixed;
    bottom:20px;
    right:20px;
    z-index:9999;

    background:none !important;
    border:none !important;
    padding:0 !important;

    display:flex;
    justify-content:center;
    align-items:center;

    transition:opacity .35s ease, transform .35s ease;
}

.sticky-cta.hidden {
    opacity:0;
    transform:translateY(20px);
    pointer-events:none;
}

@media (max-width:420px) {
    .sticky-cta {
        bottom:12px;
        right:12px;
    }
    .sticky-cta .cta-btn {
        padding:14px 24px;
        font-size:1.05rem;
    }
}