/*
 * Magazin Landing — /vozmozhnosti/magazin/
 * Custom styles, specific to shop-coins feature page.
 * Inherits .vp-* (hero, problem, features, quote, related, cta, breadcrumb),
 *         .section-label / .section-header / .scroll-animate / .btn*
 * from vozmozhnosti-page.css and main.css.
 */

/* ============================================================ */
/* HERO — custom image on the right (replaces phone mockup)     */
/* ============================================================ */
.magazin-hero-image {
    width: 100%;
    max-width: 560px;
    height: auto;
    display: block;
    margin: 0 auto;
    filter: drop-shadow(0 30px 60px rgba(236, 72, 153, 0.25)) drop-shadow(0 10px 30px rgba(15, 23, 42, 0.4));
    border-radius: 24px;
}

/* Сцена заполняет всю высоту hero-колонки — для бесшовной интеграции */
.vp-hero .vp-hero__visual:has(.magazin-scene) {
    align-self: stretch;
    min-height: 520px;
}

/* ============================================================ */
/* MAGAZIN SCENE — композиция с parallax (замена статичной hero) */
/* ============================================================ */
.sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

.magazin-scene {
    --mx: 0; --my: 0;
    --magazin-accent: rgba(255, 215, 0, 0.55);
    --magazin-magic: rgba(236, 72, 153, 0.45);

    position: relative;
    width: 100%;
    height: 100%;
    min-height: 520px;
    margin: 0;
    isolation: isolate;
    /* бесшовная интеграция с hero-градиентом — без своего фона и рамок */
}

.magazin-scene::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse 35% 45% at calc(50% + var(--mx) * 8%) calc(48% + var(--my) * 5%),
        var(--magazin-magic) 0%,
        transparent 70%
    );
    animation: magazin-scene-pulse 4s ease-in-out infinite;
    pointer-events: none;
    z-index: 1;
    transition: background 0.4s ease-out;
}

@keyframes magazin-scene-pulse {
    0%, 100% { opacity: 0.6; }
    50%      { opacity: 1; }
}

.magazin-scene__layer {
    position: absolute;
    pointer-events: none;
    will-change: transform;
    transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.magazin-scene__anim {
    width: 100%;
    will-change: transform, filter;
}

.magazin-scene__layer img {
    width: 100%;
    height: auto;
    display: block;
}

.magazin-scene__layer[data-depth="0.2"] { transform: translate(calc(var(--mx) * 4px),  calc(var(--my) * 3px)); }
.magazin-scene__layer[data-depth="0.5"] { transform: translate(calc(var(--mx) * 10px), calc(var(--my) * 7px)); }
.magazin-scene__layer[data-depth="0.8"] { transform: translate(calc(var(--mx) * 18px), calc(var(--my) * 12px)); }
.magazin-scene__layer[data-depth="1.0"] { transform: translate(calc(var(--mx) * 25px), calc(var(--my) * 16px)); }

/* Platform — задний план */
.magazin-scene__layer--platform {
    left: 12%; top: 54%; width: 76%; z-index: 2;
}
.magazin-scene__layer--platform .magazin-scene__anim {
    animation: magazin-scene-platform 5s ease-in-out infinite;
    filter: drop-shadow(0 30px 40px rgba(0,0,0,0.5));
}
@keyframes magazin-scene-platform {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-6px); }
}

/* Crystal — над сундуком */
.magazin-scene__layer--crystal {
    left: 45%; top: 6%; width: 14%; z-index: 3;
}
.magazin-scene__layer--crystal .magazin-scene__anim {
    animation: magazin-scene-crystal 3.5s ease-in-out infinite;
    filter: drop-shadow(0 0 20px var(--magazin-magic));
}
@keyframes magazin-scene-crystal {
    0%, 100% { transform: translateY(0) rotate(-3deg); }
    50%      { transform: translateY(-12px) rotate(3deg); }
}

