/* Редизайн страницы «О компании» ПСГ. Префикс ra- изолирует стили от глобальных. */

.redesign-about-page {
    --ra-accent: var(--clr-accent, #CB2128);
    --ra-ink: var(--clr-text, #2B2D3A);
    --ra-dark: #21242F;
    --ra-line: #E4E7EE;
    --ra-muted: #6B7280;
    --ra-surface: #FFFFFF;
    --ra-soft: #F5F6F9;
    --ra-radius: 22px;
}

.redesign-about-page .ra-page {
    display: grid;
    gap: 12px;
}

.redesign-about-page .ra-shell {
    width: 100%;
    max-width: var(--container, 1420px);
    margin: 0 auto;
    padding: 0 clamp(16px, 3vw, 40px);
    box-sizing: border-box;
}

.redesign-about-page .ra-eyebrow {
    margin: 0 0 10px;
    color: var(--ra-accent);
    font-size: clamp(0.68rem, 0.64rem + 0.18vw, 0.8rem);
    letter-spacing: .09em;
    text-transform: uppercase;
}

.redesign-about-page .ra-h1 {
    margin: 0 0 18px;
    font-size: clamp(1.75rem, 1.2rem + 2.2vw, 3rem);
    line-height: 1.15;
    color: var(--ra-ink);
    overflow-wrap: break-word;
}

.redesign-about-page .ra-h2 {
    margin: 0 0 24px;
    font-size: clamp(1.3rem, 1.05rem + 0.9vw, 2rem);
    line-height: 1.2;
    color: var(--ra-ink);
    overflow-wrap: break-word;
}

.redesign-about-page h3 {
    overflow-wrap: break-word;
}

.redesign-about-page .ra-section {
    padding: clamp(20px, 2.6vw, 44px) 0;
}

/* --- Hero --- */

.redesign-about-page .ra-hero {
    padding: clamp(20px, 3vw, 48px) 0;
}

.redesign-about-page .ra-hero__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: clamp(20px, 3vw, 48px);
    align-items: center;
}

.redesign-about-page .ra-hero--noimg .ra-hero__inner {
    grid-template-columns: minmax(0, 1fr);
    max-width: 900px;
}

.redesign-about-page .ra-hero__lead {
    color: var(--ra-muted);
    font-size: clamp(0.95rem, 0.9rem + 0.25vw, 1.1rem);
    line-height: 1.55;
}

.redesign-about-page .ra-hero__lead p {
    margin: 0 0 12px;
}

.redesign-about-page .ra-hero__media img {
    width: 100%;
    height: auto;
    border-radius: var(--ra-radius);
    display: block;
}

.redesign-about-page .ra-facts {
    margin: 24px 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.redesign-about-page .ra-fact {
    padding: 12px 18px;
    border: 1px solid var(--ra-line);
    border-radius: 14px;
    background: var(--ra-surface);
    font-size: clamp(0.82rem, 0.78rem + 0.2vw, 0.95rem);
    line-height: 1.3;
}

/* --- Наш путь --- */

.redesign-about-page .ra-path {
    display: grid;
    grid-template-columns: minmax(0, 380px) minmax(0, 1fr);
    gap: clamp(18px, 2.4vw, 40px);
    align-items: start;
}

.redesign-about-page .ra-path--noimg {
    grid-template-columns: minmax(0, 1fr);
}

.redesign-about-page .ra-path__media img {
    width: 100%;
    height: auto;
    border-radius: var(--ra-radius);
    display: block;
}

.redesign-about-page .ra-path__list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(14px, 1.6vw, 24px);
    counter-reset: ra-path;
}

.redesign-about-page .ra-path--noimg .ra-path__list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.redesign-about-page .ra-path__item {
    position: relative;
    padding-top: 34px;
    counter-increment: ra-path;
}

.redesign-about-page .ra-path__item::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 0;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--ra-accent);
}

