/*about-story.css*/

/* ===================================
   ИСТОРИЯ ЦЕНТРА
   =================================== */
.about-story {
    position: relative;
    padding: var(--space-20) 0;
    background-color: var(--color-bg);
    overflow: hidden;
}

.about-story__bg-blob {
    position: absolute;
    top: -15%;
    left: -12%;
    width: 55%;
    height: 130%;
    background: radial-gradient(ellipse at center,
    rgba(238, 122, 93, .1) 0%,
    rgba(37, 169, 184, .05) 50%,
    transparent 70%);
    filter: blur(60px);
    border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;
    animation: morphBlob 21s ease-in-out infinite alternate;
    pointer-events: none;
    z-index: 0;
}

.about-story__bg-blob--accent {
    top: auto;
    left: auto;
    bottom: -20%;
    right: -10%;
    width: 45%;
    height: 100%;
    background: radial-gradient(ellipse at center,
    rgba(82, 204, 154, .08) 0%,
    transparent 70%);
    animation: morphBlob 24s ease-in-out infinite alternate-reverse;
}

/* точечная текстура секции, как у about-mission */
.about-story::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-image: radial-gradient(circle, rgba(37, 169, 184, .13) 1.4px, transparent 1.6px);
    background-size: 26px 26px;
    -webkit-mask-image: radial-gradient(ellipse 55% 50% at 82% 12%, black 0%, transparent 75%);
    mask-image: radial-gradient(ellipse 55% 50% at 82% 12%, black 0%, transparent 75%);
    opacity: .55;
}

.about-story > .container {
    position: relative;
    z-index: 1;
}

/* --- Заголовок секции --- */
.about-story__badge {
    display: block;
    width: max-content;
    margin: 0 auto var(--space-5);
}

.about-story__subtitle {
    margin-bottom: var(--space-12);
}

/* --- Вступление с фото --- */
.about-story__intro {
    display: grid;
    grid-template-columns: 0.75fr 1fr;
    gap: var(--space-10);
    align-items: center;
    margin-bottom: var(--space-14);
}

.about-story__intro-media {
    position: relative;
    border-radius: var(--radius-xl);
    overflow: hidden;
    box-shadow: var(--shadow-lg);
    aspect-ratio: 1/1;
}

.about-story__intro-media .ig-corner {
    z-index: 2;
}

.about-story__intro-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.about-story__lead {
    font-size: var(--fz-lg);
    font-weight: var(--fw-medium);
    color: var(--color-text);
    line-height: var(--lh-loose);
    margin-bottom: var(--space-5);
}

.about-story__teaser-text {
    font-size: var(--fz-base);
    line-height: var(--lh-loose);
    color: var(--color-text-secondary);
    margin-bottom: var(--space-4);
}

.about-story__teaser-text--accent {
    color: var(--color-text);
    font-weight: var(--fw-medium);
    border-left: 3px solid var(--color-primary);
    padding-left: var(--space-4);
    margin-bottom: 0;
}

/* --- Двухколоночная сетка основного текста --- */
.about-story__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-10);
    align-items: start;
    padding-top: var(--space-10);
    border-top: 2px dashed var(--color-border);
}

.about-story__col {
    min-width: 0;
}

.about-story__block-title {
    position: relative;
    font-family: var(--font-heading), serif;
    font-size: var(--fz-lg);
    font-weight: var(--fw-bold);
    color: var(--color-primary-darker);
    margin: var(--space-8) 0 var(--space-3);
    padding-left: var(--space-4);
}

.about-story__block-title::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.15em;
    bottom: 0.15em;
    width: 4px;
    background: var(--gradient-accent-line);
    border-radius: var(--radius-full);
}

.about-story__col > .about-story__block-title:first-child {
    margin-top: 0;
}

.about-story__text {
    font-size: var(--fz-base);
    line-height: var(--lh-loose);
    color: var(--color-text-secondary);
    margin-bottom: var(--space-4);
}

/* ===================================
   ЦИТАТЫ — СТИКЕРЫ С РУКОПИСНЫМ ТЕКСТОМ
   =================================== */
