
/* Базовые стили страниц операций */
.op-page {
    --op-blue: #0870df;
    --op-navy: #102c52;
    --op-muted: #58708e;
    color: var(--op-navy);
    font-family: inherit;
}

.op-page * {
    box-sizing: border-box;
}

.op-page .wrap {
    width: min(1280px, calc(100% - 64px));
    margin-inline: auto;
}

.op-page h1,
.op-page h2,
.op-page h3,
.op-page p {
    margin-top: 0;
}

.op-page a {
    text-decoration: none;
}

.op-page .op-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #fff;
    color: var(--op-blue);
    font-size: 29px;
    box-shadow: 0 5px 20px rgba(19, 73, 124, .07);
}

.op-page .op-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 51px;
    padding: 13px 22px;
    border-radius: 7px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
}

.op-page .op-btn-primary {
    background: #086bd6;
    color: #fff;
}

.op-page .op-btn-primary:hover {
    background: #0056b3;
}

.op-page .op-btn-outline {
    border: 1px solid #8bbcff;
    background: #fff;
    color: #0765c7;
}

/* Восстановленные стили содержательных секций */
.op-page h2 { font-size: clamp(27px, 2.5vw, 39px); line-height: 1.15; letter-spacing: -.025em; margin-bottom: 20px; }
.op-page p { line-height: 1.55; }
.op-page .op-section { padding: 32px 0; }
.op-page .op-heading-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; margin-bottom: 20px; }
.op-page .op-heading-row h2 { margin-bottom: 10px; }
.op-page .op-heading-row p { max-width: 730px; color: #506b8b; font-size: 17px; }
.op-page .op-text-link { white-space: nowrap; font-weight: 700; color: #006bd5; font-size: 14px; margin-top: 12px; }
.op-page .op-card-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.op-page .op-condition { min-width: 0; background: #fff; border: 1px solid #e2ebf6; border-radius: 12px; overflow: hidden; box-shadow: 0 9px 24px #0b366009; }
.op-page .op-condition-img { height: 180px; background: #eaf4fd; }
.op-page .op-condition-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.op-page .op-condition-body { padding: 19px; }
.op-page .op-condition h3 { font-size: 17px; line-height: 1.3; margin-bottom: 9px; }
.op-page .op-condition p { font-size: 14px; color: #627a96; margin: 0; }
@media (max-width: 1100px) {
    .op-page .op-card-grid { gap: 13px; }
    .op-page .op-condition-img { height: 140px; }
}
@media (max-width: 760px) {
    .op-page .op-section { padding: 38px 0; }
    .op-page .op-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 450px) {
    .op-page .op-card-grid { grid-template-columns: 1fr; }
    .op-page .op-condition-img { height: 185px; }
}

/* =========================================
   HERO — ЕДИНЫЙ ШАБЛОН ВСЕХ ОПЕРАЦИЙ
   ========================================= */

.op-page .op-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background-color: #edf6fc;
}

/* Общий фон клиники */
.op-page .op-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;

    background-image: url('/images/operation-hero-common.webp');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

/* Сетка первого экрана */
.op-page .op-hero .op-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 56%) minmax(0, 44%);
    align-items: stretch;
    width: min(1280px, calc(100% - 64px));
    min-height: 550px;
    margin-inline: auto;
}

/* Левая колонка */
.op-page .op-hero .op-hero-copy {
    position: relative;
    z-index: 3;
    min-width: 0;
    padding: 28px 20px 38px 0;
}

.op-page .op-breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    color: #66809e;
    font-size: 12px;
    margin-bottom: 25px;
}

.op-page .op-breadcrumbs a {
    color: inherit;
}

.op-page .op-eyebrow {
    font-size: 13px;
    letter-spacing: .06em;
    color: #52749c;
    font-weight: 700;
    margin-bottom: 10px;
}

.op-page .op-hero h1 {
    font-size: clamp(36px, 3.6vw, 58px);
    line-height: 1.07;
    letter-spacing: -.04em;
    margin-bottom: 18px;
}

.op-page .op-hero .op-lead {
    max-width: 610px;
    font-size: 17px;
    line-height: 1.55;
    color: #425e80;
}


/* Единые преимущества для всех операций */
.op-page .op-hero .op-benefits {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin: 26px 0;
}

.op-page .op-hero .op-benefit {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

/* Строго круглые иконки 56 x 56 */
.op-page .op-hero .op-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 56px;
    width: 56px;
    height: 56px;
    min-width: 56px;
    min-height: 56px;
    padding: 0;
    margin: 0 0 12px;
    border-radius: 50%;
    background: #fff;
    color: #0870df;
    box-shadow: 0 5px 20px rgba(19, 73, 124, .07);
}

/* Одинаковый размер рисунков внутри */
.op-page .op-hero .op-icon svg {
    display: block;
    width: 25px;
    height: 25px;
    flex-shrink: 0;
}

.op-page .op-hero .op-benefit strong {
    display: block;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
    color: #102c52;
}

@media (max-width: 760px) {
    .op-page .op-hero .op-benefits {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
    }
}


.op-page .op-hero .op-hero-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
}

