/* =========================================================
   Premium Pillar — personality-type.css əlavəsi
   Target: .ptypeP (pillars)
   ========================================================= */

/* Page container */
.ptypeP {
    max-width: 1120px;
    margin: 18px auto 80px;
    padding: 0 16px;
    color: var(--text-main);
    font-family: var(--font-sans);
}

    /* HERO */
    .ptypeP .ptypeP-hero {
        background: var(--card-bg);
        border: 1px solid var(--border);
        border-radius: var(--radius-lg);
        padding: 18px 16px;
        box-shadow: var(--shadow-sm);
        margin: 12px 0 18px;
    }

        .ptypeP .ptypeP-hero h1 {
            font-family: var(--font-serif);
            font-weight: 400;
            font-size: 30px;
            letter-spacing: -0.01em;
            margin: 0 0 10px;
        }

        .ptypeP .ptypeP-hero .lead {
            font-size: 15px;
            line-height: 1.8;
            color: var(--text-body);
            margin: 0 0 14px;
        }

    /* Cluster strip (internal link motor) */
    .ptypeP .clusterStrip {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
        margin-top: 14px;
    }

    .ptypeP .clusterChip {
        display: block;
        text-decoration: none;
        background: rgba(15,23,42,.04);
        border: 1px solid rgba(15,23,42,.08);
        border-radius: 14px;
        padding: 12px 12px;
        transition: transform .12s ease, background .12s ease, border-color .12s ease;
    }

        .ptypeP .clusterChip:hover {
            transform: translateY(-1px);
            background: rgba(15,23,42,.06);
            border-color: rgba(15,23,42,.12);
        }

        .ptypeP .clusterChip .ck {
            font-size: 14px;
            font-weight: 700;
            color: var(--text-main);
            margin-bottom: 4px;
        }

        .ptypeP .clusterChip .cv {
            font-size: 13px;
            line-height: 1.55;
            color: var(--text-muted);
        }

    /* Section cards */
    .ptypeP .sect {
        background: var(--card-bg);
        border: 1px solid var(--border);
        border-radius: var(--radius-lg);
        padding: 18px 16px;
        box-shadow: var(--shadow-sm);
        margin: 14px 0;
    }

        .ptypeP .sect h2 {
            font-family: var(--font-serif);
            font-weight: 400;
            font-size: 18px;
            margin: 0 0 10px;
        }

        .ptypeP .sect p {
            font-size: 14px;
            line-height: 1.85;
            color: var(--text-body);
            margin: 0 0 10px;
        }

            .ptypeP .sect p:last-child {
                margin-bottom: 0;
            }

    /* Prose block */
    .ptypeP .prose p {
        margin: 0 0 12px;
    }

        .ptypeP .prose p:last-child {
            margin-bottom: 0;
        }

    .ptypeP .prose a,
    .ptypeP .sect a {
        color: var(--accent);
        text-decoration: none;
        border-bottom: 1px solid rgba(0,0,0,.0);
        padding-bottom: 1px;
    }

        .ptypeP .prose a:hover,
        .ptypeP .sect a:hover {
            border-bottom-color: var(--accent);
        }

    /* Quote block */
    .ptypeP blockquote.q {
        margin: 14px 0 0;
        padding: 14px 14px;
        border-radius: 16px;
        border: 1px solid rgba(15,23,42,.10);
        background: rgba(15,23,42,.04);
    }

        .ptypeP blockquote.q p {
            margin: 0 0 8px;
            font-size: 14px;
            line-height: 1.85;
            color: var(--text-main);
        }

        .ptypeP blockquote.q footer {
            font-size: 13px;
            color: var(--text-muted);
        }

    /* Muted text */
    .ptypeP .muted {
        color: var(--text-muted);
        font-size: 13px;
        line-height: 1.7;
        margin: 0 0 10px;
    }

    /* Lists */
    .ptypeP ul {
        margin: 0;
        padding-left: 18px;
    }

    .ptypeP li {
        font-size: 14px;
        line-height: 1.8;
        color: var(--text-body);
        margin: 6px 0;
    }

    /* Risk lists */
    .ptypeP .warnList,
    .ptypeP .dangerList {
        list-style: none;
        padding: 0;
        margin: 10px 0 0;
    }

        .ptypeP .warnList li,
        .ptypeP .dangerList li {
            position: relative;
            padding: 10px 12px 10px 36px;
            border-radius: 14px;
            border: 1px solid rgba(15,23,42,.10);
            background: rgba(15,23,42,.03);
            margin: 10px 0;
        }

            .ptypeP .warnList li::before,
            .ptypeP .dangerList li::before {
                content: "";
                position: absolute;
                left: 12px;
                top: 12px;
                width: 14px;
                height: 14px;
                border-radius: 6px;
                background: rgba(15,23,42,.20);
            }

        .ptypeP .dangerList li {
            border-color: rgba(220,38,38,.18);
            background: rgba(220,38,38,.06);
        }

            .ptypeP .dangerList li::before {
                background: rgba(220,38,38,.30);
            }

        .ptypeP .warnList li {
            border-color: rgba(245,158,11,.22);
            background: rgba(245,158,11,.08);
        }

            .ptypeP .warnList li::before {
                background: rgba(245,158,11,.35);
            }

/* Responsive */
@media (min-width:600px) {
    .ptypeP {
        padding: 0 24px;
        margin-top: 22px;
    }

        .ptypeP .ptypeP-hero {
            padding: 22px 20px;
        }

            .ptypeP .ptypeP-hero h1 {
                font-size: 36px;
            }

        .ptypeP .clusterStrip {
            grid-template-columns: repeat(2, 1fr);
        }

        .ptypeP .sect {
            padding: 20px 18px;
        }

            .ptypeP .sect h2 {
                font-size: 20px;
            }

            .ptypeP .sect p, .ptypeP li {
                font-size: 15px;
            }
}

@media (min-width:900px) {
    .ptypeP .clusterStrip {
        grid-template-columns: repeat(3, 1fr);
    }
}