@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800&display=swap');

/* ── CoreView — Indigo system ── */
        .cs-page, .cs-hero-wrap {
            --accent:       #6366f1;
            --accent-light: #818cf8;
            --accent-deep:  #1e1b4b;
        }

        /* Shared indigo overrides */
        .cs-tag            { color: var(--accent-light); border-color: rgba(129,140,248,0.25); background: rgba(99,102,241,0.07); }
        .cs-challenge-num  { color: var(--accent-light); }
        .cs-constraints    { background: var(--accent-deep); border-top-color: rgba(129,140,248,0.15); border-bottom-color: rgba(129,140,248,0.15); }

        /* ── Hero wrapper — matches .nav-container exactly ── */
        .cs-hero-wrap {
            background: #111114;
            max-width: 1440px;
            margin: 0 auto;
            padding: 0 5%;
        }

        .cs-hero-wrap .breadcrumb {
            padding-top: 24px;
            padding-bottom: 0;
        }

        /* ── Hero layout ── */
        .cs-hero {
            display: grid;
            grid-template-columns: 7fr 4fr;
            gap: 60px;
            align-items: center;
            min-height: calc(100vh - var(--nav-h));
            padding: 48px 0 40px;
        }

        /* ── LEFT column ── */
        .cv-hero-left {
            display: flex;
            flex-direction: column;
            gap: 0;
        }

        .cv-eyebrow {
            font-size: 0.72rem;
            font-weight: 700;
            letter-spacing: 0.16em;
            text-transform: uppercase;
            color: var(--accent-light);
            margin-bottom: 18px;
        }

        .cv-title {
            font-size: clamp(2rem, 3.6vw, 3.2rem);
            font-weight: 800;
            line-height: 1.1;
            color: #f0f0f0;
            margin-bottom: 20px;
        }

        .cv-subtitle {
            font-size: 1rem;
            line-height: 1.75;
            color: rgba(232,232,232,0.5);
            margin-bottom: 28px;
            max-width: 500px;
        }

        .cv-confidential {
            font-size: 0.88rem;
            color: rgba(232,232,232,0.38);
            border-left: 3px solid rgba(129,140,248,0.4);
            padding-left: 14px;
            font-style: italic;
            margin-bottom: 36px;
        }

        /* 2×2 meta grid */
        .cv-meta {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 24px 32px;
            margin-bottom: 32px;
        }

        .cv-meta-label {
            display: block;
            font-size: 0.68rem;
            font-weight: 700;
            letter-spacing: 0.12em;
            text-transform: uppercase;
            color: rgba(232,232,232,0.35);
            margin-bottom: 6px;
        }

        .cv-meta-value {
            font-size: 0.93rem;
            font-weight: 600;
            color: #e2e0dd;
            line-height: 1.45;
        }

        /* Tags */
        .cv-tags {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
        }

        .cv-tag {
            font-size: 0.75rem;
            font-weight: 500;
            padding: 6px 14px;
            border-radius: 100px;
            border: 1px solid rgba(129,140,248,0.3);
            color: var(--accent-light);
            background: transparent;
            transition: 0.2s;
        }

        .cv-tag:hover {
            background: rgba(99,102,241,0.12);
        }

        /* ── RIGHT column ── */
        .cv-hero-right {
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 420px;
        }

        /* Blob decorations */
        .cv-blob {
            position: absolute;
            border-radius: 50%;
            filter: blur(70px);
            pointer-events: none;
        }

        .cv-blob-1 {
            width: 340px; height: 340px;
            background: rgba(99,102,241,0.18);
            top: -40px; right: -20px;
        }

        .cv-blob-2 {
            width: 260px; height: 260px;
            background: rgba(129,140,248,0.12);
            bottom: 0; left: 10px;
        }

        .cv-blob-3 {
            width: 180px; height: 180px;
            background: rgba(167,139,250,0.1);
            top: 50%; left: 50%;
            transform: translate(-50%, -50%);
        }

        /* Device composition */
        .cv-devices {
            position: relative;
            width: 100%;
            max-width: 520px;
            z-index: 1;
        }

        .cv-tablet {
            width: 100%;
            border-radius: 16px;
            display: block;
            
        }

        /* Responsive */
        @media (max-width: 900px) {
            .cs-hero {
                grid-template-columns: 1fr;
                gap: 40px;
                padding: 36px 0 48px;
            }

            .cv-hero-right {
                order: -1;
                min-height: 240px;
            }

            .cv-blob { display: none; }

            .cv-title { font-size: 2rem; }
        }

/* ══════════════════════════════════════
   COREVIEW — SCOPED TYPOGRAPHY
   Applies to <main class="cs-page"> only.
   Nav and footer are unaffected.
══════════════════════════════════════ */

.cs-page {
    font-family: 'Plus Jakarta Sans', sans-serif;
}

/* Display / hero title */
.cs-page .cv-title {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1.08;
}

/* Section headings */
.cs-page h2,
.cs-page .cs-section-title {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.15;
}

/* Sub-headings */
.cs-page h3,
.cs-page .cs-card-title {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 600;
    letter-spacing: -0.015em;
    line-height: 1.3;
}

/* Body text */
.cs-page p,
.cs-page li,
.cs-page .cv-subtitle,
.cs-page .cs-body {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 400;
    letter-spacing: -0.01em;
    line-height: 1.75;
}

/* Micro labels / eyebrows */
.cs-page .cv-eyebrow,
.cs-page .cv-meta-label,
.cs-page .cs-label {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 700;
    letter-spacing: 0.1em;
}

/* Meta values */
.cs-page .cv-meta-value {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 600;
    letter-spacing: -0.01em;
}

/* Tags / chips */
.cs-page .cv-tag {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 500;
    letter-spacing: 0;
}

/* Confidential note — keep italic */
.cs-page .cv-confidential {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 400;
    font-style: italic;
}