/* Правая колонка */
.op-page .op-hero .op-hero-art {
    position: relative;
    z-index: 1;
    min-width: 0;
    min-height: 550px;
    overflow: visible;
    background: transparent;
}



/* Анатомическая иллюстрация — на всю высоту баннера */
.op-page .op-hero .op-hero-anatomy {
    position: absolute;
    z-index: 1;
    top: 0;
    bottom: 0;
    right: -110px;
    width: 85%;
    height: 100%;
    overflow: visible;
    pointer-events: none;
}

.op-page .op-hero .op-hero-anatomy img {
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: auto;
    max-width: none;
    height: 100%;
    object-fit: contain;
}



/* Портрет врача */
.op-page .op-hero .op-hero-doctor {
    position: absolute;
    left: -60px;
    bottom: 0;
    z-index: 2;
    width: 77%;
    height: 94%;
    overflow: visible;
}

.op-page .op-hero .op-hero-doctor img {
    position: absolute;
    left: 50%;
    bottom: 0;
    display: block;
    width: auto;
    max-width: none;
    height: 100%;
    object-fit: contain;
    object-position: center bottom;
    transform: translateX(-50%);
}



/* Девиз врача — слева от портрета */
.op-page .op-hero .op-hero-quote {
    position: absolute;
    z-index: 3;
    top: 13%;
    right: auto;
    left: -115px;
    width: 180px;
    max-width: 180px;
    font: italic 21px/1.4 Georgia, serif;
    color: #2d587e;
    text-align: center;
    transform: rotate(-5deg);
}



/* Плашка с именем */
.op-page .op-hero .op-hero-tag {
    position: absolute;
    z-index: 4;
    right: 0;
    bottom: 24px;
    max-width: 225px;
    padding: 15px 18px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(14, 49, 81, .13);
}

.op-page .op-hero .op-hero-tag strong {
    display: block;
    font-size: 15px;
    line-height: 1.35;
}

.op-page .op-hero .op-hero-tag small {
    display: block;
    margin-top: 8px;
    color: #637993;
}

/* =========================================
   ПЛАНШЕТЫ
   ========================================= */

@media (max-width: 1100px) {
    .op-page .op-hero .op-hero-grid {
        width: calc(100% - 40px);
        grid-template-columns: minmax(0, 58%) minmax(0, 42%);
    }

    .op-page .op-hero .op-hero-doctor {
        left: -25px;
        width: 85%;
        height: 88%;
    }

    .op-page .op-hero .op-hero-quote {
        font-size: 19px;
    }
}

/* =========================================
   МОБИЛЬНЫЕ УСТРОЙСТВА
   ========================================= */