.about-story__quote {
    position: relative;
    margin: var(--space-9) var(--space-3) var(--space-8);
    padding: var(--space-6) var(--space-6) var(--space-5);

    /* --- бумажная текстура: линовка + лёгкий шум + неровный оттенок --- */
    background-color: #FFFCF2;
    background-image:
        /* горизонтальные линии как в блокноте */
            repeating-linear-gradient(
                    transparent 0,
                    transparent 26px,
                    rgba(37, 169, 184, .10) 27px
            ),
                /* лёгкий шум/волокна бумаги */
            radial-gradient(circle at 15% 20%, rgba(0,0,0,.025) 0%, transparent 3%),
            radial-gradient(circle at 85% 15%, rgba(0,0,0,.02) 0%, transparent 4%),
            radial-gradient(circle at 30% 75%, rgba(0,0,0,.02) 0%, transparent 3%),
            radial-gradient(circle at 70% 60%, rgba(0,0,0,.025) 0%, transparent 3%),
            radial-gradient(circle at 50% 90%, rgba(0,0,0,.018) 0%, transparent 4%),
                /* лёгкая общая неоднородность тона */
            linear-gradient(135deg, rgba(0,0,0,.015) 0%, transparent 40%, rgba(0,0,0,.02) 100%);
    background-repeat: repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat;

    border: none;
    border-radius: 2px;
    font-family: 'Playpen Sans', var(--font-heading), cursive;
    font-style: normal;
    font-size: 1.15rem;
    font-weight: var(--fw-medium);
    color: #3A3530;
    line-height: 1.65;

    box-shadow:
            0 3px 6px rgba(0, 0, 0, .09),
            0 10px 18px rgba(0, 0, 0, .09),
            inset 0 0 40px rgba(120, 100, 70, .04);

    transform: rotate(-1.2deg);
    transition: transform var(--transition-base), box-shadow var(--transition-base);
}

.about-story__quote::before {
    content: '“';
    position: absolute;
    top: 4px;
    left: 12px;
    font-family: Georgia, serif;
    font-size: 3rem;
    line-height: 1;
    color: var(--color-secondary);
    opacity: 0.22;
    pointer-events: none;
    z-index: 1;
}

.about-story__quote:hover {
    transform: rotate(0deg) translateY(-3px);
    box-shadow:
            0 6px 14px rgba(0, 0, 0, .12),
            0 16px 28px rgba(0, 0, 0, .1),
            inset 0 0 40px rgba(120, 100, 70, .04);
}

/* --- ЛЕНТА (СКОТЧ) --- */
.about-story__quote-tape {
    position: absolute;
    top: -14px;
    left: 50%;
    transform: translateX(-50%) rotate(-4deg);
    width: 70px;
    height: 26px;
    z-index: 4;
    pointer-events: none;

    background:
            repeating-linear-gradient(
                    100deg,
                    rgba(255,255,255,.9) 0px,
                    rgba(255,255,255,.9) 3px,
                    rgba(240,230,190,.75) 3px,
                    rgba(240,230,190,.75) 6px
            ),
            linear-gradient(135deg, rgba(255, 250, 220, .92) 0%, rgba(235, 220, 170, .88) 100%);

    border: 1px solid rgba(180, 160, 100, .25);
    box-shadow:
            0 2px 4px rgba(0, 0, 0, .18),
            0 1px 1px rgba(255, 255, 255, .5) inset;
    opacity: 0.92;
}

/* чередуем угол ленты вместе с наклоном самой записки */
.about-story__col:first-child .about-story__quote:nth-of-type(2n) .about-story__quote-tape {
    transform: translateX(-50%) rotate(3deg);
}

.about-story__col:last-child .about-story__quote .about-story__quote-tape {
    transform: translateX(-50%) rotate(3deg);
}

.about-story__col:last-child .about-story__quote:nth-of-type(2n) .about-story__quote-tape {
    transform: translateX(-50%) rotate(-5deg);
}

/* чередуем наклон записок */
.about-story__col:first-child .about-story__quote:nth-of-type(2n) {
    transform: rotate(1deg);
}