/* Chest — центральный объект */
.magazin-scene__layer--chest {
    left: 38%; top: 30%; width: 28%; z-index: 4;
    pointer-events: auto;
}
.magazin-scene__layer--chest .magazin-scene__anim {
    animation: magazin-scene-chest 5s ease-in-out infinite;
    filter: drop-shadow(0 0 30px var(--magazin-accent))
            drop-shadow(0 20px 20px rgba(0,0,0,0.4));
    transition: filter 0.3s ease;
}
.magazin-scene__layer--chest:hover .magazin-scene__anim {
    filter: drop-shadow(0 0 60px var(--magazin-accent))
            drop-shadow(0 0 30px rgba(255,215,0,0.8))
            drop-shadow(0 20px 20px rgba(0,0,0,0.4));
}
@keyframes magazin-scene-chest {
    0%, 100% { transform: translateY(0) scale(1); }
    50%      { transform: translateY(-10px) scale(1.02); }
}

/* Character — слева */
.magazin-scene__layer--character {
    left: 16%; top: 24%; width: 22%; z-index: 5;
}
.magazin-scene__layer--character .magazin-scene__anim {
    animation: magazin-scene-character 4s ease-in-out infinite;
    filter: drop-shadow(0 20px 25px rgba(0,0,0,0.45));
}
@keyframes magazin-scene-character {
    0%, 100% { transform: translateY(0) scale(1); }
    50%      { transform: translateY(-3px) scale(1.008); }
}

/* Coin stack — справа */
.magazin-scene__layer--coin-stack {
    left: 64%; top: 44%; width: 16%; z-index: 5;
}
.magazin-scene__layer--coin-stack .magazin-scene__anim {
    animation: magazin-scene-coins 4s ease-in-out infinite;
    filter: drop-shadow(0 0 15px var(--magazin-accent))
            drop-shadow(0 15px 15px rgba(0,0,0,0.4));
}
@keyframes magazin-scene-coins {
    0%, 100% { transform: translateY(0); filter: brightness(1); }
    50%      { transform: translateY(-4px); filter: brightness(1.15); }
}

