.post-wrapper { max-width: 740px; margin: 28px auto; padding: 0 20px 60px; }

    .post-back {
        display: inline-flex; align-items: center; gap: 6px;
        color: #7c3aed; text-decoration: none; font-weight: 600; font-size: 14px;
        margin-bottom: 22px; padding: 7px 14px; background: #ede9fe;
        border-radius: 10px; transition: background 0.15s;
    }
    .post-back:hover { background: #ddd6fe; }

    .post-lang-badge {
        display: inline-flex; align-items: center; gap: 4px;
        background: #ede9fe; color: #7c3aed;
        padding: 4px 12px; border-radius: 20px;
        font-size: 12px; font-weight: 700; margin-bottom: 14px;
    }
    .post-lang-toggle {
        padding: 6px 16px; border-radius: 20px; font-size: 13px; font-weight: 700;
        border: 2px solid #e2e8f0; background: white; color: #64748b;
        cursor: pointer; transition: 0.15s; margin-bottom: 18px;
        display: inline-block; text-decoration: none;
    }
    .post-lang-toggle.active-lang {
        border-color: #7c3aed; background: #ede9fe; color: #7c3aed;
    }

    .post-header h1 {
        font-size: 32px; font-weight: 800; color: #0f172a;
        line-height: 1.3; margin-bottom: 10px;
    }

    .post-meta {
        color: #64748b; font-size: 13px; margin-bottom: 20px;
        padding-bottom: 16px; border-bottom: 1px solid #f1f5f9;
    }

    .author-card {
        display: flex; align-items: flex-start; gap: 14px;
        background: #fafaf9; border: 1px solid #f1f5f9;
        border-radius: 14px; padding: 16px 18px; margin-bottom: 24px;
    }
    .author-avatar {
        flex-shrink: 0; width: 44px; height: 44px; border-radius: 50%;
        background: linear-gradient(135deg, #c2410c, #f97316);
        color: white; font-size: 18px; font-weight: 800;
        display: flex; align-items: center; justify-content: center;
    }
    .author-label { font-size: 11px; font-weight: 700; color: #64748b;
                    text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 2px; }
    .author-name  { font-size: 14px; font-weight: 800; color: #0f172a; margin-bottom: 4px; }
    .author-bio   { font-size: 13px; color: #64748b; line-height: 1.55; }

    .post-cover {
        /* aspect-ratio reserves the space before the image loads (no layout shift) */
        width: 100%; height: auto; aspect-ratio: 16 / 9; max-height: 380px; object-fit: cover;
        border-radius: 16px; margin-bottom: 24px; display: block;
    }

    .post-body { margin-bottom: 8px; }

    .post-footer {
        margin-top: 40px; padding-top: 20px; border-top: 1px solid #f1f5f9;
        display: flex; align-items: center; justify-content: space-between;
        flex-wrap: wrap; gap: 12px;
    }

    .tools-cta {
        max-width: 740px; margin: 40px auto 0; padding: 28px 20px;
        background: linear-gradient(135deg, #faf5ff, #ede9fe);
        border-radius: 20px; border: 1px solid #ddd6fe;
        text-align: center;
    }
    .tools-cta h2 {
        font-size: 20px; font-weight: 800; color: #4c1d95; margin-bottom: 6px;
    }
    .tools-cta p {
        font-size: 14px; color: #6d28d9; margin-bottom: 20px;
    }
    .tools-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
        gap: 12px;
    }
    .tool-card {
        background: white; border-radius: 14px; padding: 16px 12px;
        text-decoration: none; color: inherit;
        border: 1.5px solid #ede9fe;
        display: flex; flex-direction: column; align-items: center; gap: 6px;
        transition: transform 0.15s, box-shadow 0.15s, border-color 0.15s;
    }
    .tool-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 8px 24px var(--focus-ring);
        border-color: #7c3aed;
    }
    .tool-icon { font-size: 26px; }
    .tool-name { font-size: 13px; font-weight: 800; color: #4c1d95; }
    .tool-desc { font-size: 11px; color: #6d28d9; line-height: 1.4; text-align: center; }