.redesign-about-page .ra-path__item::after {
    content: "";
    position: absolute;
    top: 16px;
    left: 20px;
    right: -12px;
    height: 2px;
    background: var(--ra-line);
}

.redesign-about-page .ra-path__item:last-child::after {
    display: none;
}

.redesign-about-page .ra-path__title {
    margin: 0 0 8px;
    font-size: clamp(0.95rem, 0.9rem + 0.25vw, 1.1rem);
    line-height: 1.25;
}

.redesign-about-page .ra-path__text {
    margin: 0;
    color: var(--ra-muted);
    font-size: clamp(0.82rem, 0.78rem + 0.2vw, 0.95rem);
    line-height: 1.45;
}

/* --- Цифры --- */

.redesign-about-page .ra-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(16px, 2vw, 32px);
    padding: clamp(24px, 3vw, 48px) clamp(18px, 2.4vw, 40px);
    border-radius: var(--ra-radius);
    background: var(--ra-dark);
    text-align: center;
}

.redesign-about-page .ra-stat__value {
    display: block;
    color: var(--ra-accent);
    font-size: clamp(1.6rem, 1.1rem + 2vw, 2.75rem);
    line-height: 1.1;
}

.redesign-about-page .ra-stat__label {
    display: block;
    margin-top: 8px;
    color: rgba(255, 255, 255, .8);
    font-size: clamp(0.78rem, 0.74rem + 0.2vw, 0.95rem);
    line-height: 1.35;
}

/* --- Преподаватели --- */

.redesign-about-page .ra-teachers {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(14px, 1.6vw, 24px);
}

.redesign-about-page .ra-teacher {
    border: 1px solid var(--ra-line);
    border-radius: var(--ra-radius);
    background: var(--ra-surface);
    overflow: hidden;
}

.redesign-about-page .ra-teacher__photo img {
    width: 100%;
    aspect-ratio: 3 / 4;
    object-fit: cover;
    display: block;
}

.redesign-about-page .ra-teacher__body {
    padding: 16px 18px 20px;
}

.redesign-about-page .ra-teacher__name {
    margin: 0 0 6px;
    font-size: clamp(0.95rem, 0.9rem + 0.25vw, 1.1rem);
}

.redesign-about-page .ra-teacher__dir,
.redesign-about-page .ra-teacher__note,
.redesign-about-page .ra-teacher__text {
    margin: 0 0 6px;
    color: var(--ra-muted);
    font-size: clamp(0.8rem, 0.76rem + 0.2vw, 0.92rem);
    line-height: 1.45;
}

/* --- Реестры и цепочка --- */

.redesign-about-page .ra-registry {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(14px, 1.6vw, 24px);
}

.redesign-about-page .ra-registry__card {
    padding: clamp(18px, 2vw, 28px);
    border: 1px solid var(--ra-line);
    border-radius: var(--ra-radius);
    background: var(--ra-surface);
}

.redesign-about-page .ra-registry__title {
    margin: 0 0 8px;
    font-size: clamp(1rem, 0.94rem + 0.3vw, 1.2rem);
}

.redesign-about-page .ra-registry__text {
    margin: 0;
    color: var(--ra-muted);
    font-size: clamp(0.82rem, 0.78rem + 0.2vw, 0.95rem);
    line-height: 1.45;
}

.redesign-about-page .ra-chain {
    margin: clamp(16px, 2vw, 28px) 0 0;
    padding: clamp(14px, 1.6vw, 22px);
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 18px;
    border: 1px solid var(--ra-line);
    border-radius: var(--ra-radius);
    background: var(--ra-soft);
}

.redesign-about-page .ra-chain__item {
    display: flex;
    align-items: center;
    gap: 18px;
    font-size: clamp(0.8rem, 0.76rem + 0.2vw, 0.95rem);
    color: var(--ra-ink);
}

.redesign-about-page .ra-chain__item:not(:last-child)::after {
    content: "→";
    color: var(--ra-accent);
}