/* Flying coins — вылетают из сундука */
.magazin-scene__coin {
    position: absolute;
    left: 48%; top: 38%;
    width: 5%;
    z-index: 6;
    pointer-events: none;
    filter: drop-shadow(0 0 12px var(--magazin-accent));
    transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.magazin-scene__coin[data-depth="1.0"] { transform: translate(calc(var(--mx) * 25px), calc(var(--my) * 16px)); }
.magazin-scene__coin-anim { width: 100%; }
.magazin-scene__coin img { width: 100%; height: auto; display: block; }

.magazin-scene__coin--left  .magazin-scene__coin-anim { animation: magazin-scene-arc-left  5s ease-in-out infinite; }
.magazin-scene__coin--up    .magazin-scene__coin-anim { animation: magazin-scene-arc-up    5s ease-in-out infinite 0.4s; }
.magazin-scene__coin--right .magazin-scene__coin-anim { animation: magazin-scene-arc-right 5s ease-in-out infinite 0.8s; }

@keyframes magazin-scene-arc-left {
    0%, 100% { transform: translate(0, 0) rotate(0deg) scale(0); opacity: 0; }
    20%      { transform: translate(-20px, -30px) rotate(90deg) scale(1); opacity: 1; }
    50%      { transform: translate(-80px, -120px) rotate(360deg) scale(1.1); opacity: 1; }
    80%      { transform: translate(-120px, 15px) rotate(720deg) scale(0.9); opacity: 0.5; }
    95%      { transform: translate(-140px, 30px) rotate(810deg) scale(0); opacity: 0; }
}
@keyframes magazin-scene-arc-up {
    0%, 100% { transform: translate(0, 0) rotate(0deg) scale(0); opacity: 0; }
    20%      { transform: translate(5px, -35px) rotate(120deg) scale(1); opacity: 1; }
    50%      { transform: translate(15px, -150px) rotate(480deg) scale(1.15); opacity: 1; }
    80%      { transform: translate(20px, -40px) rotate(840deg) scale(0.9); opacity: 0.5; }
    95%      { transform: translate(20px, -25px) rotate(900deg) scale(0); opacity: 0; }
}
@keyframes magazin-scene-arc-right {
    0%, 100% { transform: translate(0, 0) rotate(0deg) scale(0); opacity: 0; }
    20%      { transform: translate(30px, -30px) rotate(-90deg) scale(1); opacity: 1; }
    50%      { transform: translate(100px, -110px) rotate(-360deg) scale(1.1); opacity: 1; }
    80%      { transform: translate(140px, 20px) rotate(-720deg) scale(0.9); opacity: 0.5; }
    95%      { transform: translate(155px, 35px) rotate(-810deg) scale(0); opacity: 0; }
}

/* Sparkles */
.magazin-scene__spark {
    position: absolute;
    width: 3%;
    z-index: 7;
    pointer-events: none;
    opacity: 0;
}
.magazin-scene__spark-anim { width: 100%; }
.magazin-scene__spark img { width: 100%; height: auto; display: block; }

.magazin-scene__spark--chest-1 { left: 48%; top: 38%; } .magazin-scene__spark--chest-1 .magazin-scene__spark-anim { animation: magazin-scene-spark-burst 2.5s ease-out infinite 0s;    --dx: -22px; --dy: -60px; }
.magazin-scene__spark--chest-2 { left: 52%; top: 38%; } .magazin-scene__spark--chest-2 .magazin-scene__spark-anim { animation: magazin-scene-spark-burst 2.5s ease-out infinite 0.5s;  --dx: 28px;  --dy: -70px; }
.magazin-scene__spark--chest-3 { left: 50%; top: 38%; } .magazin-scene__spark--chest-3 .magazin-scene__spark-anim { animation: magazin-scene-spark-burst 2.5s ease-out infinite 1.0s;  --dx: 0px;   --dy: -90px; }
.magazin-scene__spark--chest-4 { left: 47%; top: 38%; } .magazin-scene__spark--chest-4 .magazin-scene__spark-anim { animation: magazin-scene-spark-burst 2.5s ease-out infinite 1.5s;  --dx: -42px; --dy: -45px; }

.magazin-scene__spark--wand-1 { left: 34%; top: 30%; width: 2.5%; } .magazin-scene__spark--wand-1 .magazin-scene__spark-anim { animation: magazin-scene-spark-twinkle 1.8s ease-in-out infinite 0s; }
.magazin-scene__spark--wand-2 { left: 37%; top: 28%; width: 2%;   } .magazin-scene__spark--wand-2 .magazin-scene__spark-anim { animation: magazin-scene-spark-twinkle 1.8s ease-in-out infinite 0.6s; }
.magazin-scene__spark--wand-3 { left: 35%; top: 33%; width: 2.2%; } .magazin-scene__spark--wand-3 .magazin-scene__spark-anim { animation: magazin-scene-spark-twinkle 1.8s ease-in-out infinite 1.2s; }

@keyframes magazin-scene-spark-burst {
    0%    { transform: translate(0, 0) scale(0); opacity: 0; }
    20%   { transform: translate(calc(var(--dx) * 0.3), calc(var(--dy) * 0.3)) scale(1); opacity: 1; }
    60%   { transform: translate(calc(var(--dx) * 0.8), calc(var(--dy) * 0.8)) scale(1.2); opacity: 0.9; }
    100%  { transform: translate(var(--dx), var(--dy)) scale(0); opacity: 0; }
}
@keyframes magazin-scene-spark-twinkle {
    0%, 100% { transform: scale(0) rotate(0deg); opacity: 0; }
    50%      { transform: scale(1.3) rotate(180deg); opacity: 1; }
}

/* Отключаем анимации и parallax когда пользователь просит reduced motion */
@media (prefers-reduced-motion: reduce) {
    .magazin-scene *,
    .magazin-scene::before { animation: none !important; transition: none !important; }
    .magazin-scene__spark { opacity: 0.7; }
    .magazin-scene__coin { display: none; }
}

.magazin-roles-hero {
    max-width: 900px;
    margin: 0 auto 3rem;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.12);
}
.magazin-roles-hero img {
    width: 100%;
    height: auto;
    display: block;
}

