.faculty-page {
            background:
                linear-gradient(180deg, rgba(246, 252, 250, 0.94), rgba(255, 255, 255, 0.98) 46%, rgba(247, 250, 255, 0.92));
            color: #111827;
        }

        .faculty-page main {
            position: relative;
            overflow: hidden;
        }

        .faculty-page main::before {
            position: fixed;
            inset: 0;
            z-index: -2;
            content: "";
            background-image:
                linear-gradient(rgba(17, 24, 39, 0.04) 1px, transparent 1px),
                linear-gradient(90deg, rgba(17, 24, 39, 0.04) 1px, transparent 1px);
            background-size: 72px 72px;
            mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0.72) 48%, transparent 100%);
        }

        .faculty-wrap {
            display: grid;
            gap: 64px;
            padding: 28px 0 64px;
        }

        .faculty-hero,
        .faculty-operating {
            position: relative;
            overflow: hidden;
            border: 1px solid rgba(16, 94, 89, 0.18);
            border-radius: 12px;
            background:
                linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(242, 252, 249, 0.9) 48%, rgba(239, 246, 255, 0.94));
            box-shadow: 0 28px 90px rgba(15, 23, 42, 0.12);
            isolation: isolate;
        }

        .faculty-hero::before,
        .faculty-operating::before {
            position: absolute;
            inset: 0;
            z-index: -1;
            content: "";
            background-image:
                linear-gradient(rgba(20, 184, 166, 0.07) 1px, transparent 1px),
                linear-gradient(90deg, rgba(37, 99, 235, 0.06) 1px, transparent 1px);
            background-size: 58px 58px;
        }

        .faculty-hero-inner {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(420px, 0.86fr);
            gap: 52px;
            align-items: center;
            min-height: 690px;
            padding: 70px 64px;
        }

        .hero-copy {
            display: grid;
            gap: 24px;
            max-width: 670px;
        }

        .kicker-row {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            align-items: center;
        }

        .kicker,
        .soft-pill,
        .status-pill {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: fit-content;
            min-height: 32px;
            padding: 7px 13px;
            border: 1px solid rgba(16, 94, 89, 0.18);
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.82);
            color: #0f766e;
            font-size: 13px;
            font-weight: 900;
            line-height: 1.1;
        }

        .soft-pill {
            color: #374151;
        }

        .status-pill {
            gap: 8px;
            color: #0f766e;
        }

        .status-pill::before {
            width: 9px;
            height: 9px;
            border-radius: 50%;
            background: #14b8a6;
            box-shadow: 0 0 0 5px rgba(20, 184, 166, 0.12);
            content: "";
        }

        .hero-title {
            max-width: 620px;
            margin: 0;
            color: #090d14;
            font-size: 64px;
            font-weight: 950;
            line-height: 1.05;
        }

        .hero-title .tone-teal {
            color: #0f766e;
        }

        .hero-title .tone-blue {
            color: #2563eb;
        }

        .hero-copy > p {
            max-width: 560px;
            margin: 0;
            color: #64748b;
            font-size: 18px;
            font-weight: 650;
            line-height: 1.65;
        }

        .hero-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 12px;
            align-items: center;
        }

        .faculty-button {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 48px;
            padding: 13px 20px;
            border: 1px solid rgba(15, 118, 110, 0.18);
            border-radius: 8px;
            font-size: 14px;
            font-weight: 950;
            line-height: 1.1;
            text-decoration: none;
            transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease, background 180ms ease;
        }

        .faculty-button.primary {
            background: #0f8a7d;
            color: #fff;
            box-shadow: 0 18px 40px rgba(15, 138, 125, 0.26);
        }

        .faculty-button.secondary {
            background: rgba(255, 255, 255, 0.88);
            color: #111827;
        }

        .faculty-button:hover {
            transform: translateY(-2px);
            box-shadow: 0 20px 46px rgba(15, 23, 42, 0.16);
        }

        .hero-stats {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 12px;
            max-width: 640px;
            padding-top: 10px;
        }

        .hero-stat {
            min-height: 116px;
            padding: 17px;
            border: 1px solid rgba(148, 163, 184, 0.34);
            border-left: 4px solid var(--accent, #0f766e);
            border-radius: 8px;
            background: rgba(255, 255, 255, 0.82);
            box-shadow: 0 14px 34px rgba(15, 23, 42, 0.07);
        }

        .hero-stat strong {
            display: block;
            margin-bottom: 5px;
            color: #111827;
            font-size: 28px;
            font-weight: 950;
            line-height: 1;
        }

        .hero-stat span {
            color: #64748b;
            font-size: 13px;
            font-weight: 850;
            line-height: 1.35;
        }

        .faculty-board {
            justify-self: end;
            width: 100%;
            max-width: 620px;
            overflow: hidden;
            border: 1px solid rgba(16, 94, 89, 0.18);
            border-radius: 10px;
            background: rgba(255, 255, 255, 0.92);
            box-shadow: 0 26px 70px rgba(15, 23, 42, 0.16);
            animation: facultyPanelLift 780ms ease both;
        }

        .board-head {
            display: flex;
            gap: 18px;
            align-items: center;
            justify-content: space-between;
            padding: 22px 24px;
            border-bottom: 1px solid rgba(148, 163, 184, 0.24);
        }

        .board-head h2 {
            margin: 0;
            color: #111827;
            font-size: 18px;
            font-weight: 950;
            line-height: 1.15;
        }

        .board-head p {
            margin: 3px 0 0;
            color: #64748b;
            font-size: 13px;
            font-weight: 850;
        }

        .board-body {
            display: grid;
            gap: 18px;
            padding: 20px;
        }

        .teacher-feature {
            display: grid;
            gap: 18px;
            padding: 20px;
            border: 1px solid rgba(148, 163, 184, 0.28);
            border-radius: 8px;
            background:
                linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(248, 252, 251, 0.94));
        }

        .feature-profile {
            display: grid;
            grid-template-columns: auto 1fr;
            gap: 14px;
            align-items: center;
        }

        .teacher-avatar {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 64px;
            height: 64px;
            border: 1px solid rgba(20, 184, 166, 0.22);
            border-radius: 8px;
            background:
                linear-gradient(135deg, #0f766e, #2563eb);
            color: #fff;
            font-size: 20px;
            font-weight: 950;
            box-shadow: 0 18px 34px rgba(15, 118, 110, 0.22);
        }

        .teacher-avatar.small {
            width: 48px;
            height: 48px;
            font-size: 15px;
        }

        .feature-profile h3,
        .teacher-card h3 {
            margin: 0;
            color: #111827;
            font-size: 25px;
            font-weight: 950;
            line-height: 1.15;
        }

        .feature-profile p,
        .teacher-card p {
            margin: 5px 0 0;
            color: #64748b;
            font-size: 14px;
            font-weight: 700;
            line-height: 1.55;
        }

        .faculty-meter-stack {
            display: grid;
            gap: 10px;
        }

        .faculty-meter {
            display: grid;
            grid-template-columns: minmax(95px, 0.44fr) 1fr auto;
            gap: 12px;
            align-items: center;
            min-height: 52px;
            padding: 10px 12px;
            border: 1px solid rgba(148, 163, 184, 0.22);
            border-radius: 8px;
            background: rgba(255, 255, 255, 0.88);
        }

        .faculty-meter span,
        .faculty-meter strong {
            color: #111827;
            font-size: 13px;
            font-weight: 900;
        }

        .meter-track {
            position: relative;
            height: 7px;
            overflow: hidden;
            border-radius: 999px;
            background: rgba(15, 118, 110, 0.1);
        }

        .meter-track i {
            position: absolute;
            inset: 0 auto 0 0;
            width: var(--value, 50%);
            border-radius: inherit;
            background: var(--accent, #0f766e);
            animation: facultyMeter 920ms ease both;
        }

        .teacher-flow {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 10px;
        }

        .flow-step {
            min-height: 96px;
            padding: 13px;
            border: 1px solid rgba(148, 163, 184, 0.28);
            border-top: 3px solid var(--accent, #0f766e);
            border-radius: 8px;
            background: rgba(255, 255, 255, 0.9);
        }

        .flow-step strong {
            display: block;
            margin-bottom: 7px;
            color: #111827;
            font-size: 13px;
            font-weight: 950;
        }

        .flow-step span {
            display: block;
            color: #64748b;
            font-size: 12px;
            font-weight: 800;
            line-height: 1.45;
        }

        .flow-strip {
            display: grid;
            grid-template-columns: auto minmax(0, 1fr);
            overflow: hidden;
            min-height: 56px;
            border: 1px solid rgba(16, 94, 89, 0.18);
            border-radius: 10px;
            background: #06151b;
            color: #fff;
            box-shadow: 0 18px 50px rgba(15, 23, 42, 0.15);
        }

        .flow-strip strong {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 158px;
            padding: 0 22px;
            background: linear-gradient(135deg, #0f766e, #2563eb);
            font-size: 13px;
            font-weight: 950;
        }

        .flow-marquee {
            display: flex;
            gap: 22px;
            align-items: center;
            min-width: max-content;
            padding: 0 24px;
            color: rgba(255, 255, 255, 0.82);
            font-size: 13px;
            font-weight: 900;
            animation: facultyMarquee 24s linear infinite;
        }

        .flow-marquee span {
            display: inline-flex;
            gap: 10px;
            align-items: center;
            white-space: nowrap;
        }

        .flow-marquee span::before {
            width: 8px;
            height: 8px;
            border-radius: 999px;
            background: #f3b95f;
            content: "";
        }

        .section-heading {
            display: flex;
            gap: 28px;
            align-items: end;
            justify-content: space-between;
            margin-bottom: 26px;
        }

        .section-heading h2 {
            max-width: 620px;
            margin: 0;
            color: #111827;
            font-size: 40px;
            font-weight: 950;
            line-height: 1.12;
        }

        .section-heading p {
            max-width: 620px;
            margin: 10px 0 0;
            color: #64748b;
            font-size: 16px;
            font-weight: 680;
            line-height: 1.65;
        }

        .teacher-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 18px;
        }

        .teacher-card {
            position: relative;
            display: grid;
            gap: 18px;
            align-content: start;
            min-height: 380px;
            padding: 22px;
            overflow: hidden;
            border: 1px solid rgba(148, 163, 184, 0.3);
            border-radius: 8px;
            background:
                linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(249, 253, 252, 0.92));
            box-shadow: 0 18px 48px rgba(15, 23, 42, 0.08);
            transform: translateY(0);
            transition: transform 190ms ease, box-shadow 190ms ease, border-color 190ms ease;
            animation: facultyCardIn 720ms ease both;
            animation-delay: calc(var(--i, 0) * 70ms);
        }

        .teacher-card::before {
            position: absolute;
            inset: 0 0 auto;
            height: 4px;
            background: linear-gradient(90deg, #0f766e, #2563eb, #c16b15);
            content: "";
        }

        .teacher-card:hover {
            border-color: rgba(15, 118, 110, 0.34);
            box-shadow: 0 26px 70px rgba(15, 23, 42, 0.13);
            transform: translateY(-4px);
        }

        .teacher-card.support {
            background:
                linear-gradient(180deg, rgba(250, 253, 252, 0.94), rgba(244, 250, 255, 0.9));
        }

        .teacher-card-head {
            display: flex;
            gap: 14px;
            align-items: center;
            justify-content: space-between;
        }

        .teacher-name {
            display: grid;
            grid-template-columns: auto 1fr;
            gap: 14px;
            align-items: center;
        }

        .teacher-name .teacher-avatar {
            flex: 0 0 auto;
        }

        .teacher-card h3 {
            font-size: 22px;
        }

        .teacher-meta {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
        }

        .metric-row {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 8px;
        }

        .mini-metric {
            min-height: 76px;
            padding: 12px;
            border: 1px solid rgba(148, 163, 184, 0.26);
            border-radius: 8px;
            background: rgba(255, 255, 255, 0.82);
        }

        .mini-metric strong {
            display: block;
            color: #111827;
            font-size: 22px;
            font-weight: 950;
            line-height: 1;
        }

        .mini-metric span {
            display: block;
            margin-top: 6px;
            color: #64748b;
            font-size: 12px;
            font-weight: 850;
            line-height: 1.25;
        }

        .subject-list,
        .batch-list {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
        }

        .batch-list {
            display: grid;
        }

        .batch-row {
            display: grid;
            grid-template-columns: auto 1fr;
            gap: 10px;
            align-items: center;
            min-height: 54px;
            padding: 10px;
            border: 1px solid rgba(148, 163, 184, 0.24);
            border-radius: 8px;
            background: rgba(255, 255, 255, 0.72);
        }

        .batch-code {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 36px;
            height: 36px;
            border-radius: 8px;
            background: rgba(15, 118, 110, 0.09);
            color: #0f766e;
            font-size: 11px;
            font-weight: 950;
            line-height: 1;
        }

        .batch-row strong {
            display: block;
            color: #111827;
            font-size: 13px;
            font-weight: 950;
            line-height: 1.2;
        }

        .batch-row > span:not(.batch-code) {
            display: block;
            min-width: 0;
        }

        .batch-row > span:not(.batch-code) > span {
            display: block;
            margin-top: 3px;
            color: #64748b;
            font-size: 12px;
            font-weight: 800;
            line-height: 1.35;
        }

        .teacher-card-actions {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 10px;
            margin-top: auto;
        }

        .teacher-card-actions .faculty-button {
            min-height: 42px;
            padding: 11px 12px;
            font-size: 13px;
        }

        .empty-faculty {
            grid-column: 1 / -1;
            min-height: 260px;
            padding: 36px;
            border: 1px solid rgba(148, 163, 184, 0.28);
            border-radius: 8px;
            background: rgba(255, 255, 255, 0.9);
        }

        .empty-faculty h3 {
            margin: 0 0 10px;
            color: #111827;
            font-size: 28px;
            font-weight: 950;
        }

        .empty-faculty p {
            max-width: 560px;
            margin: 0;
            color: #64748b;
            font-size: 16px;
            font-weight: 700;
            line-height: 1.65;
        }

        .faculty-operating {
            display: grid;
            grid-template-columns: minmax(320px, 0.72fr) minmax(0, 1fr);
            min-height: 410px;
        }

        .operating-copy {
            display: grid;
            align-content: center;
            gap: 22px;
            padding: 44px;
            background: #0f766e;
            color: #fff;
        }

        .operating-copy .kicker {
            width: 100%;
            justify-content: start;
            background: rgba(255, 255, 255, 0.86);
            color: #0f766e;
        }

        .operating-copy h2 {
            margin: 0;
            color: #fff;
            font-size: 42px;
            font-weight: 950;
            line-height: 1.12;
        }

        .operating-copy p {
            margin: 0;
            color: rgba(255, 255, 255, 0.78);
            font-size: 16px;
            font-weight: 700;
            line-height: 1.75;
        }

        .operating-steps {
            display: grid;
            align-content: center;
            gap: 14px;
            padding: 44px;
        }

        .operating-step {
            display: grid;
            grid-template-columns: auto 1fr auto;
            gap: 16px;
            align-items: center;
            min-height: 78px;
            padding: 14px 16px;
            border: 1px solid rgba(148, 163, 184, 0.24);
            border-radius: 8px;
            background: rgba(255, 255, 255, 0.84);
        }

        .step-number {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 44px;
            height: 44px;
            border-radius: 8px;
            background: rgba(15, 118, 110, 0.08);
            color: #0f766e;
            font-size: 13px;
            font-weight: 950;
            line-height: 1;
        }

        .operating-step strong {
            display: block;
            color: #111827;
            font-size: 16px;
            font-weight: 950;
            line-height: 1.2;
        }

        .operating-step > span:not(.step-number):not(.step-tag) {
            display: block;
            min-width: 0;
        }

        .operating-step > span:not(.step-number):not(.step-tag) > span {
            display: block;
            margin-top: 3px;
            color: #64748b;
            font-size: 13px;
            font-weight: 800;
            line-height: 1.35;
        }

        .step-tag {
            justify-self: end;
            min-width: 82px;
            color: #64748b;
        }

        .faculty-cta {
            display: grid;
            grid-template-columns: 1fr auto;
            gap: 28px;
            align-items: center;
            min-height: 180px;
            padding: 34px 40px;
            border-radius: 10px;
            background: linear-gradient(135deg, #0f766e, #0f3f4b);
            color: #fff;
            box-shadow: 0 26px 70px rgba(15, 23, 42, 0.16);
        }

        .faculty-cta h2 {
            max-width: 720px;
            margin: 0;
            color: #fff;
            font-size: 34px;
            font-weight: 950;
            line-height: 1.14;
        }

        .faculty-cta p {
            max-width: 690px;
            margin: 8px 0 0;
            color: rgba(255, 255, 255, 0.76);
            font-size: 15px;
            font-weight: 700;
            line-height: 1.65;
        }

        .faculty-cta-actions {
            display: flex;
            gap: 10px;
            align-items: center;
        }

        .faculty-cta .faculty-button.primary {
            background: #fff;
            color: #0f766e;
            box-shadow: none;
        }

        .faculty-cta .faculty-button.secondary {
            border-color: rgba(255, 255, 255, 0.28);
            background: rgba(255, 255, 255, 0.1);
            color: #fff;
        }

        @keyframes facultyPanelLift {
            from {
                transform: translateY(18px) scale(0.98);
            }

            to {
                transform: translateY(0) scale(1);
            }
        }

        @keyframes facultyCardIn {
            from {
                transform: translateY(16px);
            }

            to {
                transform: translateY(0);
            }
        }

        @keyframes facultyMeter {
            from {
                width: 18%;
            }
        }

        @keyframes facultyMarquee {
            from {
                transform: translateX(0);
            }

            to {
                transform: translateX(-50%);
            }
        }

        @media (max-width: 1100px) {
            .faculty-hero-inner,
            .faculty-operating {
                grid-template-columns: 1fr;
            }

            .faculty-hero-inner {
                min-height: auto;
                padding: 44px 32px;
            }

            .faculty-board {
                justify-self: stretch;
                max-width: none;
            }

            .teacher-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }

        @media (max-width: 760px) {
            .faculty-wrap {
                gap: 44px;
                padding-top: 22px;
            }

            .faculty-hero,
            .faculty-operating {
                border-radius: 10px;
            }

            .faculty-hero-inner {
                gap: 32px;
                padding: 28px 20px;
            }

            .hero-copy {
                gap: 18px;
            }

            .hero-title {
                font-size: 42px;
            }

            .hero-copy > p,
            .section-heading p,
            .operating-copy p {
                font-size: 15px;
                line-height: 1.62;
            }

            .hero-actions,
            .faculty-cta-actions {
                display: grid;
                grid-template-columns: 1fr 1fr;
                width: 100%;
            }

            .faculty-button {
                width: 100%;
                min-height: 46px;
                padding-right: 12px;
                padding-left: 12px;
                text-align: center;
            }

            .hero-stats,
            .metric-row,
            .teacher-flow,
            .teacher-grid {
                grid-template-columns: 1fr;
            }

            .hero-stat {
                min-height: 86px;
            }

            .board-head,
            .teacher-card-head,
            .section-heading,
            .faculty-cta {
                align-items: stretch;
                flex-direction: column;
            }

            .board-head,
            .section-heading {
                display: grid;
            }

            .board-body,
            .teacher-feature,
            .teacher-card,
            .operating-copy,
            .operating-steps {
                padding: 18px;
            }

            .feature-profile,
            .teacher-name {
                grid-template-columns: 1fr;
            }

            .faculty-meter {
                grid-template-columns: 1fr;
                gap: 8px;
            }

            .flow-strip {
                grid-template-columns: 1fr;
            }

            .flow-strip strong {
                justify-content: start;
                min-height: 42px;
            }

            .section-heading h2,
            .operating-copy h2,
            .faculty-cta h2 {
                font-size: 31px;
            }

            .teacher-card {
                min-height: 0;
            }

            .teacher-card-actions,
            .operating-step,
            .faculty-cta {
                grid-template-columns: 1fr;
            }

            .step-tag {
                min-width: 0;
            }
        }

        @media (max-width: 420px) {
            .hero-title {
                font-size: 36px;
            }

            .hero-actions,
            .faculty-cta-actions {
                grid-template-columns: 1fr;
            }

            .feature-profile h3,
            .teacher-card h3 {
                font-size: 21px;
            }
        }

        @media (prefers-reduced-motion: reduce) {
            .faculty-board,
            .teacher-card,
            .meter-track i,
            .flow-marquee {
                animation: none;
            }

            .faculty-button,
            .teacher-card {
                transition: none;
            }
        }