/* --- Что получает заказчик --- */

.redesign-about-page .ra-client {
    display: grid;
    grid-template-columns: minmax(0, 420px) minmax(0, 1fr);
    gap: clamp(18px, 2.4vw, 40px);
    align-items: start;
}

.redesign-about-page .ra-client--noimg {
    grid-template-columns: minmax(0, 1fr);
}

.redesign-about-page .ra-client__media img {
    width: 100%;
    height: auto;
    border-radius: var(--ra-radius);
    display: block;
}

.redesign-about-page .ra-client__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(12px, 1.4vw, 20px);
}

.redesign-about-page .ra-client__card {
    padding: clamp(16px, 1.8vw, 24px);
    border: 1px solid var(--ra-line);
    border-radius: 16px;
    background: var(--ra-surface);
}

.redesign-about-page .ra-client__card--accent {
    grid-column: 3;
    grid-row: 1 / span 2;
    background: var(--ra-accent);
    border-color: var(--ra-accent);
    color: #fff;
}

.redesign-about-page .ra-client__title {
    margin: 0 0 6px;
    font-size: clamp(0.9rem, 0.86rem + 0.22vw, 1.05rem);
    line-height: 1.3;
}

.redesign-about-page .ra-client__text {
    margin: 0;
    color: var(--ra-muted);
    font-size: clamp(0.8rem, 0.76rem + 0.18vw, 0.9rem);
    line-height: 1.45;
}

.redesign-about-page .ra-client__card--accent .ra-client__title,
.redesign-about-page .ra-client__card--accent .ra-client__text {
    color: #fff;
}

/* --- Контроль качества --- */

.redesign-about-page .ra-steps {
    margin: 0 0 clamp(16px, 2vw, 28px);
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(14px, 1.6vw, 24px);
}

.redesign-about-page .ra-step__num {
    display: block;
    margin-bottom: 10px;
    color: rgba(203, 33, 40, .35);
    font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.25rem);
    line-height: 1;
}

.redesign-about-page .ra-step__title {
    margin: 0 0 8px;
    font-size: clamp(0.95rem, 0.9rem + 0.25vw, 1.1rem);
    line-height: 1.25;
}

.redesign-about-page .ra-step__text {
    margin: 0;
    color: var(--ra-muted);
    font-size: clamp(0.8rem, 0.76rem + 0.2vw, 0.92rem);
    line-height: 1.45;
}

.redesign-about-page .ra-qcards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(12px, 1.4vw, 20px);
}

.redesign-about-page .ra-qcard {
    padding: clamp(16px, 1.8vw, 24px);
    border: 1px solid var(--ra-line);
    border-radius: 16px;
    background: var(--ra-soft);
}

.redesign-about-page .ra-qcard__title {
    margin: 0 0 6px;
    font-size: clamp(0.9rem, 0.86rem + 0.22vw, 1.05rem);
}

.redesign-about-page .ra-qcard__text {
    margin: 0;
    color: var(--ra-muted);
    font-size: clamp(0.8rem, 0.76rem + 0.18vw, 0.9rem);
    line-height: 1.45;
}

/* --- Документы --- */

.redesign-about-page .ra-docs__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px;
}

.redesign-about-page .ra-h2--flush {
    margin-bottom: 0;
}

.redesign-about-page .ra-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 10px 20px;
    border: 1px solid var(--ra-accent);
    border-radius: 12px;
    background: transparent;
    color: var(--ra-accent);
    font: inherit;
    font-size: clamp(0.82rem, 0.78rem + 0.2vw, 0.95rem);
    line-height: 1.2;
    cursor: pointer;
    transition: background-color .18s ease, color .18s ease;
}

.redesign-about-page .ra-btn:hover {
    background: var(--ra-accent);
    color: #fff;
}

.redesign-about-page .ra-btn:focus-visible {
    outline: 2px solid var(--ra-accent);
    outline-offset: 2px;
}

