.phcl-hospital-page {
        --phcl-primary: #2563eb;
        --phcl-primary-dark: #1d4ed8;
        --phcl-cyan: #06b6d4;
        --phcl-teal: #0f766e;
        --phcl-green: #16a34a;
        --phcl-red: #ef4444;
        --phcl-orange: #f59e0b;
        --phcl-dark: #07111f;
        --phcl-dark-2: #0d1b2d;
        --phcl-text: #172033;
        --phcl-muted: #66758a;
        --phcl-border: #e4eaf2;
        --phcl-light: #f5f8fc;
        --phcl-white: #ffffff;

        font-family: Inter, -apple-system, BlinkMacSystemFont,
                     "Segoe UI", Roboto, Arial, sans-serif;

        color: var(--phcl-text);
        overflow: hidden;
        background: #fff;
    }

    .phcl-hospital-page *,
    .phcl-hospital-page *::before,
    .phcl-hospital-page *::after {
        box-sizing: border-box;
    }

    .phcl-hospital-page a {
        text-decoration: none;
    }

    .phcl-hospital-container {
        width: min(1180px, calc(100% - 40px));
        margin: auto;
    }

    /* =========================================================
       HERO
    ========================================================= */

    .phcl-hospital-hero {
        position: relative;
        overflow: hidden;
        padding: 105px 0 95px;

        background:
            radial-gradient(
                circle at 90% 15%,
                rgba(37, 99, 235, .18),
                transparent 31%
            ),
            radial-gradient(
                circle at 10% 85%,
                rgba(6, 182, 212, .12),
                transparent 30%
            ),
            linear-gradient(
                135deg,
                #f7faff 0%,
                #eef5ff 100%
            );
    }

    .phcl-hospital-hero::before {
        content: "";
        position: absolute;
        inset: 0;

        background-image:
            linear-gradient(
                rgba(37, 99, 235, .045) 1px,
                transparent 1px
            ),
            linear-gradient(
                90deg,
                rgba(37, 99, 235, .045) 1px,
                transparent 1px
            );

        background-size: 45px 45px;

        mask-image:
            linear-gradient(
                to bottom,
                black,
                transparent
            );
    }

    .phcl-hospital-hero-grid {
        position: relative;

        display: grid;
        grid-template-columns: .92fr 1.08fr;

        align-items: center;
        gap: 65px;
    }

    .phcl-hospital-eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 9px;

        padding: 8px 14px;
        margin-bottom: 22px;

        border: 1px solid rgba(37, 99, 235, .16);
        border-radius: 50px;

        color: var(--phcl-primary);
        background: rgba(255,255,255,.72);

        font-size: 12px;
        font-weight: 800;

        letter-spacing: .06em;
        text-transform: uppercase;

        backdrop-filter: blur(10px);
    }

    .phcl-hospital-eyebrow-dot {
        width: 8px;
        height: 8px;

        border-radius: 50%;

        background: #22c55e;

        box-shadow:
            0 0 0 5px rgba(34,197,94,.11);
    }

    .phcl-hospital-hero h1 {
        max-width: 650px;

        margin: 0 0 22px;

        color: var(--phcl-dark);

        font-size: clamp(43px, 5vw, 69px);
        line-height: 1.02;

        letter-spacing: -.055em;
        font-weight: 850;
    }

    .phcl-hospital-gradient {
        background:
            linear-gradient(
                90deg,
                #2563eb,
                #06b6d4
            );

        -webkit-background-clip: text;
        background-clip: text;

        color: transparent;
    }

    .phcl-hospital-description {
        max-width: 610px;

        margin: 0 0 30px;

        color: #5c6c80;

        font-size: 18px;
        line-height: 1.75;
    }

    .phcl-hospital-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;

        margin-bottom: 30px;
    }

    .phcl-hospital-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 9px;

        min-height: 51px;

        padding: 0 21px;

        border-radius: 11px;

        font-size: 14px;
        font-weight: 750;

        transition: .25s ease;
    }

    .phcl-hospital-btn-primary {
        color: #fff;

        background:
            linear-gradient(
                135deg,
                var(--phcl-primary),
                #0ea5e9
            );

        box-shadow:
            0 15px 35px rgba(37,99,235,.23);
    }

    .phcl-hospital-btn-primary:hover {
        transform: translateY(-3px);

        box-shadow:
            0 20px 40px rgba(37,99,235,.30);
    }

    .phcl-hospital-btn-outline {
        color: #1e293b;

        border: 1px solid #d8e0eb;

        background: rgba(255,255,255,.82);
    }

    .phcl-hospital-btn-outline:hover {
        color: var(--phcl-primary);

        border-color: var(--phcl-primary);

        transform: translateY(-3px);
    }

    .phcl-hospital-trust {
        display: flex;
        align-items: center;
        gap: 11px;

        color: #7b8899;

        font-size: 12px;
    }

    .phcl-hospital-trust-icon {
        width: 30px;
        height: 30px;

        display: grid;
        place-items: center;

        border-radius: 9px;

        color: #2563eb;
        background: #eaf2ff;

        font-size: 14px;
    }


    /* =========================================================
       APPOINTMENT DASHBOARD
    ========================================================= */

    .phcl-hospital-dashboard-wrap {
        position: relative;

        perspective: 1200px;
    }

    .phcl-hospital-dashboard {
        position: relative;

        overflow: hidden;

        border: 1px solid rgba(255,255,255,.15);

        border-radius: 20px;

        background: #0b1626;

        box-shadow:
            0 40px 90px rgba(15,23,42,.24),
            0 15px 35px rgba(37,99,235,.10);

        transform:
            rotateY(-4deg)
            rotateX(2deg);

        transition: .5s ease;
    }

    .phcl-hospital-dashboard:hover {
        transform:
            rotateY(0)
            rotateX(0)
            translateY(-5px);
    }

    .phcl-dashboard-bar {
        height: 55px;

        display: flex;
        align-items: center;
        justify-content: space-between;

        padding: 0 17px;

        border-bottom: 1px solid rgba(255,255,255,.07);

        background: #101d30;
    }

    .phcl-dashboard-dots {
        display: flex;
        gap: 6px;
    }

    .phcl-dashboard-dots span {
        width: 8px;
        height: 8px;

        border-radius: 50%;

        background: #334155;
    }

    .phcl-dashboard-title {
        color: #e8eef9;

        font-size: 12px;
        font-weight: 750;
    }

    .phcl-dashboard-live {
        display: flex;
        align-items: center;
        gap: 6px;

        color: #4ade80;

        font-size: 9px;
        font-weight: 800;
    }

    .phcl-dashboard-live i {
        width: 6px;
        height: 6px;

        border-radius: 50%;

        background: #4ade80;

        box-shadow:
            0 0 0 4px rgba(74,222,128,.10);
    }

    .phcl-dashboard-content {
        padding: 18px;
    }

    .phcl-dashboard-heading {
        display: flex;
        align-items: center;
        justify-content: space-between;

        margin-bottom: 14px;
    }

    .phcl-dashboard-heading strong {
        color: #fff;
        font-size: 15px;
    }

    .phcl-dashboard-heading small {
        color: #64748b;
        font-size: 9px;
    }

    .phcl-dashboard-stat-grid {
        display: grid;
        grid-template-columns: repeat(4,1fr);
        gap: 8px;

        margin-bottom: 10px;
    }

    .phcl-dashboard-stat {
        padding: 12px;

        border:
            1px solid rgba(255,255,255,.055);

        border-radius: 10px;

        background: #111f33;
    }

    .phcl-dashboard-stat span {
        display: block;

        color: #718096;

        font-size: 8px;
        text-transform: uppercase;
    }

    .phcl-dashboard-stat strong {
        display: block;

        margin-top: 5px;

        color: #fff;

        font-size: 18px;
    }

    .phcl-dashboard-stat small {
        color: #4ade80;
        font-size: 8px;
    }

    /* Appointment table */

    .phcl-appointment-panel {
        overflow: hidden;

        border:
            1px solid rgba(255,255,255,.06);

        border-radius: 11px;

        background: #111f33;
    }

    .phcl-appointment-head {
        display: grid;

        grid-template-columns:
            1.25fr
            1fr
            .85fr
            .65fr;

        padding: 11px 13px;

        color: #64748b;

        border-bottom:
            1px solid rgba(255,255,255,.06);

        font-size: 8px;
        text-transform: uppercase;
    }

    .phcl-appointment-row {
        display: grid;

        grid-template-columns:
            1.25fr
            1fr
            .85fr
            .65fr;

        align-items: center;

        padding: 10px 13px;

        border-bottom:
            1px solid rgba(255,255,255,.045);

        color: #b7c2d3;

        font-size: 9px;
    }

    .phcl-appointment-row:last-child {
        border-bottom: 0;
    }

    .phcl-patient {
        display: flex;
        align-items: center;
        gap: 7px;
    }

    .phcl-patient-avatar {
        width: 25px;
        height: 25px;

        display: grid;
        place-items: center;

        border-radius: 8px;

        color: #dbeafe;
        background: #1e3a5f;

        font-size: 9px;
        font-weight: 800;
    }

    .phcl-appointment-status {
        display: inline-flex;

        width: fit-content;

        padding: 4px 7px;

        border-radius: 20px;

        font-size: 7px;
        font-weight: 800;
    }

    .phcl-status-confirmed {
        color: #4ade80;
        background: rgba(34,197,94,.10);
    }

    .phcl-status-pending {
        color: #fbbf24;
        background: rgba(245,158,11,.10);
    }

    .phcl-status-completed {
        color: #60a5fa;
        background: rgba(59,130,246,.10);
    }

    .phcl-dashboard-footer {
        display: flex;
        justify-content: space-between;

        margin-top: 10px;
        padding: 12px 14px;

        border-radius: 10px;

        color: #8fa0b5;

        background: #111f33;

        font-size: 9px;
    }

    .phcl-dashboard-footer strong {
        color: #fff;
    }


    /* Floating booking card */

    .phcl-booking-float {
        position: absolute;

        right: -35px;
        bottom: 35px;

        width: 205px;

        padding: 14px;

        border:
            1px solid #e4e9f1;

        border-radius: 14px;

        background: rgba(255,255,255,.96);

        box-shadow:
            0 25px 55px rgba(15,23,42,.15);

        animation:
            phclHospitalFloat 4s ease-in-out infinite;
    }

    .phcl-booking-float-top {
        display: flex;
        justify-content: space-between;

        margin-bottom: 11px;
    }

    .phcl-booking-float-top strong {
        color: #172033;
        font-size: 10px;
    }

    .phcl-booking-check {
        color: #16a34a;
        font-size: 12px;
    }

    .phcl-booking-doctor {
        display: flex;
        align-items: center;
        gap: 9px;
    }

    .phcl-doctor-avatar {
        width: 34px;
        height: 34px;

        display: grid;
        place-items: center;

        border-radius: 10px;

        color: #2563eb;
        background: #eaf2ff;

        font-size: 15px;
    }

    .phcl-booking-doctor strong {
        display: block;

        color: #263247;

        font-size: 9px;
    }

    .phcl-booking-doctor small {
        display: block;

        margin-top: 3px;

        color: #8b98aa;

        font-size: 8px;
    }

    @keyframes phclHospitalFloat {
        0%,100% {
            transform: translateY(0);
        }

        50% {
            transform: translateY(-8px);
        }
    }


    /* =========================================================
       STATS
    ========================================================= */

    .phcl-hospital-stats {
        padding: 30px 0;

        border-bottom:
            1px solid var(--phcl-border);

        background: #fff;
    }

    .phcl-hospital-stats-grid {
        display: grid;
        grid-template-columns: repeat(4,1fr);
    }

    .phcl-hospital-stat {
        padding: 5px 25px;

        text-align: center;

        border-right:
            1px solid var(--phcl-border);
    }

    .phcl-hospital-stat:last-child {
        border-right: 0;
    }

    .phcl-hospital-stat strong {
        display: block;

        color: var(--phcl-dark);

        font-size: 28px;
        letter-spacing: -.04em;
    }

    .phcl-hospital-stat span {
        color: var(--phcl-muted);

        font-size: 12px;
    }


    /* =========================================================
       SECTION
    ========================================================= */

    .phcl-hospital-section {
        padding: 100px 0;
    }

    .phcl-hospital-section-light {
        background: var(--phcl-light);
    }

    .phcl-hospital-section-heading {
        max-width: 760px;

        margin: 0 auto 55px;

        text-align: center;
    }

    .phcl-hospital-section-heading h2 {
        margin: 0 0 16px;

        color: var(--phcl-dark);

        font-size: clamp(34px,4vw,51px);
        line-height: 1.08;

        letter-spacing: -.045em;
    }

    .phcl-hospital-section-heading p {
        margin: 0;

        color: var(--phcl-muted);

        font-size: 16px;
        line-height: 1.75;
    }


    /* =========================================================
       FEATURE CARDS
    ========================================================= */

    .phcl-hospital-features {
        display: grid;

        grid-template-columns:
            repeat(3,1fr);

        gap: 18px;
    }

    .phcl-hospital-feature {
        position: relative;

        overflow: hidden;

        padding: 29px;

        border:
            1px solid var(--phcl-border);

        border-radius: 18px;

        background: #fff;

        transition: .3s ease;
    }

    .phcl-hospital-feature:hover {
        transform: translateY(-6px);

        border-color:
            rgba(37,99,235,.22);

        box-shadow:
            0 20px 45px rgba(15,23,42,.08);
    }

    .phcl-feature-icon {
        width: 51px;
        height: 51px;

        display: grid;
        place-items: center;

        margin-bottom: 20px;

        border-radius: 14px;

        color: var(--phcl-primary);

        background: #eaf2ff;

        font-size: 20px;
    }

    .phcl-hospital-feature h3 {
        margin: 0 0 10px;

        color: var(--phcl-dark);

        font-size: 18px;
    }

    .phcl-hospital-feature p {
        margin: 0;

        color: var(--phcl-muted);

        font-size: 14px;
        line-height: 1.7;
    }


    /* =========================================================
       APPOINTMENT BOOKING SECTION
    ========================================================= */

    .phcl-booking-layout {
        display: grid;

        grid-template-columns:
            .8fr 1.2fr;

        align-items: center;

        gap: 75px;
    }

    .phcl-booking-copy h2 {
        margin: 0 0 17px;

        color: var(--phcl-dark);

        font-size: clamp(34px,4vw,49px);
        line-height: 1.08;

        letter-spacing: -.045em;
    }

    .phcl-booking-copy > p {
        margin: 0 0 27px;

        color: var(--phcl-muted);

        font-size: 16px;
        line-height: 1.8;
    }

    .phcl-booking-list {
        display: grid;

        gap: 14px;

        padding: 0;
        margin: 0;

        list-style: none;
    }

    .phcl-booking-list li {
        display: flex;
        align-items: flex-start;
        gap: 11px;

        color: #475569;

        font-size: 14px;
    }

    .phcl-booking-list li::before {
        content: "✓";

        flex: 0 0 22px;

        width: 22px;
        height: 22px;

        display: grid;
        place-items: center;

        border-radius: 50%;

        color: #15803d;
        background: #eaf8ee;

        font-size: 10px;
        font-weight: 800;
    }


    /* Booking UI */

    .phcl-booking-ui {
        padding: 22px;

        border:
            1px solid #dce5f1;

        border-radius: 22px;

        background: #fff;

        box-shadow:
            0 25px 60px rgba(15,23,42,.09);
    }

    .phcl-booking-ui-header {
        display: flex;
        align-items: center;
        justify-content: space-between;

        margin-bottom: 20px;
    }

    .phcl-booking-ui-header strong {
        color: #182338;

        font-size: 15px;
    }

    .phcl-booking-ui-header span {
        color: #64748b;

        font-size: 10px;
    }

    .phcl-booking-hospital {
        display: flex;
        align-items: center;
        gap: 11px;

        padding: 13px;

        border:
            1px solid #e4eaf2;

        border-radius: 13px;

        background: #f8fafc;
    }

    .phcl-hospital-logo {
        width: 42px;
        height: 42px;

        display: grid;
        place-items: center;

        border-radius: 11px;

        color: #fff;

        background:
            linear-gradient(
                135deg,
                #2563eb,
                #06b6d4
            );

        font-size: 17px;
        font-weight: 800;
    }

    .phcl-booking-hospital strong {
        display: block;

        color: #263247;

        font-size: 12px;
    }

    .phcl-booking-hospital small {
        display: block;

        margin-top: 3px;

        color: #8a97a8;

        font-size: 9px;
    }

    .phcl-booking-fields {
        display: grid;

        grid-template-columns:
            repeat(2,1fr);

        gap: 10px;

        margin-top: 12px;
    }

    .phcl-booking-field {
        padding: 12px;

        border:
            1px solid #e3e8ef;

        border-radius: 11px;

        background: #fff;
    }

    .phcl-booking-field label {
        display: block;

        margin-bottom: 6px;

        color: #8a97a8;

        font-size: 8px;

        text-transform: uppercase;
        letter-spacing: .05em;
    }

    .phcl-booking-field strong {
        color: #263247;

        font-size: 11px;
    }

    .phcl-slot-title {
        margin: 17px 0 9px;

        color: #263247;

        font-size: 11px;
        font-weight: 750;
    }

    .phcl-slots {
        display: flex;
        flex-wrap: wrap;

        gap: 7px;
    }

    .phcl-slot {
        padding: 8px 10px;

        border:
            1px solid #dfe6ef;

        border-radius: 8px;

        color: #526176;

        background: #fff;

        font-size: 9px;
    }

    .phcl-slot-active {
        color: #fff;

        border-color: var(--phcl-primary);

        background: var(--phcl-primary);
    }

    .phcl-book-now {
        width: 100%;

        margin-top: 16px;

        padding: 13px;

        border: 0;

        border-radius: 10px;

        color: #fff;

        background:
            linear-gradient(
                135deg,
                #2563eb,
                #0ea5e9
            );

        font-size: 12px;
        font-weight: 750;

        cursor: pointer;
    }


    /* =========================================================
       MULTI-HOSPITAL NETWORK
    ========================================================= */

    .phcl-network {
        display: grid;

        grid-template-columns:
            .9fr 1.1fr;

        gap: 70px;

        align-items: center;
    }

    .phcl-network-copy h2 {
        margin: 0 0 17px;

        color: #fff;

        font-size: clamp(34px,4vw,49px);

        line-height: 1.08;

        letter-spacing: -.045em;
    }

    .phcl-network-copy p {
        margin: 0 0 28px;

        color: #91a1b7;

        font-size: 16px;
        line-height: 1.8;
    }

    .phcl-network-list {
        display: grid;

        gap: 12px;

        padding: 0;

        list-style: none;
    }

    .phcl-network-list li {
        display: flex;

        gap: 10px;

        color: #b9c5d5;

        font-size: 13px;
    }

    .phcl-network-list li::before {
        content: "✓";

        color: #4ade80;

        font-weight: 800;
    }

    .phcl-network-section {
        background: #07111f;
    }

    .phcl-network-visual {
        position: relative;

        min-height: 440px;

        display: flex;

        align-items: center;
        justify-content: center;

        padding: 20px;
    }

    .phcl-network-center {
        position: relative;
        z-index: 3;

        width: 150px;
        height: 150px;

        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        border:
            1px solid rgba(255,255,255,.13);

        border-radius: 50%;

        color: #fff;

        background:
            radial-gradient(
                circle,
                #193b68,
                #0c1d32
            );

        box-shadow:
            0 0 70px rgba(37,99,235,.25);
    }

    .phcl-network-center-icon {
        font-size: 31px;

        margin-bottom: 6px;
    }

    .phcl-network-center strong {
        font-size: 13px;
    }

    .phcl-network-center small {
        margin-top: 5px;

        color: #8090a5;

        font-size: 8px;
    }

    .phcl-network-node {
        position: absolute;

        z-index: 4;

        width: 105px;
        height: 105px;

        display: flex;
        flex-direction: column;

        align-items: center;
        justify-content: center;

        border:
            1px solid rgba(255,255,255,.09);

        border-radius: 18px;

        color: #fff;

        background: #101f33;

        box-shadow:
            0 15px 35px rgba(0,0,0,.25);
    }

    .phcl-network-node-icon {
        margin-bottom: 7px;

        color: #60a5fa;

        font-size: 20px;
    }

    .phcl-network-node strong {
        font-size: 9px;
    }

    .phcl-network-node small {
        margin-top: 4px;

        color: #72839a;

        font-size: 7px;
    }

    .phcl-node-1 {
        top: 20px;
        left: 8%;
    }

    .phcl-node-2 {
        top: 15px;
        right: 8%;
    }

    .phcl-node-3 {
        bottom: 15px;
        left: 8%;
    }

    .phcl-node-4 {
        bottom: 15px;
        right: 8%;
    }

    .phcl-network-line {
        position: absolute;

        z-index: 1;

        width: 45%;

        height: 1px;

        background:
            linear-gradient(
                90deg,
                transparent,
                rgba(59,130,246,.55),
                transparent
            );

        transform-origin: center;
    }

    .phcl-line-1 {
        transform: rotate(27deg);
    }

    .phcl-line-2 {
        transform: rotate(-27deg);
    }

    .phcl-line-3 {
        transform: rotate(-27deg);
    }

    .phcl-line-4 {
        transform: rotate(27deg);
    }


    /* =========================================================
       GOVERNMENT + AI
    ========================================================= */

    .phcl-government-layout {
        display: grid;

        grid-template-columns:
            1fr 1fr;

        gap: 20px;
    }

    .phcl-government-card {
        position: relative;

        overflow: hidden;

        padding: 34px;

        border:
            1px solid var(--phcl-border);

        border-radius: 21px;

        background: #fff;
    }

    .phcl-government-card-dark {
        color: #fff;

        border-color:
            rgba(255,255,255,.08);

        background:
            linear-gradient(
                145deg,
                #0b1b2e,
                #07111f
            );
    }

    .phcl-government-icon {
        width: 50px;
        height: 50px;

        display: grid;
        place-items: center;

        margin-bottom: 21px;

        border-radius: 14px;

        color: #2563eb;
        background: #eaf2ff;

        font-size: 21px;
    }

    .phcl-government-card-dark
    .phcl-government-icon {
        color: #67e8f9;

        background:
            rgba(6,182,212,.10);
    }

    .phcl-government-card h3 {
        margin: 0 0 12px;

        color: var(--phcl-dark);

        font-size: 21px;
    }

    .phcl-government-card-dark h3 {
        color: #fff;
    }

    .phcl-government-card p {
        margin: 0;

        color: var(--phcl-muted);

        font-size: 14px;
        line-height: 1.75;
    }

    .phcl-government-card-dark p {
        color: #8ea0b7;
    }

    .phcl-server-flow {
        display: flex;

        align-items: center;

        gap: 8px;

        margin-top: 25px;
    }

    .phcl-server-step {
        flex: 1;

        padding: 11px 8px;

        border:
            1px solid rgba(255,255,255,.08);

        border-radius: 10px;

        text-align: center;

        background: rgba(255,255,255,.035);
    }

    .phcl-server-step strong {
        display: block;

        color: #fff;

        font-size: 9px;
    }

    .phcl-server-step small {
        display: block;

        margin-top: 4px;

        color: #71839a;

        font-size: 7px;
    }

    .phcl-server-arrow {
        color: #38bdf8;

        font-weight: 800;
    }

    /* AI */

    .phcl-ai-report {
        margin-top: 22px;

        padding: 16px;

        border:
            1px solid #dfe6ef;

        border-radius: 14px;

        background: #f8fafc;
    }

    .phcl-ai-report-top {
        display: flex;

        align-items: center;
        justify-content: space-between;

        margin-bottom: 13px;
    }

    .phcl-ai-report-top strong {
        color: #263247;

        font-size: 11px;
    }

    .phcl-ai-badge {
        padding: 5px 8px;

        border-radius: 20px;

        color: #2563eb;

        background: #eaf2ff;

        font-size: 7px;
        font-weight: 800;
    }

    .phcl-health-score {
        display: flex;

        align-items: center;

        gap: 13px;
    }

    .phcl-score-circle {
        width: 55px;
        height: 55px;

        display: grid;
        place-items: center;

        border:
            5px solid #22c55e;

        border-left-color: #d9f4df;

        border-radius: 50%;

        color: #15803d;

        font-size: 12px;
        font-weight: 800;
    }

    .phcl-health-score strong {
        display: block;

        color: #263247;

        font-size: 10px;
    }

    .phcl-health-score small {
        display: block;

        margin-top: 4px;

        color: #8a97a8;

        font-size: 8px;
    }


    /* =========================================================
       PATIENT JOURNEY
    ========================================================= */

    .phcl-journey {
        display: grid;

        grid-template-columns:
            repeat(5,1fr);

        gap: 12px;
    }

    .phcl-journey-step {
        position: relative;

        padding: 25px 18px;

        text-align: center;

        border:
            1px solid var(--phcl-border);

        border-radius: 16px;

        background: #fff;
    }

    .phcl-journey-number {
        width: 35px;
        height: 35px;

        display: grid;
        place-items: center;

        margin: 0 auto 14px;

        border-radius: 10px;

        color: #fff;

        background:
            linear-gradient(
                135deg,
                #2563eb,
                #06b6d4
            );

        font-size: 11px;
        font-weight: 800;
    }

    .phcl-journey-step h3 {
        margin: 0 0 7px;

        color: #263247;

        font-size: 14px;
    }

    .phcl-journey-step p {
        margin: 0;

        color: #8290a2;

        font-size: 10px;
        line-height: 1.6;
    }


    /* =========================================================
       CTA
    ========================================================= */

    .phcl-hospital-cta {
        padding: 95px 0;

        background:
            radial-gradient(
                circle at 10% 20%,
                rgba(6,182,212,.22),
                transparent 28%
            ),
            radial-gradient(
                circle at 90% 80%,
                rgba(37,99,235,.30),
                transparent 30%
            ),
            #07111f;
    }

    .phcl-hospital-cta-box {
        position: relative;

        overflow: hidden;

        padding: 65px;

        text-align: center;

        border:
            1px solid rgba(255,255,255,.10);

        border-radius: 25px;

        background:
            rgba(255,255,255,.035);
    }

    .phcl-hospital-cta-box h2 {
        max-width: 820px;

        margin: 0 auto 17px;

        color: #fff;

        font-size: clamp(34px,4vw,53px);

        line-height: 1.08;

        letter-spacing: -.045em;
    }

    .phcl-hospital-cta-box p {
        max-width: 680px;

        margin: 0 auto 30px;

        color: #8fa0b8;

        font-size: 16px;
        line-height: 1.75;
    }


    /* =========================================================
       RESPONSIVE
    ========================================================= */

    @media(max-width:1000px) {

        .phcl-hospital-hero-grid,
        .phcl-booking-layout,
        .phcl-network {
            grid-template-columns: 1fr;
        }

        .phcl-hospital-dashboard-wrap {
            max-width: 700px;
            width: 100%;

            margin: 15px auto 0;
        }

        .phcl-hospital-features {
            grid-template-columns: repeat(2,1fr);
        }

        .phcl-government-layout {
            grid-template-columns: 1fr;
        }

        .phcl-journey {
            grid-template-columns: repeat(3,1fr);
        }
    }

    @media(max-width:700px) {

        .phcl-hospital-container {
            width: min(100% - 28px,1180px);
        }

        .phcl-hospital-hero {
            padding: 70px 0;
        }

        .phcl-hospital-hero h1 {
            font-size: 43px;
        }

        .phcl-hospital-description {
            font-size: 16px;
        }

        .phcl-hospital-dashboard {
            transform: none;
        }

        .phcl-booking-float {
            right: 7px;
            bottom: 15px;
        }

        .phcl-hospital-stats-grid {
            grid-template-columns: repeat(2,1fr);
            gap: 20px 0;
        }

        .phcl-hospital-stat:nth-child(2) {
            border-right: 0;
        }

        .phcl-hospital-features {
            grid-template-columns: 1fr;
        }

        .phcl-hospital-section {
            padding: 70px 0;
        }

        .phcl-dashboard-stat-grid {
            grid-template-columns: repeat(2,1fr);
        }

        .phcl-appointment-head,
        .phcl-appointment-row {
            grid-template-columns:
                1.2fr
                .9fr
                .7fr;
        }

        .phcl-appointment-head div:nth-child(3),
        .phcl-appointment-row > div:nth-child(3) {
            display: none;
        }

        .phcl-network-visual {
            min-height: 390px;
        }

        .phcl-government-layout {
            gap: 14px;
        }

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

        .phcl-hospital-cta-box {
            padding: 45px 22px;
        }
    }

    @media(max-width:480px) {

        .phcl-hospital-actions {
            flex-direction: column;
        }

        .phcl-hospital-btn {
            width: 100%;
        }

        .phcl-dashboard-content {
            padding: 10px;
        }

        .phcl-booking-fields {
            grid-template-columns: 1fr;
        }

        .phcl-server-flow {
            flex-wrap: wrap;
        }

        .phcl-server-step {
            min-width: calc(50% - 15px);
        }

        .phcl-journey {
            grid-template-columns: 1fr;
        }

        .phcl-network-node {
            width: 88px;
            height: 88px;
        }

        .phcl-network-center {
            width: 125px;
            height: 125px;
        }
    }