.about-story__col:first-child .about-story__quote:nth-of-type(2n):hover {
    transform: rotate(0deg) translateY(-3px);
}

.about-story__col:last-child .about-story__quote {
    transform: rotate(1deg);
}

.about-story__col:last-child .about-story__quote:nth-of-type(2n) {
    transform: rotate(-1.4deg);
}

.about-story__col:last-child .about-story__quote:hover,
.about-story__col:last-child .about-story__quote:nth-of-type(2n):hover {
    transform: rotate(0deg) translateY(-3px);
}

/* --- цветовые варианты бумаги --- */
.about-story__quote--terracotta {
    background-color: #FFF6EF;
}

.about-story__quote--terracotta::before {
    color: var(--color-primary);
}

.about-story__quote--mint {
    background-color: #F3FDF7;
}

.about-story__quote--mint::before {
    color: var(--color-tertiary-dark);
}

.about-story__quote-cite {
    display: block;
    margin-top: var(--space-3);
    font-family: var(--font-heading), sans-serif;
    font-style: normal;
    font-size: var(--fz-xs);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--color-secondary-dark);
    position: relative;
    z-index: 1;
}

/* карточки цитат в блоке "Философия" */
.about-story__quote--card {
    margin: 0;
    transform: rotate(-1deg);
}

.about-story__quote--card:nth-child(2) {
    transform: rotate(1deg);
}

.about-story__quote--card:nth-child(2) .about-story__quote-tape {
    transform: translateX(-50%) rotate(4deg);
}

.about-story__quote--card:hover {
    transform: rotate(0deg) translateY(-3px);
}

@media (max-width: 768px) {
    .about-story__quote {
        font-size: 1.05rem;
        margin: var(--space-7) var(--space-2) var(--space-6);
        padding: var(--space-5) var(--space-4) var(--space-4);
    }

    .about-story__quote-tape {
        width: 56px;
        height: 22px;
        top: -12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .about-story__quote,
    .about-story__kate-media {
        transition: none;
    }
}

/* --- Философия центра --- */
.about-story__philosophy {
    margin-top: var(--space-14);
    padding: var(--space-8) var(--space-8) var(--space-6);
    background: var(--color-tertiary-light);
    border-radius: var(--radius-lg);
    text-align: center;
    position: relative;
    overflow: hidden;
}

.about-story__philosophy::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='20' viewBox='0 0 60 20'%3E%3Cpath d='M2 17L12 4L22 17L32 4L42 17L52 4' fill='none' stroke='%2352CC9A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' opacity='0.25'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='16' viewBox='0 0 40 16'%3E%3Ccircle cx='4' cy='8' r='2' fill='%2325A9B8' opacity='0.3'/%3E%3Ccircle cx='16' cy='6' r='2' fill='%2325A9B8' opacity='0.3'/%3E%3Ccircle cx='28' cy='9' r='2' fill='%2325A9B8' opacity='0.3'/%3E%3Ccircle cx='36' cy='5' r='2' fill='%2325A9B8' opacity='0.3'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 4% 12%, 92% 82%;
    background-size: 56px 18px, 44px 18px;
}

.about-story__philosophy > .ig-sticker {
    position: relative;
    z-index: 1;
    margin-bottom: var(--space-6);
}

.about-story__philosophy-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-6);
    text-align: left;
}

.about-story__quote--card {
    margin: 0;
    background: var(--color-white);
}

/* --- Финальный блок --- */
.about-story__final {
    margin-top: var(--space-2);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-3);
}

.about-story__final p {
    font-size: var(--fz-base);
    line-height: var(--lh-loose);
    color: var(--color-text-secondary);
    max-width: 680px;
    margin: 0;
}

.about-story__final-cta-text {
    font-family: var(--font-heading), serif;
    font-weight: var(--fw-bold);
    font-size: var(--fz-xl) !important;
    color: var(--color-primary) !important;
}