/* ============================================================ */
/* STEPS — 20-минутный старт                                     */
/* ============================================================ */
.magazin-steps {
    padding: clamp(4rem, 7vw, 7rem) 0;
    background: #fff;
}
.magazin-steps__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    margin-top: 3rem;
}
.magazin-step {
    position: relative;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    padding: 2rem 1.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.magazin-step:hover {
    transform: translateY(-4px);
    border-color: #fbbf24;
    box-shadow: 0 12px 28px rgba(245, 158, 11, 0.12);
}
.magazin-step__num {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: linear-gradient(135deg, #f59e0b 0%, #ec4899 100%);
    color: #fff;
    font-weight: 800;
    font-size: 1.15rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.magazin-step__time {
    font-size: 0.82rem;
    font-weight: 600;
    color: #b45309;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.magazin-step__title {
    font-size: 1.12rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.3;
    margin: 0;
}
.magazin-step__text {
    font-size: 0.94rem;
    line-height: 1.55;
    color: #475569;
    margin: 0;
    flex: 1;
}
.magazin-step__result {
    margin-top: 0.5rem;
    padding: 0.75rem 1rem;
    background: #fff7ed;
    border-left: 3px solid #f59e0b;
    border-radius: 8px;
    font-size: 0.88rem;
    line-height: 1.5;
    color: #78350f;
}
.magazin-step__result strong { color: #b45309; }

/* ============================================================ */
/* ASPECT LABEL — счётчик «Аспект N / 6»                        */
/* ============================================================ */
.magazin-aspect__label {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.12) 0%, rgba(236, 72, 153, 0.08) 100%);
    color: #b45309;
    border: 1px solid #fde68a;
    font-weight: 700;
    letter-spacing: 0.02em;
}

/* ============================================================ */
/* FAIR — сезонный формат (ярмарка/аукцион)                     */
/* ============================================================ */
.magazin-fair__intro {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}
.magazin-fair__card {
    padding: 1.75rem 2rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.04);
}
.magazin-fair__card--accent {
    background: linear-gradient(135deg, #fff7ed 0%, #fef3c7 100%);
    border-color: #fcd34d;
}
.magazin-fair__card-title {
    font-size: 0.95rem;
    font-weight: 700;
    color: #b45309;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.75rem;
}
.magazin-fair__card p {
    margin: 0;
    color: #334155;
    font-size: 1rem;
    line-height: 1.6;
}
@media (max-width: 768px) {
    .magazin-fair__intro {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    .magazin-fair__card { padding: 1.25rem 1.5rem; }
}

/* ============================================================ */
/* PROOF — видео-подтверждение в конце каждого аспекта          */
/* ============================================================ */
.magazin-proof {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 2.5rem;
    align-items: center;
    margin-top: 3.5rem;
    padding: 2rem 2.25rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}
.magazin-proof__body {
    max-width: 440px;
}
.magazin-proof__label {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #b45309;
    background: #fef3c7;
    padding: 0.38rem 0.85rem;
    border-radius: 999px;
    margin-bottom: 1rem;
}
.magazin-proof__label svg { flex-shrink: 0; }
.magazin-proof__title {
    font-size: clamp(1.15rem, 1.6vw, 1.35rem);
    font-weight: 800;
    line-height: 1.3;
    color: #0f172a;
    margin: 0 0 0.8rem;
    letter-spacing: -0.01em;
}
.magazin-proof__text {
    font-size: 0.96rem;
    line-height: 1.6;
    color: #475569;
    margin: 0 0 1.1rem;
}
.magazin-proof__more {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.92rem;
    font-weight: 600;
    color: #b45309;
    text-decoration: none;
    border-bottom: 1px dashed rgba(180, 83, 9, 0.4);
    padding-bottom: 2px;
    transition: color 0.2s ease, border-color 0.2s ease;
}
.magazin-proof__more:hover {
    color: #9a3412;
    border-bottom-color: #9a3412;
}
.magazin-proof__video {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    background: #0f172a;
    aspect-ratio: 16 / 9;
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.22);
}
.magazin-proof__video video {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}
/* на тёмных секциях (сейчас не используется, но на будущее) */
.magazin-network .magazin-proof {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(251, 191, 36, 0.25);
}
.magazin-network .magazin-proof__title { color: #fff; }
.magazin-network .magazin-proof__text { color: #cbd5e1; }

/* ============================================================ */
/* SNAPSHOT — что школы покупают                                */
/* ============================================================ */
.magazin-snapshot {
    padding: clamp(4rem, 7vw, 7rem) 0;
    background: #fff;
}
.magazin-snapshot__stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    margin: 2.5rem 0 3rem;
}
.magazin-snapshot__stat {
    text-align: center;
    padding: 1.75rem 1rem;
    background: linear-gradient(135deg, #fff7ed 0%, #fff 100%);
    border: 1px solid #fde68a;
    border-radius: 16px;
}
.magazin-snapshot__stat-value {
    display: block;
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    font-weight: 800;
    line-height: 1.1;
    background: linear-gradient(135deg, #f59e0b 0%, #ec4899 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    margin-bottom: 0.5rem;
}
.magazin-snapshot__stat-label {
    font-size: 0.88rem;
    color: #475569;
    line-height: 1.4;
}
.magazin-snapshot__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    margin-bottom: 2rem;
}
.magazin-snapshot__top {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 1.75rem 1.75rem 1.5rem;
}
.magazin-snapshot__top--accent {
    background: #fff7ed;
    border-color: #fde68a;
}
.magazin-snapshot__top-title {
    font-size: 0.88rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    margin: 0 0 1rem;
}
.magazin-snapshot__top--accent .magazin-snapshot__top-title { color: #b45309; }
.magazin-snapshot__list {
    list-style: none;
    padding: 0;
    margin: 0;
    counter-reset: snap;
}
.magazin-snapshot__list li {
    counter-increment: snap;
    padding: 0.65rem 0;
    border-bottom: 1px solid #e2e8f0;
    font-size: 0.98rem;
    color: #0f172a;
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
}
.magazin-snapshot__list li:last-child { border-bottom: none; }
.magazin-snapshot__list li::before {
    content: counter(snap);
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #e2e8f0;
    color: #475569;
    font-size: 0.78rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.magazin-snapshot__top--accent .magazin-snapshot__list li::before {
    background: linear-gradient(135deg, #f59e0b 0%, #ec4899 100%);
    color: #fff;
}
.magazin-snapshot__insight {
    padding: 1.5rem 1.75rem;
    background: #0f172a;
    color: #f8fafc;
    border-radius: 16px;
    font-size: 1rem;
    line-height: 1.6;
}
.magazin-snapshot__insight strong { color: #fbbf24; }

/* ============================================================ */
/* RULES — bad vs good                                           */
/* ============================================================ */
.magazin-rules {
    padding: clamp(4rem, 7vw, 7rem) 0;
    background: var(--bg-warm, #fff7ed);
}
.magazin-rules__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.75rem;
    margin-top: 3rem;
}
.magazin-rules__card {
    background: #fff;
    border-radius: 20px;
    padding: 2rem 2rem 1.75rem;
    border: 2px solid;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.magazin-rules__card--bad { border-color: #fecaca; background: #fef2f2; }
.magazin-rules__card--good { border-color: #a7f3d0; background: #ecfdf5; }
.magazin-rules__head {
    font-size: 1.2rem;
    font-weight: 800;
    color: #0f172a;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.magazin-rules__card--bad .magazin-rules__head::before {
    content: "×";
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #ef4444;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    line-height: 1;
}
.magazin-rules__card--good .magazin-rules__head::before {
    content: "✓";
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #10b981;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
}
.magazin-rules__subtitle {
    font-size: 0.92rem;
    color: #475569;
    margin: 0;
    line-height: 1.5;
}
.magazin-rules__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}
.magazin-rules__list li {
    font-size: 0.95rem;
    line-height: 1.5;
    color: #0f172a;
    padding-left: 1.5rem;
    position: relative;
}
.magazin-rules__card--bad .magazin-rules__list li::before {
    content: "–";
    position: absolute;
    left: 0;
    color: #dc2626;
    font-weight: 700;
}
.magazin-rules__card--good .magazin-rules__list li::before {
    content: "→";
    position: absolute;
    left: 0;
    color: #059669;
    font-weight: 700;
}
.magazin-rules__footer {
    margin-top: auto;
    padding-top: 1rem;
    border-top: 1px dashed rgba(15, 23, 42, 0.15);
    font-size: 0.88rem;
    color: #475569;
    line-height: 1.5;
}
.magazin-rules__footer strong { color: #0f172a; }
.magazin-rules__note {
    margin-top: 2rem;
    padding: 1.25rem 1.75rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    font-size: 0.94rem;
    line-height: 1.6;
    color: #334155;
    text-align: center;
}
.magazin-rules__note strong { color: #b45309; }

/* ============================================================ */
/* ANTIPATTERNS — fix blurb                                      */
/* ============================================================ */
.magazin-anti__fix {
    margin-top: 2.5rem;
    padding: 1.5rem 1.75rem;
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.08) 0%, rgba(245, 158, 11, 0.06) 100%);
    border: 1px solid #a7f3d0;
    border-radius: 14px;
    font-size: 0.98rem;
    line-height: 1.6;
    color: #0f172a;
}
.magazin-anti__fix strong { color: #059669; }

/* ============================================================ */
/* NETWORK — сетевая статистика                                 */
/* ============================================================ */
.magazin-network {
    padding: clamp(4rem, 7vw, 7rem) 0;
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
    color: #f8fafc;
}
.magazin-network .section-header h2 { color: #fff; }
.magazin-network .section-header p { color: #cbd5e1; }
.magazin-network__stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    margin-top: 3rem;
}
.magazin-network__stat {
    text-align: center;
    padding: 2rem 1rem;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(251, 191, 36, 0.25);
    border-radius: 16px;
}
.magazin-network__stat-value {
    display: block;
    font-size: clamp(2rem, 3.5vw, 2.75rem);
    font-weight: 800;
    line-height: 1.05;
    background: linear-gradient(135deg, #fbbf24 0%, #f472b6 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    margin-bottom: 0.5rem;
}
.magazin-network__stat-label {
    font-size: 0.9rem;
    color: #cbd5e1;
    line-height: 1.4;
}

/* ============================================================ */
/* RESPONSIVE                                                    */
/* ============================================================ */
@media (max-width: 960px) {
    .magazin-steps__grid { grid-template-columns: repeat(2, 1fr); }
    .magazin-snapshot__stats { grid-template-columns: repeat(2, 1fr); }
    .magazin-snapshot__grid { grid-template-columns: 1fr; }
    .magazin-rules__grid { grid-template-columns: 1fr; }
    .magazin-network__stats { grid-template-columns: repeat(2, 1fr); }
    .magazin-proof {
        grid-template-columns: 1fr;
        gap: 1.75rem;
        padding: 1.5rem;
    }
    .magazin-proof__body { max-width: none; }
}

@media (max-width: 640px) {
    .magazin-steps__grid { grid-template-columns: 1fr; }
    .magazin-snapshot__stats { grid-template-columns: 1fr; }
    .magazin-network__stats { grid-template-columns: 1fr; }
    .magazin-hero-image { max-width: 420px; }
    .magazin-roles-hero { margin-bottom: 2rem; border-radius: 16px; }
}