.redesign-about-page .ra-doc__thumb {
    display: block;
}

.redesign-about-page .ra-doc__caption {
    display: block;
    margin-top: 10px;
    text-align: center;
    color: var(--ra-ink);
    font-size: clamp(0.78rem, 0.74rem + 0.18vw, 0.9rem);
    line-height: 1.3;
}

.redesign-about-page .ra-docs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(12px, 1.4vw, 20px);
}

.redesign-about-page .ra-doc {
    display: block;
    text-decoration: none;
    padding: 10px;
    border: 1px solid var(--ra-line);
    border-radius: 16px;
    background: var(--ra-surface);
    transition: border-color .18s ease;
}

.redesign-about-page .ra-doc:hover {
    border-color: var(--ra-accent);
}

.redesign-about-page .ra-doc img {
    width: 100%;
    aspect-ratio: 3 / 4;
    object-fit: contain;
    display: block;
}

/* --- Отзывы --- */

.redesign-about-page .ra-reviews {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(12px, 1.4vw, 20px);
}

.redesign-about-page .ra-review {
    padding: clamp(16px, 1.8vw, 24px);
    border: 1px solid var(--ra-line);
    border-radius: var(--ra-radius);
    background: var(--ra-surface);
}

.redesign-about-page .ra-review__author {
    margin: 0 0 10px;
    font-size: clamp(0.9rem, 0.86rem + 0.22vw, 1.05rem);
}

.redesign-about-page .ra-review__text {
    margin: 0;
    color: var(--ra-muted);
    font-size: clamp(0.8rem, 0.76rem + 0.18vw, 0.92rem);
    line-height: 1.5;
    white-space: pre-line;
}

/* --- FAQ --- */

.redesign-about-page .ra-faq {
    display: grid;
    gap: 10px;
}

.redesign-about-page .ra-faq__item {
    border: 1px solid var(--ra-line);
    border-radius: 16px;
    background: var(--ra-surface);
}

.redesign-about-page .ra-faq__q {
    padding: 16px 20px;
    cursor: pointer;
    font-size: clamp(0.88rem, 0.84rem + 0.2vw, 1rem);
    line-height: 1.35;
    list-style: none;
    position: relative;
    padding-right: 48px;
}

.redesign-about-page .ra-faq__q::-webkit-details-marker {
    display: none;
}

.redesign-about-page .ra-faq__q::after {
    content: "";
    position: absolute;
    right: 20px;
    top: 50%;
    width: 9px;
    height: 9px;
    margin-top: -6px;
    border-right: 2px solid var(--ra-accent);
    border-bottom: 2px solid var(--ra-accent);
    transform: rotate(45deg);
    transition: transform .18s ease;
}

.redesign-about-page .ra-faq__item[open] .ra-faq__q::after {
    transform: rotate(-135deg);
    margin-top: -2px;
}

.redesign-about-page .ra-faq__a {
    padding: 0 20px 18px;
    color: var(--ra-muted);
    font-size: clamp(0.82rem, 0.78rem + 0.18vw, 0.92rem);
    line-height: 1.5;
}

/* --- Адаптив --- */