/* --- Адаптив --- */
@media (max-width: 1024px) {
    .about-story__intro {
        grid-template-columns: 1fr;
        gap: var(--space-6);
    }

    .about-story__intro-media {
        max-width: 360px;
        margin: 0 auto;
    }

    .about-story__grid {
        grid-template-columns: 1fr;
        gap: var(--space-2);
    }

    .about-story__philosophy-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .about-story {
        padding: var(--space-10) 0;
    }

    .about-story__intro {
        margin-bottom: var(--space-10);
    }

    .about-story__lead {
        font-size: var(--fz-base);
    }

    .about-story__subtitle {
        margin-bottom: var(--space-8);
    }

    .about-story__block-title {
        font-size: var(--fz-md);
    }

    .about-story__quote {
        padding: var(--space-4);
    }

    .about-story__philosophy {
        padding: var(--space-6) var(--space-5) var(--space-5);
        margin-top: var(--space-8);
    }

    .about-story__final-cta-text {
        font-size: var(--fz-lg) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .about-story__bg-blob,
    .about-story__bg-blob--accent {
        animation: none;
    }
}

@media print {
    .about-story__bg-blob,
    .about-story__bg-blob--accent {
        display: none !important;
    }
}

/* --- Фото Кати рядом с текстом --- */
.about-story__kate {
    display: flex;
    gap: var(--space-5);
    align-items: flex-start;
    margin-bottom: var(--space-4);
}

.about-story__kate-media {
    position: relative;
    flex-shrink: 0;
    width: 140px;
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    transform: rotate(-2deg);
    transition: transform var(--transition-base);
}

.about-story__kate-media:hover {
    transform: rotate(0deg) scale(1.02);
}

.about-story__kate-img {
    width: 100%;
    aspect-ratio: 1/1;
    object-fit: cover;
    display: block;
}

.about-story__kate-caption {
    display: block;
    text-align: center;
    padding: var(--space-2);
    font-family: var(--font-heading), sans-serif;
    font-size: 11px;
    font-weight: var(--fw-bold);
    color: var(--color-secondary-dark);
    background: var(--color-white);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.about-story__kate-text {
    flex: 1;
    margin-bottom: 0;
}

@media (max-width: 640px) {
    .about-story__kate {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .about-story__kate-media {
        width: 160px;
    }

    .about-story__kate-text {
        text-align: left;
    }
}

/* --- Зеркальный вариант (фото справа от текста) --- */
.about-story__kate--reverse {
    flex-direction: row-reverse;
}

.about-story__kate--reverse .about-story__kate-media {
    transform: rotate(2deg);
}

.about-story__kate--reverse .about-story__kate-media:hover {
    transform: rotate(0deg) scale(1.02);
}

@media (max-width: 640px) {
    .about-story__kate--reverse {
        flex-direction: column;
    }
}

/* ===================================
   ДОПОЛНИТЕЛЬНЫЙ ДЕКОР — ДУДЛЫ ДЛЯ СЕКЦИИ «ИСТОРИЯ ЦЕНТРА»
   Тематика: путь семьи, рост, книга истории, достижение, забота.
   Стиль идентичен about-decor.css — только контур, 3 фирменных цвета.
   =================================== */

:root {
    /* Путь/дорога с точкой (тема "путь семьи") */
    --doodle-path: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='70' height='40' viewBox='0 0 70 40'%3E%3Cpath d='M4 34C16 34 16 22 28 22C40 22 40 8 52 8C58 8 62 5 66 4' fill='none' stroke='%2325A9B8' stroke-width='2' stroke-linecap='round' stroke-dasharray='1 7'/%3E%3Ccircle cx='4' cy='34' r='3' fill='%23EE7A5D'/%3E%3Ccircle cx='66' cy='4' r='3' fill='%2352CC9A'/%3E%3C/svg%3E");

    /* Раскрытая книга (тема "история") */
    --doodle-open-book: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='34' viewBox='0 0 46 34'%3E%3Cpath d='M23 8C19 4 10 3 4 6V28C10 25 19 26 23 30C27 26 36 25 42 28V6C36 3 27 4 23 8Z' fill='none' stroke='%23EE7A5D' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M23 8V30' stroke='%23EE7A5D' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");

    /* Медаль/лента (тема "достижение, результат") */
    --doodle-medal: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='42' viewBox='0 0 34 42'%3E%3Cpath d='M10 4L4 18L13 15Z' fill='none' stroke='%2352CC9A' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M24 4L30 18L21 15Z' fill='none' stroke='%2352CC9A' stroke-width='1.6' stroke-linejoin='round'/%3E%3Ccircle cx='17' cy='25' r='11' fill='none' stroke='%2352CC9A' stroke-width='1.8'/%3E%3Cpath d='M13 25L16 28L22 21' fill='none' stroke='%2352CC9A' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

    /* Растущее дерево из точки (тема "рост, развитие") — крупнее существующего sprout */
    --doodle-growth-tree: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='56' viewBox='0 0 44 56'%3E%3Cpath d='M22 52V26' stroke='%2325A9B8' stroke-width='2' stroke-linecap='round' fill='none'/%3E%3Cpath d='M22 32C10 32 6 20 14 14C19 11 22 18 22 24' stroke='%2325A9B8' stroke-width='2' stroke-linecap='round' fill='none'/%3E%3Cpath d='M22 26C34 26 38 14 30 8C25 5 22 12 22 18' stroke='%2325A9B8' stroke-width='2' stroke-linecap='round' fill='none'/%3E%3Ccircle cx='22' cy='52' r='2.4' fill='%23EE7A5D'/%3E%3C/svg%3E");

    /* Обнимающие руки-сердце (тема "забота, поддержка семьи") */
    --doodle-caring-hands: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='36' viewBox='0 0 48 36'%3E%3Cpath d='M4 20C4 12 10 6 16 8C19 9 20 13 20 13' fill='none' stroke='%23EE7A5D' stroke-width='1.8' stroke-linecap='round'/%3E%3Cpath d='M44 20C44 12 38 6 32 8C29 9 28 13 28 13' fill='none' stroke='%23EE7A5D' stroke-width='1.8' stroke-linecap='round'/%3E%3Cpath d='M24 12C24 12 20 8 24 5C26 6 24 8 24 8C24 8 22 6 24 5C28 8 24 12 24 12Z' fill='%23EE7A5D' opacity='0.7'/%3E%3C/svg%3E");

    /* Скрепка-документ (тема "лицензия, официальность") */
    --doodle-document: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='38' viewBox='0 0 30 38'%3E%3Cpath d='M6 4H20L26 10V34H6V4Z' fill='none' stroke='%2325A9B8' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M20 4V10H26' fill='none' stroke='%2325A9B8' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M10 18H22M10 23H22M10 28H17' stroke='%2325A9B8' stroke-width='1.4' stroke-linecap='round' opacity='0.6'/%3E%3Ccircle cx='23' cy='28' r='4' fill='none' stroke='%2352CC9A' stroke-width='1.6'/%3E%3Cpath d='M21 28L22.5 29.5L25.5 26.5' fill='none' stroke='%2352CC9A' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

    /* Развевающийся флажок-вымпел (тема "команда, цель") */
    --doodle-pennant: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='36' viewBox='0 0 32 36'%3E%3Cline x1='6' y1='2' x2='6' y2='34' stroke='%2352CC9A' stroke-width='1.8' stroke-linecap='round'/%3E%3Cpath d='M6 4C14 2 18 8 26 6C22 10 22 14 26 16C18 14 14 20 6 18Z' fill='none' stroke='%2352CC9A' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E");
}

@keyframes storyDoodleFloat {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50%      { transform: translateY(-9px) rotate(4deg); }
}

@keyframes storyDoodleFloatReverse {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50%      { transform: translateY(7px) rotate(-5deg); }
}

/* --- Общий фоновый слой дудлов на уровне всей секции --- */
.about-story::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-image:
            var(--doodle-open-book),
            var(--doodle-path),
            var(--doodle-growth-tree),
            var(--doodle-document);
    background-repeat: no-repeat;
    background-position:
            4% 6%,
            90% 10%,
            3% 88%,
            94% 90%;
    background-size:
            46px 34px,
            70px 40px,
            44px 56px,
            30px 38px;
    opacity: .4;
}

/* --- Плавающие акценты рядом с ключевыми блоками --- */

/* медаль у вступительного блока (тема "путь к результату") */
.about-story__intro {
    position: relative;
}

.about-story__intro::after {
    content: '';
    position: absolute;
    z-index: 0;
    pointer-events: none;
    top: -18px;
    right: 6%;
    width: 34px;
    height: 42px;
    background: var(--doodle-medal) no-repeat center / contain;
    opacity: .5;
    animation: storyDoodleFloat 8s ease-in-out infinite;
}

/* обнимающие руки у первой колонки (тема "забота о ребёнке") */
.about-story__col:first-child {
    position: relative;
}

.about-story__col:first-child::before {
    content: '';
    position: absolute;
    z-index: 0;
    pointer-events: none;
    top: -6px;
    right: -4px;
    width: 48px;
    height: 36px;
    background: var(--doodle-caring-hands) no-repeat center / contain;
    opacity: .45;
    animation: storyDoodleFloatReverse 9s ease-in-out infinite;
}

/* флажок-вымпел у второй колонки (тема "команда, цель") */
.about-story__col:last-child {
    position: relative;
}

.about-story__col:last-child::before {
    content: '';
    position: absolute;
    z-index: 0;
    pointer-events: none;
    top: -10px;
    left: -6px;
    width: 32px;
    height: 36px;
    background: var(--doodle-pennant) no-repeat center / contain;
    opacity: .45;
    animation: storyDoodleFloat 7.5s ease-in-out infinite;
}

/* блок и заголовки должны быть поверх фоновых дудлов колонок */
.about-story__block-title,
.about-story__text,
.about-story__quote,
.about-story__kate {
    position: relative;
    z-index: 1;
}

/* --- Дудл-акцент в блоке "Философия" --- */
.about-story__philosophy {
    position: relative;
}

.about-story__philosophy::after {
    content: '';
    position: absolute;
    z-index: 0;
    pointer-events: none;
    bottom: 8%;
    left: 4%;
    width: 44px;
    height: 56px;
    background: var(--doodle-growth-tree) no-repeat center / contain;
    opacity: .3;
    animation: storyDoodleFloatReverse 10s ease-in-out infinite;
}

/* --- Адаптив: приглушаем/упрощаем дудлы на мобильных --- */
@media (max-width: 1024px) {
    .about-story::after {
        background-size:
                38px 28px,
                56px 32px,
                36px 46px,
                24px 30px;
        opacity: .3;
    }

    .about-story__intro::after,
    .about-story__col:first-child::before,
    .about-story__col:last-child::before,
    .about-story__philosophy::after {
        opacity: .3;
    }
}

@media (max-width: 768px) {
    .about-story::after {
        opacity: .18;
    }

    .about-story__intro::after,
    .about-story__col:first-child::before,
    .about-story__col:last-child::before {
        display: none;
    }

    .about-story__philosophy::after {
        width: 32px;
        height: 40px;
        opacity: .25;
    }
}

@media (prefers-reduced-motion: reduce) {
    .about-story__intro::after,
    .about-story__col:first-child::before,
    .about-story__col:last-child::before,
    .about-story__philosophy::after {
        animation: none;
    }
}

@media print {
    .about-story::after,
    .about-story__intro::after,
    .about-story__col:first-child::before,
    .about-story__col:last-child::before,
    .about-story__philosophy::after {
        display: none !important;
    }
}

@media (max-width: 1024px) {
    .about-story__intro {
        grid-template-columns: 1fr;
        gap: var(--space-6);
    }

    .about-story__intro-media {
        width: 100%;
        max-width: 360px;
        margin: 0 auto;
    }
}

.about-story__intro-media {
    position: relative;
    border-radius: var(--radius-xl);
    overflow: hidden;
    box-shadow: var(--shadow-lg);
    aspect-ratio: 1/1;
    min-height: 220px; /* фолбэк, если aspect-ratio не применится корректно */
}

.about-story__intro-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    min-height: 220px; /* дублируем на img на случай схлопывания родителя */
}