@media (max-width: 760px) {
    .op-page .op-hero .op-hero-grid {
        display: flex;
        flex-direction: column;
        width: calc(100% - 32px);
        min-height: 0;
    }

    .op-page .op-hero .op-hero-copy {
        padding: 24px 0 12px;
    }

    .op-page .op-hero h1 {
        font-size: clamp(33px, 8vw, 49px);
    }

    .op-page .op-hero .op-lead {
        font-size: 16px;
    }

    .op-page .op-hero .op-benefits {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .op-page .op-hero .op-hero-art {
        height: 350px;
        min-height: 350px;
    }

    .op-page .op-hero .op-hero-anatomy {
        width: 48%;
    }

    .op-page .op-hero .op-hero-doctor {
        left: 4%;
        width: 72%;
        height: 98%;
    }

    .op-page .op-hero .op-hero-quote {
        right: 1%;
        top: 11%;
        font-size: 17px;
        max-width: 125px;
    }

    .op-page .op-hero .op-hero-tag {
        right: 0;
        bottom: 12px;
        padding: 11px 13px;
    }
}

@media (max-width: 450px) {
    .op-page .op-hero .op-hero-actions .op-btn {
        width: 100%;
    }

    .op-page .op-hero .op-hero-doctor {
        left: 0;
        width: 76%;
    }

    .op-page .op-hero .op-hero-quote {
        font-size: 15px;
    }

    .op-page .op-hero .op-hero-tag {
        max-width: 175px;
    }
}


/* ОПЕРАЦИЯ — без внешних полос, изображение внутри контейнера */
.op-page .op-surgery{margin:0;padding:0;background:#f2f8fc;overflow:hidden}
.op-page .op-surgery-grid{display:grid;grid-template-columns:minmax(0,49%) minmax(0,51%);gap:0;align-items:center;min-width:0}
.op-page .op-surgery-copy{position:relative;z-index:1;min-width:0;padding:38px 28px 38px 0}
.op-page .op-surgery-copy>p{max-width:550px;color:#526e8c;font-size:16px;line-height:1.6}
.op-page .op-number-list{list-style:none;counter-reset:opstep;margin:24px 0 26px;padding:0}
.op-page .op-number-list li{counter-increment:opstep;position:relative;min-height:45px;padding:4px 0 15px 49px;color:#17365e;font-size:16px;line-height:1.4}
.op-page .op-number-list li::before{content:counter(opstep);position:absolute;top:0;left:0;z-index:1;display:grid;place-items:center;width:33px;height:33px;border-radius:50%;background:#328fe6;color:#fff;font-weight:700}
.op-page .op-number-list li:not(:last-child)::after{content:"";position:absolute;top:33px;bottom:0;left:16px;border-left:2px solid #bddcf9}
.op-page .op-surgery-visual{position:relative;min-width:0;width:100%;height:410px;overflow:hidden;background:#f2f8fc}
.op-page .op-surgery-visual>img{display:block;width:100%;height:100%;max-width:100%;object-fit:contain;object-position:center right}
.op-page .op-surgery-visual .op-annotation{display:none}
@media(max-width:900px){.op-page .op-surgery-grid{grid-template-columns:1fr}.op-page .op-surgery-copy{padding:36px 0 16px}.op-page .op-surgery-visual{height:auto;aspect-ratio:16/9}.op-page .op-surgery-visual>img{height:100%}}
@media(max-width:600px){.op-page .op-surgery-copy{padding:30px 0 15px}.op-page .op-number-list li{font-size:15px}}


/* =========================================
   ПОДГОТОВКА И ВОССТАНОВЛЕНИЕ
   ========================================= */

.op-page .op-recovery {
  padding: 48px 0 54px;
background: #f8fbff;
    
}

.op-page .op-recovery .op-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 28px;
}

.op-page .op-recovery .op-section-head h2 {
  margin: 0;
  color: #102d53;
  font-size: clamp(28px, 2.5vw, 38px);
  line-height: 1.2;
  font-weight: 700;
}

.op-page .op-recovery .op-section-head a {
  color: #006bd6;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.op-page .op-recovery-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 0.85fr;
  gap: 18px;
  align-items: stretch;
}

.op-page .op-recovery-card {
  min-width: 0;
  padding: 25px 26px;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 5px 22px rgba(27, 79, 128, 0.035);
}

.op-page .op-recovery-heading {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 19px;
}

.op-page .op-recovery-icon {
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #fff;
  color: #0876e6;
  font-size: 27px;
  line-height: 1;
  box-shadow: 0 5px 18px rgba(20, 75, 125, 0.08);
}

.op-page .op-recovery-heading h3,
.op-page .op-recovery-term-inner h3 {
  margin: 0;
  color: #102d53;
  font-size: 17px;
  line-height: 1.35;
  font-weight: 700;
}

.op-page .op-recovery-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.op-page .op-recovery-list li {
  position: relative;
  padding-left: 24px;
  margin-bottom: 12px;
  color: #4d6685;
  font-size: 14px;
  line-height: 1.5;
}

.op-page .op-recovery-list li:last-child {
  margin-bottom: 0;
}

.op-page .op-recovery-list li::before {
  content: "✓";
  position: absolute;
  top: 0;
  left: 0;
  color: #0876e6;
  font-size: 17px;
  font-weight: 700;
}

/* Третья карточка */

.op-page .op-recovery-card--term {
  padding: 17px;
  display: flex;
  background: #e7f2ff;
}

.op-page .op-recovery-term-inner {
  width: 100%;
  padding: 17px 20px;
  background: #f5f9fe;
  border-radius: 12px;
}

.op-page .op-recovery-term-inner .op-recovery-icon {
  margin-bottom: 12px;
}

.op-page .op-recovery-term-inner strong {
  display: block;
  margin: 13px 0;
  color: #0870d8;
  font-size: 28px;
  line-height: 1.2;
  font-weight: 800;
}

.op-page .op-recovery-term-inner p {
  margin: 0;
  color: #647b98;
  font-size: 13px;
  line-height: 1.55;
}

/* Адаптивность */

@media (max-width: 900px) {
  .op-page .op-recovery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .op-page .op-recovery-card--term {
    grid-column: 1 / -1;
  }
}

@media (max-width: 600px) {
  .op-page .op-recovery {
    padding: 38px 0;
  }

  .op-page .op-recovery .op-section-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .op-page .op-recovery-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .op-page .op-recovery-card--term {
    grid-column: auto;
  }

  .op-page .op-recovery-card {
    padding: 22px;
  }

  .op-page .op-recovery-card--term {
    padding: 14px;
  }
}


/* ==========================================
   РЕЗУЛЬТАТЫ И ПРЕИМУЩЕСТВА
   ========================================== */

.op-page .op-results {
  padding: 32px 0;
  background: #ffffff;
}

.op-page .op-results h2 {
  margin: 0 0 28px;
  color: #102d53;
  font-size: clamp(28px, 2.4vw, 36px);
  line-height: 1.2;
  font-weight: 700;
}

.op-page .op-values {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}

.op-page .op-values .op-value {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  min-width: 0;
}

.op-page .op-values .op-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  flex: 0 0 54px;
  border-radius: 50%;
  background: #ffffff;
  color: #0877ed;
  box-shadow: 0 5px 22px rgba(23, 85, 149, 0.07);
}

.op-page .op-values .op-icon svg {
  width: 27px;
  height: 27px;
}

.op-page .op-value h3 {
  margin: 4px 0 7px;
  color: #102d53;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
}

.op-page .op-value p {
  margin: 0;
  color: #667f9c;
  font-size: 13px;
  line-height: 1.55;
}


/* ==========================================
   FAQ И ОТЗЫВЫ — СВЕТЛО-ГОЛУБОЙ ФОН
   ========================================== */

.op-page .op-faq-reviews {
  padding: 50px 0 58px;
  background: #f8fbff;
}

.op-page .op-faq-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  gap: 45px;
  align-items: start;
}

.op-page .op-faq-column,
.op-page .op-reviews-column {
  min-width: 0;
}

.op-page .op-heading-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 24px;
}

.op-page .op-heading-row h2 {
  margin: 0;
  color: #102d53;
  font-size: clamp(26px, 2.3vw, 34px);
  line-height: 1.2;
  font-weight: 700;
}

.op-page .op-heading-row .op-text-link {
  color: #006bd6;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}


/* FAQ — БЕЛЫЕ ПЛАШКИ */

.op-page .op-accordion {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.op-page .op-accordion details {
  background: #ffffff;
  border: 1px solid #e8f0f9;
  border-radius: 7px;
  overflow: hidden;
}

.op-page .op-accordion summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 44px;
  padding: 10px 15px;
  color: #17345a;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 500;
  cursor: pointer;
  list-style: none;
}

.op-page .op-accordion summary::-webkit-details-marker {
  display: none;
}

.op-page .op-accordion summary::before {
  content: "+";
  color: #0877ed;
  font-size: 18px;
  font-weight: 700;
  flex: 0 0 12px;
}

.op-page .op-accordion summary::after {
  content: "+";
  color: #5c81b0;
  font-size: 16px;
  font-weight: 400;
  margin-left: auto;
}

.op-page .op-accordion details[open] summary::before,
.op-page .op-accordion details[open] summary::after {
  content: "−";
}

.op-page .op-accordion details p {
  margin: 0;
  padding: 0 18px 17px 39px;
  color: #607a98;
  font-size: 13px;
  line-height: 1.6;
}


/* ОТЗЫВ — БЕЛАЯ ПЛАШКА */

.op-page .op-review {
  position: relative;
  padding: 22px 24px 20px;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 7px 25px rgba(20, 70, 120, 0.04);
}

.op-page .op-quote-mark {
  display: block;
  height: 39px;
  color: #b4ceee;
  font-family: Georgia, serif;
  font-size: 53px;
  font-weight: 700;
  line-height: 1;
}

.op-page .op-review blockquote {
  margin: 8px 0 18px;
  padding: 0;
  border: 0;
  color: #526c8b;
  font-size: 14px;
  font-style: normal;
  line-height: 1.6;
}

.op-page .op-review strong {
  display: block;
  color: #102d53;
  font-size: 14px;
  font-weight: 700;
}

.op-page .op-review-service {
  display: block;
  margin-top: 5px;
  color: #8195ad;
  font-size: 12px;
}

.op-page .op-review-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 15px;
}

.op-page .op-review-dots {
  display: flex;
  align-items: center;
  gap: 6px;
}

.op-page .op-review-dots span {
  display: block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #d7e2ee;
}

.op-page .op-review-dots span.active {
  background: #0877ed;
}

.op-page .op-review-arrows {
  display: flex;
  gap: 7px;
}

.op-page .op-review-arrows button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: #ffffff;
  color: #0877ed;
  box-shadow: 0 3px 12px rgba(15, 65, 125, 0.08);
  font-size: 23px;
}

.op-page .op-review-arrows button:disabled {
  opacity: 0.45;
  cursor: default;
}


/* ==========================================
   АДАПТИВНОСТЬ
   ========================================== */


@media (max-width: 1100px) {
    .op-page .op-hero .op-hero-quote { display: none; }
    .op-page .op-values { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .op-page .op-faq-grid { gap: 25px; }
}

@media (max-width: 800px) {
  .op-page .op-faq-grid {
    grid-template-columns: 1fr;
    gap: 38px;
  }
}

@media (max-width: 600px) {
  .op-page .op-results,
  .op-page .op-faq-reviews {
    padding: 38px 0;
  }

  .op-page .op-values {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .op-page .op-heading-row {
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 10px;
  }

  .op-page .op-review {
    padding: 20px;
  }
}


/* Совместимость с текущей разметкой отзыва */
.op-page .op-review small{display:block;color:#8496a9;font-size:12px;margin-top:12px;line-height:1.45}


/* CTA — изолирован от глобальных .cta, .btn и SVG */
.op-page .op-cta{position:relative;isolation:isolate;overflow:hidden;margin:0;padding:0;color:#fff;background:linear-gradient(105deg,#0d568f 0%,#093e76 46%,#062e5b 100%)}
.op-page .op-cta .op-cta-grid{display:grid;grid-template-columns:210px minmax(0,1fr) 230px;gap:22px;align-items:center;min-height:205px}
.op-page .op-cta .op-cta-art{align-self:stretch;min-height:205px;background:url('/images/coccyx-cta.webp') center bottom/contain no-repeat}
.op-page .op-cta .op-cta-copy{min-width:0;padding:24px 0}
.op-page .op-cta h2{color:#fff;font-size:clamp(24px,2.2vw,34px);line-height:1.18;margin:0 0 10px;letter-spacing:-.015em}
.op-page .op-cta .op-cta-copy p{color:#fff;font-size:15px;line-height:1.5;max-width:550px;margin:0 0 15px}
.op-page .op-cta .op-cta-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.op-page .op-cta .op-cta-actions a{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 16px;border-radius:5px;font-size:13px;font-weight:700;line-height:1.25;text-decoration:none}
.op-page .op-cta .op-cta-actions .op-btn-white{background:#fff;color:#0867c9;border:1px solid #fff}
.op-page .op-cta .op-cta-actions .op-btn-ghost{background:transparent;color:#fff;border:1px solid #bdd8f4}
.op-page .op-cta .op-cta-actions svg,.op-page .op-cta .op-cta-phone svg{display:inline-block;flex:0 0 18px;width:18px!important;height:18px!important;max-width:18px;max-height:18px;fill:none;stroke:currentColor;stroke-width:2;vertical-align:middle}
.op-page .op-cta .op-cta-phone{min-width:0;color:#fff}
.op-page .op-cta .op-cta-phone a{display:inline-flex;align-items:center;gap:9px;color:#fff;font-size:19px;font-weight:700;white-space:nowrap}
.op-page .op-cta .op-cta-phone small{display:block;color:#d2e3f5;font-size:12px;margin-top:5px}
@media(max-width:1100px){.op-page .op-cta .op-cta-grid{grid-template-columns:150px minmax(0,1fr) 200px;gap:15px}.op-page .op-cta .op-cta-phone a{font-size:16px}}
@media(max-width:800px){.op-page .op-cta .op-cta-grid{grid-template-columns:120px minmax(0,1fr);gap:15px;padding-block:18px}.op-page .op-cta .op-cta-art{grid-row:1/3;min-height:190px}.op-page .op-cta .op-cta-copy{padding:0}.op-page .op-cta .op-cta-phone{grid-column:2}}
@media(max-width:560px){.op-page .op-cta .op-cta-grid{grid-template-columns:1fr;gap:12px;padding-block:30px}.op-page .op-cta .op-cta-art{display:none}.op-page .op-cta .op-cta-copy,.op-page .op-cta .op-cta-phone{grid-column:1}.op-page .op-cta .op-cta-actions{flex-direction:column;align-items:stretch}.op-page .op-cta .op-cta-actions a{width:100%}}


/* Отзывы: сворачивание и переключение */

.op-page .op-review-item {
    display: none;
}

.op-page .op-review-item.is-active {
    display: block;
}

.op-page .op-review-text {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
    line-clamp: 6;
    overflow: hidden;
    margin-bottom: 10px;
}

.op-page .op-review-item.is-expanded .op-review-text {
    display: block;
    overflow: visible;
}

.op-page .op-review-toggle {
    display: inline-block;
    padding: 0;
    margin: 0 0 20px;
    border: 0;
    background: none;
    color: #0870df;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}

.op-page .op-review-author {
    margin-top: 5px;
}

.op-page .op-review-counter {
    color: #8195ad;
    font-size: 13px;
    font-weight: 600;
}

.op-page .op-review-arrows button {
    cursor: pointer;
}

.op-page .op-review-arrows button:disabled {
    opacity: .35;
    cursor: default;
}

/* Переключение отзывов */
.op-page .op-review .op-review-item {
    display: none;
}

.op-page .op-review .op-review-item.is-active {
    display: block;
}

/* Свёрнутый отзыв */
.op-page .op-review .op-review-text {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
    overflow: hidden;
    margin: 8px 0 12px;
}

.op-page .op-review .op-review-item.is-expanded .op-review-text {
    display: block;
    overflow: visible;
}

/* Кнопка раскрытия */
.op-page .op-review .op-review-toggle {
    display: inline-block;
    padding: 0;
    margin: 0 0 18px;
    border: none;
    background: transparent;
    color: #0870df;
    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
}

/* Подпись автора */
.op-page .op-review .op-review-author {
    margin-top: 5px;
}

/* Иллюстрации в карточках поясничной операции */
.op-page #indications .op-condition-img,
.op-page #rehabilitation .op-condition-img {
  width:100%; height:auto; aspect-ratio:1000 / 480; overflow:hidden; background:#edf6fc;
}
.op-page #rehabilitation .op-condition-img {aspect-ratio:1000 / 450;}
.op-page #indications .op-condition-img img,
.op-page #rehabilitation .op-condition-img img {width:100%;height:100%;display:block;object-fit:cover;}
.op-page #procedure .op-surgery-visual {border-radius:18px;}
.op-page #procedure .op-surgery-visual > img {object-fit:cover;object-position:center center;}
.op-page .op-local-video {display:block;width:100%;max-width:900px;aspect-ratio:16/9;height:auto;background:#102c52;border-radius:16px;}

/* Выравнивание основного текста по ширине */
.op-page .op-lead,
.op-page .op-heading-row p,
.op-page .op-condition-body p,
.op-page .op-surgery-copy > p,
.op-page .op-surgery-details-content p,
.op-page .op-review-text,
.op-page .op-faq-reviews .op-accordion p,
.op-page #rehabilitation > .wrap > p {
    text-align: justify;
    text-align-last: left;
    hyphens: auto;
    -webkit-hyphens: auto;
    overflow-wrap: break-word;
}

/* На мобильных: комфортное чтение */
@media (max-width: 767px) {
    .op-page .op-lead,
    .op-page .op-heading-row p,
    .op-page .op-condition-body p,
    .op-page .op-surgery-copy > p,
    .op-page .op-surgery-details-content p,
    .op-page .op-review-text,
    .op-page .op-faq-reviews .op-accordion p,
    .op-page #rehabilitation > .wrap > p {
        line-height: 1.65;
    }
}