@media (max-width: 1024px) {
    .redesign-about-page .ra-hero__inner,
    .redesign-about-page .ra-path,
    .redesign-about-page .ra-client {
        grid-template-columns: minmax(0, 1fr);
    }

    .redesign-about-page .ra-teachers,
    .redesign-about-page .ra-docs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .redesign-about-page .ra-path__list,
    .redesign-about-page .ra-steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .redesign-about-page .ra-path__item::after {
        display: none;
    }

    .redesign-about-page .ra-client__grid,
    .redesign-about-page .ra-qcards,
    .redesign-about-page .ra-reviews {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .redesign-about-page .ra-client__card--accent {
        grid-row: auto;
        grid-column: span 2;
    }

    .redesign-about-page .ra-reviews {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .redesign-about-page .ra-page {
        gap: 8px;
    }

    .redesign-about-page .ra-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .redesign-about-page .ra-chain__item {
        gap: 12px;
    }
}

@media (max-width: 560px) {
    .redesign-about-page .ra-path__list,
    .redesign-about-page .ra-steps,
    .redesign-about-page .ra-teachers,
    .redesign-about-page .ra-registry,
    .redesign-about-page .ra-client__grid,
    .redesign-about-page .ra-qcards,
    .redesign-about-page .ra-reviews {
        grid-template-columns: minmax(0, 1fr);
    }

    .redesign-about-page .ra-client__card--accent {
        grid-column: auto;
    }

    .redesign-about-page .ra-docs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .redesign-about-page .ra-facts {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }

    .redesign-about-page .ra-chain {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }

    .redesign-about-page .ra-chain__item:not(:last-child)::after {
        content: "↓";
    }
}

/* ================= v2: иконки, реестры, этапы, отзывы ================= */

.redesign-about-page .ra-ico {
    width: 22px;
    height: 22px;
    flex: 0 0 auto;
    display: inline-block;
    background: var(--ra-accent);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    vertical-align: middle;
}

.redesign-about-page .ra-ico--lg {
    width: 34px;
    height: 34px;
}

.redesign-about-page .ra-ico--round {
    width: 40px;
    height: 40px;
    padding: 9px;
    box-sizing: border-box;
    background: none;
    position: relative;
    border-radius: 50%;
    border: 1px solid var(--ra-line);
    background-color: var(--ra-surface);
}

.redesign-about-page .ra-ico--round::before {
    content: "";
    position: absolute;
    inset: 9px;
    background: var(--ra-accent);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-image: var(--ra-mask);
    mask-image: var(--ra-mask);
}

.redesign-about-page .ra-ico--globe {
    --ra-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 2c1.3 0 2.8 2.4 3.2 6H8.8C9.2 6.4 10.7 4 12 4zM4.3 10h3.4a22 22 0 0 0 0 4H4.3a8 8 0 0 1 0-4zm0 6h3.5c.4 2 1.1 3.6 2 4.6A8 8 0 0 1 4.3 16zm5.5 0h4.4c-.5 2.9-1.6 5-2.2 5s-1.7-2.1-2.2-5zm-.1-2a20 20 0 0 1 0-4h4.6a20 20 0 0 1 0 4zm6.5 6.6c.9-1 1.6-2.6 2-4.6h3.5a8 8 0 0 1-5.5 4.6zM16.3 14a22 22 0 0 0 0-4h3.4a8 8 0 0 1 0 4zm-.1-6c-.4-2-1.1-3.6-2-4.6A8 8 0 0 1 19.7 8z'/%3E%3C/svg%3E");
}

.redesign-about-page .ra-ico--monitor {
    --ra-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 4h18a1 1 0 0 1 1 1v11a1 1 0 0 1-1 1h-7v2h4v2H6v-2h4v-2H3a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1zm1 2v9h16V6z'/%3E%3C/svg%3E");
}

.redesign-about-page .ra-ico--shield {
    --ra-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 4 5v6c0 5 3.4 9.7 8 11 4.6-1.3 8-6 8-11V5zm-1 13-3.5-3.5 1.4-1.4L11 12.2l4.1-4.1 1.4 1.4z'/%3E%3C/svg%3E");
}

.redesign-about-page .ra-ico--doc {
    --ra-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8zm-1 7V3.5L18.5 9zM8 13h8v2H8zm0 4h8v2H8z'/%3E%3C/svg%3E");
}

.redesign-about-page .ra-ico--registry {
    --ra-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 3h16a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1zm2 3v2h12V6zm0 5v2h12v-2zm0 5v2h8v-2z'/%3E%3C/svg%3E");
}

.redesign-about-page .ra-ico--clock {
    --ra-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm1 10.6V6h-2v7.4l5 3 1-1.7z'/%3E%3C/svg%3E");
}

.redesign-about-page .ra-ico--truck {
    --ra-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5h11v9H3zm12 3h3.5l2.5 3v3h-6zM6.5 20a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm11 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4z'/%3E%3C/svg%3E");
}

.redesign-about-page .ra-ico--support {
    --ra-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a9 9 0 0 0-9 9v6a3 3 0 0 0 3 3h2v-8H5v-1a7 7 0 1 1 14 0v1h-3v8h2a3 3 0 0 0 3-3v-6a9 9 0 0 0-9-9z'/%3E%3C/svg%3E");
}

.redesign-about-page .ra-ico--book {
    --ra-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 2h13a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6a3 3 0 0 1-3-3V5a3 3 0 0 1 3-3zm0 2a1 1 0 0 0-1 1v11.2c.3-.1.7-.2 1-.2h12V4zm0 14a1 1 0 0 0 0 2h12v-2z'/%3E%3C/svg%3E");
}

.redesign-about-page .ra-ico--refresh {
    --ra-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4a8 8 0 0 1 7 4.1l1.8-1V13h-5.6l2.1-1.2A6 6 0 0 0 6.3 13H4.2A8 8 0 0 1 12 4zm0 16a8 8 0 0 1-7-4.1l-1.8 1V11h5.6l-2.1 1.2A6 6 0 0 0 17.7 11h2.1a8 8 0 0 1-7.8 9z'/%3E%3C/svg%3E");
}

.redesign-about-page .ra-ico--user {
    --ra-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10zm0 2c-4.4 0-8 2.6-8 5.8V22h16v-2.2c0-3.2-3.6-5.8-8-5.8z'/%3E%3C/svg%3E");
}

.redesign-about-page .ra-ico--check {
    --ra-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm-1 14.4-4.2-4.2 1.4-1.4 2.8 2.8 5.6-5.6 1.4 1.4z'/%3E%3C/svg%3E");
}

.redesign-about-page .ra-ico--search {
    --ra-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 2a8 8 0 1 0 4.9 14.3l5.4 5.4 1.4-1.4-5.4-5.4A8 8 0 0 0 10 2zm0 2a6 6 0 1 1 0 12 6 6 0 0 1 0-12z'/%3E%3C/svg%3E");
}

.redesign-about-page .ra-ico--award {
    --ra-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a6 6 0 1 0 0 12 6 6 0 0 0 0-12zm0 2a4 4 0 1 1 0 8 4 4 0 0 1 0-8zM8 15.5V22l4-2 4 2v-6.5a8 8 0 0 1-8 0z'/%3E%3C/svg%3E");
}

.redesign-about-page .ra-ico[class*="ra-ico--"]:not(.ra-ico--round) {
    -webkit-mask-image: var(--ra-mask);
    mask-image: var(--ra-mask);
}

.redesign-about-page .ra-fact {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Реестры */

.redesign-about-page .ra-registry__card {
    display: grid;
    gap: 10px;
    background: var(--ra-soft);
}

/* Цепочка */

.redesign-about-page .ra-chain {
    justify-content: space-between;
}

.redesign-about-page .ra-chain__item {
    gap: 12px;
}

.redesign-about-page .ra-chain__label {
    min-width: 0;
}

/* Этапы качества */

.redesign-about-page .ra-step {
    padding: clamp(16px, 1.8vw, 24px);
    border: 1px solid var(--ra-line);
    border-radius: 16px;
    background: var(--ra-surface);
}

.redesign-about-page .ra-step__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.redesign-about-page .ra-step__num {
    margin-bottom: 0;
}

/* Карточки под этапами */

.redesign-about-page .ra-qcard {
    display: grid;
    gap: 8px;
    background: var(--ra-surface);
}

/* Отзывы: обрезка и «Читать далее» */

.redesign-about-page .ra-review {
    display: flex;
    flex-direction: column;
}

.redesign-about-page .ra-review__text.is-clamped {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.redesign-about-page .ra-review__more {
    align-self: flex-start;
    margin-top: 12px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--ra-accent);
    font: inherit;
    font-size: clamp(0.8rem, 0.76rem + 0.18vw, 0.9rem);
    cursor: pointer;
    text-decoration: underline;
}

.redesign-about-page .ra-review__more:focus-visible {
    outline: 2px solid var(--ra-accent);
    outline-offset: 2px;
}

@media (max-width: 768px) {
    .redesign-about-page .ra-chain {
        justify-content: flex-start;
    }
}

/* ================= v4: реестры, номера этапов, мобильный скролл ================= */

/* Реестры: иконка слева, текст справа — как в макете */

.redesign-about-page .ra-registry__card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 16px;
    background: var(--ra-surface);
}

.redesign-about-page .ra-registry__ico {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: rgba(203, 33, 40, .08);
}

.redesign-about-page .ra-registry__body {
    min-width: 0;
}

/* Номера этапов — крупнее и выразительнее */

.redesign-about-page .ra-step__num {
    font-size: clamp(2.25rem, 1.5rem + 2.6vw, 3.75rem);
    font-weight: 700;
    line-height: 1;
    color: var(--ra-accent);
    opacity: .22;
    letter-spacing: -0.02em;
}

.redesign-about-page .ra-step__head {
    align-items: flex-start;
}

/* Мобильный горизонтальный скролл: преподаватели, документы, отзывы */

@media (max-width: 768px) {
    .redesign-about-page .ra-teachers,
    .redesign-about-page .ra-docs,
    .redesign-about-page .ra-reviews {
        display: flex;
        grid-template-columns: none;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 12px;
        padding-bottom: 10px;
        scrollbar-width: thin;
    }

    .redesign-about-page .ra-teachers > *,
    .redesign-about-page .ra-docs > *,
    .redesign-about-page .ra-reviews > * {
        flex: 0 0 78%;
        max-width: 320px;
        scroll-snap-align: start;
    }

    .redesign-about-page .ra-docs > * {
        flex-basis: 60%;
    }

    .redesign-about-page .ra-review {
        box-sizing: border-box;
    }
}

@media (max-width: 560px) {
    .redesign-about-page .ra-teachers,
    .redesign-about-page .ra-docs,
    .redesign-about-page .ra-reviews {
        grid-template-columns: none;
    }

    .redesign-about-page .ra-teachers > *,
    .redesign-about-page .ra-reviews > * {
        flex-basis: 84%;
    }

    .redesign-about-page .ra-docs > * {
        flex-basis: 64%;
    }

    .redesign-about-page .ra-registry__card {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ================= v5: защита от горизонтального выезда страницы ================= */

/* Секции — элементы grid-сетки .ra-page. По умолчанию у них min-width: auto,
   поэтому блок с горизонтальной прокруткой раздувал их до ширины содержимого
   и вся страница уезжала вбок. */

.redesign-about-page .ra-page > * {
    min-width: 0;
}

/* .ra-shell сюда включать нельзя: max-width: 100% перебивает
   max-width: var(--container) и контейнер перестаёт ограничиваться. */

.redesign-about-page .ra-shell {
    min-width: 0;
}

.redesign-about-page .ra-teachers,
.redesign-about-page .ra-docs,
.redesign-about-page .ra-reviews,
.redesign-about-page .ra-client__grid,
.redesign-about-page .ra-path__list,
.redesign-about-page .ra-steps {
    min-width: 0;
    max-width: 100%;
}

/* ================= v6: скрытие через атрибут hidden ================= */

/* Браузерное правило [hidden] { display: none } имеет специфичность 0-1-0
   и проигрывает нашим правилам вида .redesign-about-page .ra-doc { display: block }.
   Из-за этого «скрытые» документы оставались видимыми: скрипт менял атрибут,
   а раскладка не менялась. Перекрываем явно. */

.redesign-about-page [hidden] {
    display: none !important;
}
