.project-dashboard {
    --project-bg: #fbf7ef;
    --project-bg-soft: #fffdf8;
    --project-card: #fffdf7;
    --project-card-strong: #ffffff;
    --project-line: rgba(119, 101, 82, 0.11);
    --project-line-strong: rgba(119, 101, 82, 0.18);
    --project-text: #2a3442;
    --project-title: #182536;
    --project-muted: #74808d;
    --project-accent: #2f8a7e;
    --project-accent-soft: #e1f2ee;
    --project-gold: #caa56a;
    --project-coral: #be7963;
    --project-slate: #70859c;
    --project-shadow: 0 18px 44px rgba(63, 51, 39, 0.08);
    background: #ffff;
    color: var(--project-text);
    padding: 90px 0;
    position: relative;
    overflow: hidden;
}

.project-dashboard::before,
.project-dashboard::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.project-dashboard::before {
    width: 420px;
    height: 420px;
    left: -140px;
    top: 110px;
    background: radial-gradient(circle, rgba(45, 143, 133, 0.12) 0%, rgba(45, 143, 133, 0) 68%);
}

.project-dashboard::after {
    width: 360px;
    height: 360px;
    right: -90px;
    bottom: 70px;
    background: radial-gradient(circle, rgba(196, 107, 82, 0.10) 0%, rgba(196, 107, 82, 0) 70%);
}

.project-dashboard,
.project-dashboard * {
    box-sizing: border-box;
}

.project-dashboard .dashboard-shell {
    max-width: 100%;
    margin: 0 auto;
    padding: 0 50px;
    position: relative;
    z-index: 1;
}

.project-dashboard .hero,
.project-dashboard .charts,
.project-dashboard .map-section,
.project-dashboard .info-section,
.project-dashboard .other-section {
    margin-bottom: 24px;
}

.project-dashboard .hero {
    display: grid;
    grid-template-columns: 1.35fr 0.85fr;
    gap: 24px;
}

.project-dashboard .hero-main,
.project-dashboard .card,
.project-dashboard .chart-card,
.project-dashboard .map-card,
.project-dashboard .info-card,
.project-dashboard .other-section {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(255, 252, 246, 0.96));
    border: 1px solid var(--project-line);
    border-radius: 28px;
    box-shadow: var(--project-shadow);
}

.project-dashboard .hero-main {
    padding: 38px;
    position: relative;
    overflow: hidden;
}

.project-dashboard .hero-main::after {
    content: "";
    position: absolute;
    width: 290px;
    height: 290px;
    right: -100px;
    top: -110px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(47, 138, 126, 0.15) 0%, rgba(47, 138, 126, 0) 72%);
}

.project-dashboard .eyebrow {
    color: var(--project-accent);
    font-weight: 700;
    letter-spacing: 0.16em;
    font-size: 12px;
    text-transform: uppercase;
    position: relative;
    z-index: 1;
}

.project-dashboard h1,
.project-dashboard h2,
.project-dashboard h3,
.project-dashboard h4,
.project-dashboard p,
.project-dashboard small,
.project-dashboard span,
.project-dashboard b {
    color: inherit;
}

.project-dashboard .hero-title {
    color: var(--project-title);
    font-size: 46px;
    line-height: 1.05;
    margin: 14px 0 14px;
    position: relative;
    z-index: 1;
}

.project-dashboard .subtitle {
    color: #000;
    font-size: 16px;
    max-width: 720px;
    line-height: 1.7;
    position: relative;
    z-index: 1;
    margin: 0;
}

.project-dashboard .hero-highlights {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 26px;
    position: relative;
    z-index: 1;
}

.project-dashboard .hero-chip {
    padding: 10px 14px;
    border-radius: 999px;
    background: rgba(45, 143, 133, 0.08);
    border: 1px solid rgba(45, 143, 133, 0.12);
    color: var(--project-title);
    font-size: 13px;
    font-weight: 600;
}

.project-dashboard .hero-side {
    padding: 28px;
}

.project-dashboard .hero-side::after {
    background: radial-gradient(circle, rgba(213, 163, 91, 0.22) 0%, rgba(213, 163, 91, 0) 72%);
}

.project-dashboard .score-wrap {
    display: grid;
    gap: 18px;
}

.project-dashboard .score-label {
    text-align: center;
}

.project-dashboard .score-label small {
    display: block;
    color: #000;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-weight: 700;
    margin-bottom: 8px;
}

.project-dashboard .score-label h3 {
    margin: 0;
    color: var(--project-title);
    font-size: 24px;
}

/* Spinning orbit rings wrapper */
.project-dashboard .score-ring-wrap {
    position: relative;
    width: 250px;
    height: 250px;
    display: grid;
    place-items: center;
    margin: auto;
}

.project-dashboard .ring-orbit {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.project-dashboard .ring-o1 {
    width: 240px;
    height: 240px;
    border: 2.5px dashed rgba(47, 138, 126, 0.30);
    animation: orbitSpin1 12s linear infinite;
}

.project-dashboard .ring-o2 {
    width: 228px;
    height: 228px;
    border: 1.5px solid rgba(202, 165, 106, 0.25);
    animation: orbitSpin2 8s linear infinite;
}

.project-dashboard .ring-o3 {
    width: 252px;
    height: 252px;
    border: 1px solid rgba(47, 138, 126, 0.12);
    animation: orbitSpin1 20s linear infinite reverse;
}

@keyframes orbitSpin1 {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes orbitSpin2 {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(-360deg);
    }
}

.project-dashboard .score {
    --dp: 0%;
    height: 210px;
    width: 210px;
    border-radius: 50%;
    background: conic-gradient(var(--project-accent) 0 var(--dp), var(--project-gold) var(--dp) 100%);
    display: grid;
    place-items: center;
    position: relative;
    z-index: 2;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7), 0 18px 36px rgba(45, 143, 133, 0.15);
    animation: scoreFillSpin 10s linear infinite;
}

@keyframes scoreFillSpin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes scoreCounterSpin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(-360deg);
    }
}

.project-dashboard .score-inner {
    height: 146px;
    width: 146px;
    border-radius: 50%;
    background: linear-gradient(180deg, #ffffff, #f6efe5);
    display: grid;
    place-items: center;
    text-align: center;
    border: 1px solid rgba(105, 88, 71, 0.12);
    animation: scoreCounterSpin 10s linear infinite;
}

.project-dashboard .score-inner b {
    display: inline-block;
    color: var(--project-title);
    font-size: 38px;
    line-height: 1;
}

.project-dashboard .score-inner span {
    font-size: 13px;
    color: #000;
    font-weight: 700;
}

.project-dashboard .score-inner small {
    font-size: 12px;
    color: var(--project-accent);
    font-weight: 700;
}

.project-dashboard .score-note {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

.project-dashboard .score-note-item {
    background: rgba(248, 244, 236, 0.92);
    border: 1px solid var(--project-line);
    border-radius: 18px;
    padding: 14px;
    text-align: center;
}

.project-dashboard .score-note-item strong {
    display: block;
    color: var(--project-title);
    font-size: 22px;
}

.project-dashboard .score-note-item span {
    color: #000;
    font-size: 16px;
}

.project-dashboard .kpis,
.project-dashboard .matrix,
.project-dashboard .other-grid {
    display: grid;
    gap: 18px;
}

.project-dashboard .kpis {
    grid-template-columns: repeat(4, 1fr);
}

.project-dashboard .card,
.project-dashboard .chart-card,
.project-dashboard .map-card,
.project-dashboard .info-card,
.project-dashboard .other-section {
    padding: 26px;
}

.project-dashboard .card {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 16px;
    min-height: 158px;
}

.project-dashboard .card::before,
.project-dashboard .chart-card::before,
.project-dashboard .info-card::before,
.project-dashboard .map-card::before,
.project-dashboard .other-section::before {
    content: "";
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, var(--project-accent) 0%, var(--project-gold) 50%, var(--project-accent) 100%);
    background-size: 200% 100%;
    animation: topBorderSlide 3s linear infinite;
}

.project-dashboard .chart-card,
.project-dashboard .info-card,
.project-dashboard .map-card,
.project-dashboard .other-section {
    position: relative;
    overflow: hidden;
}

@keyframes topBorderSlide {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

.project-dashboard .card small,
.project-dashboard .legend,
.project-dashboard .value,
.project-dashboard .pin-card span,
.project-dashboard .team-text,
.project-dashboard .size-row span,
.project-dashboard .other-box p,
.project-dashboard .tile p,
.project-dashboard .section-copy,
.project-dashboard .insight-list li {
    color: #000;
}

.project-dashboard .kpi-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-width: 0;
}

.project-dashboard .card small {
    display: block;
    margin: 0;
    line-height: 1.35;
    font-size: 11px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    font-weight: 600;
    flex: 1 1 auto;
}

.project-dashboard .card h2 {
    display: block;
    color: var(--project-title);
    font-size: 34px;
    margin: 0;
    line-height: 1.05;
    text-align: right;
    flex-shrink: 0;
}

.project-dashboard .pill,
.project-dashboard .tag {
    display: inline-block;
    padding: 7px 12px;
    border-radius: 999px;
    font-size: 12px;
    background: rgba(47, 138, 126, 0.09);
    color: var(--project-accent);
    border: 1px solid rgba(47, 138, 126, 0.16);
    font-weight: 700;
}

.project-dashboard .card .pill {
    align-self: flex-start;
    margin-top: auto;
}

.project-dashboard .kpis {
    align-items: stretch;
}

.project-dashboard .kpis .card {
    background: #fff;
    border: 1px solid rgba(47, 138, 126, 0.14);
    border-radius: 22px;
    min-height: 170px;
    padding: 22px 22px 18px;
    transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}

.project-dashboard .kpis .card::after {
    content: "";
    position: absolute;
    right: -42px;
    bottom: -42px;
    width: 124px;
    height: 124px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(202, 165, 106, 0.14) 0%, rgba(202, 165, 106, 0) 72%);
    pointer-events: none;
}

.project-dashboard .kpis .card:hover {
    transform: translateY(-5px);
    border-color: rgba(47, 138, 126, 0.22);
    box-shadow: 0 24px 40px rgba(35, 67, 62, 0.14) !important;
}

.project-dashboard .kpis .kpi-head {
    align-items: center;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(47, 138, 126, 0.10);
}

.project-dashboard .kpis .card small {
    color: #62707d;
    font-size: 12px;
    letter-spacing: 0.08em;
    line-height: 1.45;
    max-width: 68%;
}

.project-dashboard .kpis .card h2 {
    min-width: 72px;
    padding: 10px 14px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--project-accent), #58a99f);
    box-shadow: 0 12px 20px rgba(47, 138, 126, 0.20);
    color: #ffffff;
    font-size: 28px;
    font-weight: 800;
    text-align: center;
}

.project-dashboard .kpis .card .pill {
    margin-top: 0;
    padding: 8px 12px;
    background: rgba(47, 138, 126, 0.08);
    border-color: rgba(47, 138, 126, 0.14);
    color: #2b7f74;
}

.project-dashboard .charts {
    display: grid;
    grid-template-columns: 1.08fr 0.92fr;
    gap: 24px;
}

.project-dashboard .chart-title {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
}

.project-dashboard .chart-title h3,
.project-dashboard .info-card h3,
.project-dashboard .other-section h3 {
    margin: 0;
    color: var(--project-title);
    font-size: 22px;
}

.project-dashboard .section-copy {
    margin-top: 6px;
    font-size: 14px;
    line-height: 1.6;
}

.project-dashboard .legend {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    font-size: 13px;
    justify-content: flex-end;
}

.project-dashboard .dot {
    height: 10px;
    width: 10px;
    border-radius: 50%;
    display: inline-block;
    margin-right: 6px;
}

.project-dashboard .bars,
.project-dashboard .split-list,
.project-dashboard .size-list,
.project-dashboard .insight-list {
    display: grid;
    gap: 18px;
}

.project-dashboard .bar-row,
.project-dashboard .size-row {
    display: grid;
    align-items: center;
    gap: 12px;
}

.project-dashboard .bar-row {
    grid-template-columns: 130px 1fr 58px;
}

.project-dashboard .bar-label {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--project-title);
    letter-spacing: 0.01em;
}

.project-dashboard .bar-label,
.project-dashboard .other-box b,
.project-dashboard .size-row b,
.project-dashboard .tile h4 {
    color: var(--project-title);
}

.project-dashboard .track {
    height: 20px;
    background: linear-gradient(180deg, rgba(236, 229, 216, 0.8), rgba(252, 247, 240, 0.96));
    border-radius: 999px;
    overflow: hidden;
    position: relative;
    box-shadow: inset 0 2px 5px rgba(73, 57, 42, 0.09);
}

.project-dashboard .fill {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #2f8a7e 0%, #4ba996 45%, #caa56a 100%);
    box-shadow: 0 4px 14px rgba(47, 138, 126, 0.24);
    width: 0;
    /* JS-driven — starts at 0 */
    position: relative;
    overflow: hidden;
}

/* shimmer sweep on top of the fill */
.project-dashboard .fill::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
            transparent 0%,
            rgba(255, 255, 255, 0.35) 40%,
            rgba(255, 255, 255, 0.55) 50%,
            rgba(255, 255, 255, 0.35) 60%,
            transparent 100%);
    background-size: 200% 100%;
    animation: barShimmer 2.4s ease-in-out infinite;
}

@keyframes barShimmer {
    0% {
        background-position: -200% 0;
    }

    100% {
        background-position: 200% 0;
    }
}

.project-dashboard .value {
    text-align: center;
    font-weight: 800;
    font-size: 12.5px;
    color: #fffdf8;
    background: linear-gradient(135deg, #2f8a7e, #caa56a);
    border-radius: 999px;
    padding: 3px 7px;
    min-width: 50px;
    letter-spacing: 0.02em;
    box-shadow: 0 3px 10px rgba(47, 138, 126, 0.2);
    transition: background 0.3s;
}

.project-dashboard .donut-wrap {
    display: grid;
    grid-template-columns: 220px 1fr;
    align-items: center;
    gap: 24px;
}

.project-dashboard .donut {
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: conic-gradient(var(--project-accent) 0 68%, var(--project-gold) 68% 100%);
    display: grid;
    place-items: center;
    margin: 0 auto;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7), 0 18px 30px rgba(213, 163, 91, 0.18);
}

.project-dashboard .donut::after {
    content: "120+\A Projects";
    white-space: pre;
    display: grid;
    place-items: center;
    text-align: center;
    width: 138px;
    height: 138px;
    border-radius: 50%;
    background: linear-gradient(180deg, #ffffff, #f4ede4);
    border: 1px solid var(--project-line-strong);
    font-weight: 800;
    color: var(--project-title);
    font-size: 24px;
}

.project-dashboard .split-item,
.project-dashboard .other-box,
.project-dashboard .size-row,
.project-dashboard .insight-list li {
    background: rgba(255, 251, 243, 0.94);
    border: 1px solid var(--project-line);
    border-radius: 16px;
    padding: 14px 16px;
}

.project-dashboard .split-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.project-dashboard .split-item b {
    color: var(--project-title);
}

.project-dashboard .matrix {
    grid-template-columns: repeat(3, 1fr);
}

.project-dashboard .tile {
    background: linear-gradient(180deg, #fffefb, #f7f0e6);
    border: 1px solid var(--project-line);
    border-radius: 24px;
    padding: 22px;
    min-height: 190px;
}

.project-dashboard .tile h4 {
    margin: 0 0 10px;
    font-size: 18px;
}

.project-dashboard .tile p {
    margin: 0;
    line-height: 1.6;
    font-size: 14px;
}

.project-dashboard .mini-chart {
    display: flex;
    align-items: end;
    height: 74px;
    gap: 9px;
    margin-top: 18px;
}

.project-dashboard .col {
    flex: 1;
    border-radius: 12px 12px 0 0;
    background: linear-gradient(180deg, var(--project-coral), var(--project-accent));
    opacity: 0.95;
    height: 0;
    /* starts at 0 – JS sets data-h */
    transition: height 1.2s cubic-bezier(0.22, 1, 0.36, 1);
    align-self: flex-end;
    transform-origin: bottom center;
    animation: miniWave 3.2s ease-in-out infinite;
    will-change: transform;
}

.project-dashboard .mini-chart .col:nth-child(2) {
    animation-delay: 0.35s;
}

.project-dashboard .mini-chart .col:nth-child(3) {
    animation-delay: 0.7s;
}

.project-dashboard .map-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.7fr);
    gap: 22px;
    align-items: stretch;
}

.project-dashboard .map-wrap {
    position: relative;
    min-height: 560px;
    overflow: hidden;
    border-radius: 28px;
    border: 1px solid var(--project-line);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.90), rgba(249, 244, 236, 0.98)),
        radial-gradient(circle at 24% 24%, rgba(45, 143, 133, 0.08), transparent 24%),
        radial-gradient(circle at 78% 72%, rgba(213, 163, 91, 0.12), transparent 24%),
        repeating-linear-gradient(90deg, rgba(45, 143, 133, 0.04) 0 1px, transparent 1px 70px),
        repeating-linear-gradient(0deg, rgba(45, 143, 133, 0.04) 0 1px, transparent 1px 70px);
}

.project-dashboard .map-focus-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 3;
    padding: 10px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(45, 143, 133, 0.14);
    color: var(--project-accent);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    box-shadow: 0 14px 26px rgba(53, 43, 32, 0.08);
}

.project-dashboard .map-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(10px);
    opacity: 0.7;
    pointer-events: none;
}

.project-dashboard .map-glow-one {
    width: 220px;
    height: 220px;
    left: 28%;
    top: 28%;
    background: radial-gradient(circle, rgba(45, 143, 133, 0.20), rgba(45, 143, 133, 0));
    animation: glowPulse 7s ease-in-out infinite;
}

.project-dashboard .map-glow-two {
    width: 190px;
    height: 190px;
    right: 14%;
    top: 22%;
    background: radial-gradient(circle, rgba(213, 163, 91, 0.22), rgba(213, 163, 91, 0));
    animation: glowPulse 8s ease-in-out infinite 1.2s;
}

.project-dashboard .map-orbit {
    position: absolute;
    border-radius: 50%;
    border: 1px dashed rgba(45, 143, 133, 0.14);
    pointer-events: none;
    animation: mapOrbit 18s linear infinite;
}

.project-dashboard .orbit-one {
    width: 440px;
    height: 440px;
    left: -120px;
    top: 40px;
}

.project-dashboard .orbit-two {
    width: 320px;
    height: 320px;
    right: -60px;
    bottom: 30px;
    animation-duration: 24s;
    animation-direction: reverse;
}

.project-dashboard .map-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0.95;
}

.project-dashboard .map-region {
    transform-origin: center;
    animation: mapFloat 8s ease-in-out infinite;
}

.project-dashboard .route-line {
    stroke-dashoffset: 0;
    animation: routeFlow 5.5s linear infinite;
}

.project-dashboard .route-line:nth-child(2) {
    animation-delay: 0.8s;
}

.project-dashboard .route-line:nth-child(3) {
    animation-delay: 1.4s;
}

.project-dashboard .route-line:nth-child(4) {
    animation-delay: 2s;
}

.project-dashboard .map-hud {
    position: absolute;
    z-index: 3;
    display: grid;
    gap: 4px;
    padding: 14px 16px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(105, 88, 71, 0.10);
    box-shadow: 0 18px 32px rgba(53, 43, 32, 0.08);
    backdrop-filter: blur(10px);
}

.project-dashboard .map-hud-left {
    left: 20px;
    top: 72px;
}

.project-dashboard .map-hud-right {
    right: 20px;
    top: 20px;
}

.project-dashboard .hud-title {
    color: var(--project-accent);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.project-dashboard .map-hud strong {
    color: var(--project-title);
    font-size: 15px;
    line-height: 1.4;
}

.project-dashboard .pin {
    position: absolute;
    transform: translate(-50%, -50%);
    text-align: center;
    z-index: 3;
}

.project-dashboard .pin-dot {
    margin: 0 auto;
    border-radius: 50%;
    border: 4px solid rgba(255, 255, 255, 0.95);
    animation: pinPulse 2.8s ease-out infinite;
}

.project-dashboard .pin.india .pin-dot {
    width: 26px;
    height: 26px;
    background: var(--project-accent);
    box-shadow: 0 0 0 12px rgba(45, 143, 133, 0.12), 0 0 24px rgba(45, 143, 133, 0.24);
}

.project-dashboard .pin.qatar .pin-dot {
    width: 22px;
    height: 22px;
    background: var(--project-gold);
    box-shadow: 0 0 0 10px rgba(213, 163, 91, 0.12), 0 0 22px rgba(213, 163, 91, 0.22);
}

.project-dashboard .pin.uae .pin-dot {
    width: 22px;
    height: 22px;
    background: var(--project-coral);
    box-shadow: 0 0 0 10px rgba(196, 107, 82, 0.11), 0 0 22px rgba(196, 107, 82, 0.2);
}

.project-dashboard .pin.ksa .pin-dot {
    width: 22px;
    height: 22px;
    background: var(--project-slate);
    box-shadow: 0 0 0 10px rgba(108, 127, 153, 0.12), 0 0 22px rgba(108, 127, 153, 0.22);
}

.project-dashboard .pin-compact {
    display: grid;
    gap: 8px;
    justify-items: center;
}

.project-dashboard .pin-tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(105, 88, 71, 0.12);
    color: var(--project-title);
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 14px 24px rgba(53, 43, 32, 0.08);
    animation: tagFloat 4.8s ease-in-out infinite;
}

.project-dashboard .map-location-strip {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 18px;
    z-index: 3;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.project-dashboard .location-chip {
    display: grid;
    gap: 3px;
    padding: 14px 16px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(105, 88, 71, 0.10);
    box-shadow: 0 18px 30px rgba(53, 43, 32, 0.08);
    backdrop-filter: blur(10px);
    animation: cardLift 6s ease-in-out infinite;
}

.project-dashboard .location-chip:nth-child(2) {
    animation-delay: 0.6s;
}

.project-dashboard .location-chip:nth-child(3) {
    animation-delay: 1.2s;
}

.project-dashboard .location-chip:nth-child(4) {
    animation-delay: 1.8s;
}

.project-dashboard .location-chip strong {
    color: var(--project-title);
    font-size: 15px;
}

.project-dashboard .location-chip span {
    color: #000;
    font-size: 12px;
}

.project-dashboard .location-chip.is-primary {
    background: linear-gradient(180deg, rgba(45, 143, 133, 0.12), rgba(255, 255, 255, 0.92));
    border-color: rgba(45, 143, 133, 0.18);
}

.project-dashboard .map-presence-panel {
    display: grid;
    grid-template-rows: auto 1fr auto;
    gap: 16px;
}

.project-dashboard .map-layout--google {
    grid-template-columns: minmax(0, 1.25fr) minmax(300px, 0.75fr);
    gap: 22px;
}

.project-dashboard .map-visual {
    display: grid;
    gap: 14px;
}

.project-dashboard .map-topbar {
    padding: 14px 16px;
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(47, 138, 126, 0.08), rgba(255, 253, 249, 0.94));
    border: 1px solid rgba(47, 138, 126, 0.15);
}

.project-dashboard .map-kicker {
    display: inline-block;
    color: var(--project-accent);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 6px;
}

.project-dashboard .map-topbar h4 {
    margin: 0;
    color: var(--project-title);
    font-size: 20px;
}

.project-dashboard .map-frame-wrap {
    position: relative;
    min-height: 450px;
    border-radius: 24px;
    overflow: hidden;
    border: 1px solid rgba(119, 101, 82, 0.16);
    box-shadow: 0 18px 34px rgba(63, 51, 39, 0.12);
}

.project-dashboard .google-map {
    width: 100%;
    height: 100%;
    border: 0;
    filter: saturate(1.05) contrast(1.02);
}

.project-dashboard .map-badge {
    position: absolute;
    z-index: 2;
    padding: 7px 12px;
    border-radius: 999px;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.02em;
    box-shadow: 0 10px 18px rgba(0, 0, 0, 0.18);
    animation: labelFloat 4.8s ease-in-out infinite;
}

.project-dashboard .map-badge-india {
    left: 48%;
    top: 54%;
    background: var(--project-accent);
}

.project-dashboard .map-badge-qatar {
    left: 58%;
    top: 47%;
    background: var(--project-gold);
    animation-delay: 0.45s;
}

.project-dashboard .map-badge-uae {
    left: 63%;
    top: 53%;
    background: var(--project-coral);
    animation-delay: 0.9s;
}

.project-dashboard .map-badge-ksa {
    left: 56%;
    top: 41%;
    background: var(--project-slate);
    animation-delay: 1.25s;
}

.project-dashboard .map-route-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.project-dashboard .route-chip {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    border-radius: 999px;
    border: 1px solid var(--project-line);
    background: rgba(255, 252, 246, 0.95);
    color: var(--project-title);
    font-size: 12px;
    font-weight: 700;
}

.project-dashboard .route-chip.is-primary {
    background: rgba(47, 138, 126, 0.12);
    border-color: rgba(47, 138, 126, 0.22);
    color: var(--project-accent);
}

.project-dashboard .presence-summary,
.project-dashboard .presence-item,
.project-dashboard .presence-note {
    background: rgba(255, 253, 249, 0.9);
    border: 1px solid var(--project-line);
    border-radius: 20px;
    box-shadow: 0 14px 28px rgba(63, 51, 39, 0.07);
}

.project-dashboard .presence-summary {
    padding: 22px;
}

.project-dashboard .presence-summary small {
    display: inline-block;
    margin-bottom: 10px;
    color: var(--project-accent);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.14em;
}

.project-dashboard .presence-summary h4 {
    margin: 0 0 10px;
    color: var(--project-title);
    font-size: 22px;
}

.project-dashboard .presence-summary p {
    margin: 0;
    color: #000;
    line-height: 1.7;
    font-size: 14px;
}

.project-dashboard .presence-list {
    display: grid;
    gap: 12px;
}

.project-dashboard .presence-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px;
}

.project-dashboard .presence-item strong {
    display: block;
    color: var(--project-title);
    font-size: 16px;
}

.project-dashboard .presence-item span {
    display: block;
    margin-top: 4px;
    color: #000;
    font-size: 13px;
    line-height: 1.5;
}

.project-dashboard .presence-item b {
    color: var(--project-title);
    font-size: 22px;
    white-space: nowrap;
}

.project-dashboard .presence-item.is-primary {
    background: linear-gradient(180deg, rgba(45, 143, 133, 0.10), rgba(255, 255, 255, 0.92));
    border-color: rgba(45, 143, 133, 0.20);
}

.project-dashboard .presence-note {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 16px;
}

.project-dashboard .presence-badge {
    display: inline-flex;
    align-items: center;
    padding: 9px 12px;
    border-radius: 999px;
    background: rgba(248, 244, 236, 0.95);
    border: 1px solid var(--project-line);
    color: var(--project-title);
    font-size: 12px;
    font-weight: 700;
}

@keyframes routeFlow {
    from {
        stroke-dashoffset: 72;
    }

    to {
        stroke-dashoffset: 0;
    }
}

@keyframes pinPulse {
    0% {
        transform: scale(0.96);
        box-shadow: 0 0 0 0 rgba(45, 143, 133, 0.18);
    }

    65% {
        transform: scale(1.08);
        box-shadow: 0 0 0 14px rgba(45, 143, 133, 0);
    }

    100% {
        transform: scale(0.96);
        box-shadow: 0 0 0 0 rgba(45, 143, 133, 0);
    }
}

@keyframes glowPulse {

    0%,
    100% {
        transform: scale(0.92);
        opacity: 0.45;
    }

    50% {
        transform: scale(1.08);
        opacity: 0.8;
    }
}

@keyframes cardLift {

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

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

@keyframes tagFloat {

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

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

@keyframes labelFloat {

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

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

@keyframes mapFloat {

    0%,
    100% {
        transform: translate(-180px, -55px) scale(1.45);
    }

    50% {
        transform: translate(-180px, -61px) scale(1.465);
    }
}

@keyframes mapOrbit {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes miniWave {

    0%,
    100% {
        transform: translateY(0) scaleY(1);
    }

    25% {
        transform: translateY(-2px) scaleY(1.05);
    }

    50% {
        transform: translateY(1px) scaleY(0.95);
    }

    75% {
        transform: translateY(-1px) scaleY(1.03);
    }
}

@media (prefers-reduced-motion: reduce) {
    .project-dashboard .mini-chart .col {
        animation: none;
    }
}

.project-dashboard .info-section {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr 1fr;
    gap: 20px;
}

.project-dashboard .info-section .info-card {
    position: relative;
    overflow: hidden;
    background: linear-gradient(165deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 252, 246, 0.94) 100%);
    border: 1px solid rgba(119, 101, 82, 0.13);
    box-shadow: 0 16px 34px rgba(63, 51, 39, 0.08);
}

.project-dashboard .info-section .info-card::before {
    content: "";
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, var(--project-accent) 0%, var(--project-gold) 50%, var(--project-accent) 100%);
    background-size: 200% 100%;
    animation: topBorderSlide 3s linear infinite;
}

.project-dashboard .info-section .info-card::after {
    content: "";
    position: absolute;
    width: 210px;
    height: 210px;
    right: -84px;
    top: -96px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(47, 138, 126, 0.08) 0%, rgba(47, 138, 126, 0) 70%);
    pointer-events: none;
}

.project-dashboard .info-section .info-card h3 {
    font-size: 24px;
    letter-spacing: 0.01em;
}

.project-dashboard .info-section .section-copy {
    margin-top: 8px;
    margin-bottom: 14px;
    line-height: 1.72;
    font-size: 14px;
}

.project-dashboard .tag-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    position: relative;
    z-index: 1;
}

.project-dashboard .info-section .tag {
    background: rgba(47, 138, 126, 0.1);
    border-color: rgba(47, 138, 126, 0.2);
    color: var(--project-title);
    font-weight: 700;
}

.project-dashboard .team-size {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 16px;
    padding: 14px;
    border-radius: 16px;
    border: 1px solid rgba(119, 101, 82, 0.14);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(245, 255, 252, 0.82));
}

.project-dashboard .team-number {
    font-size: 56px;
    line-height: 0.9;
    color: var(--project-accent);
    font-weight: 900;
    text-shadow: 0 4px 14px rgba(47, 138, 126, 0.18);
}

.project-dashboard .team-text {
    font-size: 13px;
    line-height: 1.65;
}

.project-dashboard .size-row {
    grid-template-columns: 86px 1fr;
    border: 1px solid rgba(119, 101, 82, 0.12);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 250, 242, 0.94));
    border-radius: 14px;
    padding: 12px 14px;
}

.project-dashboard .size-row b {
    color: var(--project-accent);
    letter-spacing: 0.02em;
}

.project-dashboard .other-section {
    position: relative;
    overflow: hidden;
    background: linear-gradient(165deg, rgba(255, 255, 255, 0.99) 0%, rgba(252, 247, 239, 0.95) 100%);
    border: 1px solid rgba(119, 101, 82, 0.14);
    box-shadow: 0 20px 38px rgba(63, 51, 39, 0.09);
}

.project-dashboard .other-section::before {
    content: "";
    position: absolute;
    inset: auto -80px -120px auto;
    width: 250px;
    height: 250px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(213, 163, 91, 0.14) 0%, rgba(213, 163, 91, 0) 70%);
}

.project-dashboard .other-section::after {
    content: "";
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, var(--project-accent), var(--project-gold), var(--project-coral));
}

.project-dashboard .other-section .chart-title {
    margin-bottom: 22px;
    position: relative;
    z-index: 1;
}

.project-dashboard .other-section .legend span {
    padding: 7px 12px;
    border-radius: 999px;
    border: 1px solid rgba(47, 138, 126, 0.18);
    background: rgba(255, 252, 246, 0.9);
    color: var(--project-title);
    font-weight: 600;
}

.project-dashboard .other-grid {
    grid-template-columns: repeat(4, 1fr);
    position: relative;
    z-index: 1;
    gap: 14px;
}

.project-dashboard .other-box {
    position: relative;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 255, 252, 0.9));
    border: 1px solid rgba(119, 101, 82, 0.14);
    border-radius: 18px;
    padding: 20px;
    box-shadow: 0 12px 24px rgba(63, 51, 39, 0.07);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
}

.project-dashboard .other-box::before {
    display: none;
}

.project-dashboard .other-box:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 28px rgba(63, 51, 39, 0.11);
}

.project-dashboard .other-box b {
    display: block;
    margin-bottom: 6px;
    font-size: 16px;
    color: var(--project-title);
}

.project-dashboard .other-box p {
    margin: 0;
    line-height: 1.62;
    font-size: 13.5px;
}

.project-dashboard .insight-list {
    margin: 18px 0 0;
    padding: 0;
    list-style: none;
    position: relative;
    z-index: 1;
    gap: 10px;
}

.project-dashboard .insight-list li {
    position: relative;
    padding: 13px 14px 13px 42px;
    border-radius: 14px;
    border: 1px solid rgba(119, 101, 82, 0.12);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(255, 250, 242, 0.92));
}

.project-dashboard .insight-list li::before {
    content: "";
    position: absolute;
    left: 14px;
    top: 16px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: linear-gradient(180deg, var(--project-accent), var(--project-coral));
    box-shadow: 0 0 0 5px rgba(47, 138, 126, 0.12);
}

/* Final override: all cards white with no shadow */
.project-dashboard .hero-main,
.project-dashboard .card,
.project-dashboard .chart-card,
.project-dashboard .map-card,
.project-dashboard .info-card,
.project-dashboard .other-section,
.project-dashboard .score-note-item,
.project-dashboard .split-item,
.project-dashboard .size-row,
.project-dashboard .insight-list li,
.project-dashboard .tile,
.project-dashboard .presence-summary,
.project-dashboard .presence-item,
.project-dashboard .presence-note,
.project-dashboard .map-topbar,
.project-dashboard .route-chip,
.project-dashboard .team-size,
.project-dashboard .location-chip,
.project-dashboard .map-hud,
.project-dashboard .map-focus-badge,
.project-dashboard .pin-tag,
.project-dashboard .map-frame-wrap {
    background: #ffffff !important;
    box-shadow: none !important;
}

/* Value/percentage badge: visible teal-gold pill */
.project-dashboard .value {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 52px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    color: #ffffff;
    background: linear-gradient(90deg, var(--project-accent), var(--project-gold)) !important;
    box-shadow: 0 2px 8px rgba(47, 138, 126, 0.25) !important;
    transition: none;
}

/* Technology Platform Experience: upgraded bar graph styling */
.project-dashboard .tech-platform-card .bars {
    gap: 12px;
}

.project-dashboard .tech-platform-card .bar-row {
    grid-template-columns: 148px 1fr 62px;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(113, 97, 78, 0.12);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(252, 248, 241, 0.95));
}

.project-dashboard .tech-platform-card .bar-label {
    font-weight: 700;
    letter-spacing: 0.01em;
}

.project-dashboard .tech-platform-card .track {
    height: 16px;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(233, 241, 239, 0.85), rgba(245, 249, 248, 0.96));
    border: 1px solid rgba(47, 138, 126, 0.12);
    box-shadow: inset 0 1px 4px rgba(36, 47, 57, 0.08);
}

.project-dashboard .tech-platform-card .fill {
    box-shadow: 0 3px 10px rgba(47, 138, 126, 0.2);
}

.project-dashboard .tech-platform-card .bar-row:nth-child(1) .fill {
    background: linear-gradient(90deg, #1f7f72 0%, #49ab95 55%, #7bc8b6 100%);
}

.project-dashboard .tech-platform-card .bar-row:nth-child(2) .fill {
    background: linear-gradient(90deg, #2f8a7e 0%, #57b29d 55%, #caa56a 100%);
}

.project-dashboard .tech-platform-card .bar-row:nth-child(3) .fill {
    background: linear-gradient(90deg, #3b8ea6 0%, #5aa8be 52%, #9bbfd0 100%);
}

.project-dashboard .tech-platform-card .bar-row:nth-child(4) .fill {
    background: linear-gradient(90deg, #647ba0 0%, #7a90b1 52%, #c0a980 100%);
}

.project-dashboard .tech-platform-card .bar-row:nth-child(5) .fill {
    background: linear-gradient(90deg, #6f7e96 0%, #8a99ad 52%, #b8c3d0 100%);
}

.project-dashboard .tech-platform-card .value {
    min-width: 56px;
    font-weight: 800;
    color: #ffffff;
    background: linear-gradient(90deg, #244f66, #2f8a7e) !important;
}

/* Axis labels used by bar charts */
.project-dashboard .axis-head,
.project-dashboard .axis-scale {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.project-dashboard .axis-head {
    margin-bottom: 6px;
}

.project-dashboard .axis-head span:first-child {
    grid-column: 1 / 3;
}

.project-dashboard .axis-head span:last-child {
    grid-column: 3 / 6;
    text-align: right;
}

.project-dashboard .axis-scale {
    margin-top: 4px;
}

.project-dashboard .axis-scale span {
    text-align: center;
}

/* Graph 1: Project Category Mix (axis board style) */
.project-dashboard .category-mix-card .bars {
    position: relative;
    gap: 12px;
    padding: 12px 12px 14px 14px;
    border: 1px solid rgba(114, 96, 76, 0.14);
    border-radius: 16px;
    background:
        linear-gradient(90deg,
            rgba(47, 138, 126, 0.06) 0%,
            rgba(47, 138, 126, 0.06) 1px,
            transparent 1px,
            transparent 25%),
        linear-gradient(90deg,
            rgba(47, 138, 126, 0.06) 25%,
            rgba(47, 138, 126, 0.06) calc(25% + 1px),
            transparent calc(25% + 1px),
            transparent 50%),
        linear-gradient(90deg,
            rgba(47, 138, 126, 0.06) 50%,
            rgba(47, 138, 126, 0.06) calc(50% + 1px),
            transparent calc(50% + 1px),
            transparent 75%),
        linear-gradient(90deg,
            rgba(47, 138, 126, 0.06) 75%,
            rgba(47, 138, 126, 0.06) calc(75% + 1px),
            transparent calc(75% + 1px),
            transparent 100%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 251, 244, 0.95));
}

.project-dashboard .category-mix-card .axis-head {
    color: #8b7358;
}

.project-dashboard .category-mix-card .bar-row {
    grid-template-columns: 84px 1fr 58px;
    gap: 10px;
    padding-bottom: 4px;
    border-bottom: 1px dashed rgba(125, 108, 87, 0.16);
}

.project-dashboard .category-mix-card .bar-row:last-of-type {
    border-bottom: none;
}

.project-dashboard .category-mix-card .bar-label {
    font-size: 12.5px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #7b6141;
}

.project-dashboard .category-mix-card .track {
    height: 14px;
    border-radius: 5px;
    background: rgba(242, 236, 227, 0.9);
    border: 1px solid rgba(118, 100, 80, 0.12);
    box-shadow: none;
}

.project-dashboard .category-mix-card .fill {
    border-radius: 4px;
    background: linear-gradient(90deg, #c78a59 0%, #d7a66f 36%, #2f8a7e 100%);
}

.project-dashboard .category-mix-card .value {
    background: #efe6d8 !important;
    border: 1px solid rgba(129, 106, 82, 0.2);
    color: #7b6141;
    box-shadow: none !important;
}

.project-dashboard .category-mix-card .axis-scale {
    color: #9b8467;
}

/* Graph 2: Technology Platform Experience (boxed panel style) */
.project-dashboard .tech-platform-card .bars {
    gap: 10px;
    padding: 12px;
    border: 1px solid rgba(69, 111, 134, 0.16);
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(248, 252, 255, 0.96), rgba(241, 248, 252, 0.93));
}

.project-dashboard .tech-platform-card .axis-head {
    color: #456f86;
}

.project-dashboard .tech-platform-card .axis-scale {
    color: #5f7f97;
}

.project-dashboard .tech-platform-card .axis-scale span {
    background: rgba(69, 111, 134, 0.08);
    border: 1px solid rgba(69, 111, 134, 0.18);
    border-radius: 999px;
    padding: 3px 0;
}

.project-dashboard .tech-platform-card .bar-row {
    grid-template-columns: 148px 1fr 62px;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(69, 111, 134, 0.13);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 252, 255, 0.95));
}

.project-dashboard .team-number {
    text-shadow: none !important;
}

.project-dashboard .other-box:hover {
    box-shadow: 0 6px 24px rgba(47, 138, 126, 0.12) !important;
    transform: translateY(-3px);
}

.project-dashboard .other-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
    min-width: 0;
}

/* Other Capabilities box icons */
.project-dashboard .other-icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #ffffff;
    background: linear-gradient(135deg, var(--project-accent), var(--project-gold));
    box-shadow: 0 10px 22px rgba(47, 138, 126, 0.18);
    flex-shrink: 0;
}

.project-dashboard .other-box--plc .other-icon {
    background: linear-gradient(135deg, #2f8a7e, #3cb8a7);
}

.project-dashboard .other-box--scada .other-icon {
    background: linear-gradient(135deg, #5b7fa6, #70859c);
}

.project-dashboard .other-box--comm .other-icon {
    background: linear-gradient(135deg, #be7963, #caa56a);
}

.project-dashboard .other-box--doc .other-icon {
    background: linear-gradient(135deg, #70859c, #8fa0b5);
}

.project-dashboard .other-box b {
    display: block;
    font-size: 17px;
    line-height: 1.35;
    font-weight: 700;
    color: var(--project-title);
    margin: 0;
}

.project-dashboard .other-box p {
    margin: 0;
}

.project-dashboard .other-tag {
    display: inline-block;
    margin-top: 12px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    background: rgba(47, 138, 126, 0.08);
    color: var(--project-accent);
    border: 1px solid rgba(47, 138, 126, 0.18);
}

.project-dashboard .other-box--scada .other-tag {
    background: rgba(91, 127, 166, 0.08);
    color: #5b7fa6;
    border-color: rgba(91, 127, 166, 0.2);
}

.project-dashboard .other-box--comm .other-tag {
    background: rgba(190, 121, 99, 0.08);
    color: var(--project-coral);
    border-color: rgba(190, 121, 99, 0.2);
}

.project-dashboard .other-box--doc .other-tag {
    background: rgba(112, 133, 156, 0.08);
    color: var(--project-slate);
    border-color: rgba(112, 133, 156, 0.2);
}

/* Segment info-card header */
.project-dashboard .info-card-head {
    margin-bottom: 6px;
}

.project-dashboard .info-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background: linear-gradient(90deg, rgba(47, 138, 126, 0.10), rgba(202, 165, 106, 0.10));
    color: var(--project-accent);
    border: 1px solid rgba(47, 138, 126, 0.18);
    margin-bottom: 8px;
}

.project-dashboard .info-eyebrow i {
    font-size: 12px;
}

/* Tag cloud: colored accent tags */
.project-dashboard .tag-cloud .tag {
    margin: 4px;
    transition: background 0.2s, transform 0.15s;
}

.project-dashboard .tag-cloud .tag:nth-child(odd) {
    background: rgba(47, 138, 126, 0.08);
    color: var(--project-accent);
    border-color: rgba(47, 138, 126, 0.22);
}

.project-dashboard .tag-cloud .tag:nth-child(even) {
    background: rgba(202, 165, 106, 0.10);
    color: #a07a38;
    border-color: rgba(202, 165, 106, 0.30);
}

.project-dashboard .tag-cloud .tag:hover {
    transform: translateY(-2px);
    background: rgba(47, 138, 126, 0.15);
    color: var(--project-accent);
}

.project-dashboard,
.project-dashboard *,
.project-dashboard *::before,
.project-dashboard *::after {
    box-shadow: none !important;
    text-shadow: none !important;
}

@media (max-width: 991px) {
    .project-dashboard {
        padding: 60px 0;
    }

    .project-dashboard .hero,
    .project-dashboard .charts,
    .project-dashboard .donut-wrap,
    .project-dashboard .info-section,
    .project-dashboard .other-grid,
    .project-dashboard .matrix,
    .project-dashboard .map-layout {
        grid-template-columns: 1fr;
    }

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

    .project-dashboard .hero-title {
        font-size: 36px;
    }

    .project-dashboard .map-wrap {
        min-height: 540px;
    }

    .project-dashboard .map-layout--google {
        grid-template-columns: 1fr;
    }

    .project-dashboard .map-frame-wrap {
        min-height: 400px;
    }

    .project-dashboard .map-badge {
        font-size: 11px;
        padding: 6px 10px;
    }

    .project-dashboard .map-region {
        animation: none;
    }

    .project-dashboard .map-location-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575px) {
    .project-dashboard .dashboard-shell {
        padding: 0 15px;
    }

    .project-dashboard .kpi-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }

    .project-dashboard .kpis .card {
        min-height: auto;
    }

    .project-dashboard .kpis .card small {
        max-width: 100%;
    }

    .project-dashboard .card h2 {
        text-align: left;
    }

    .project-dashboard .kpis,
    .project-dashboard .info-section,
    .project-dashboard .other-grid,
    .project-dashboard .matrix,
    .project-dashboard .score-note {
        grid-template-columns: 1fr;
    }

    .project-dashboard .hero-main,
    .project-dashboard .card,
    .project-dashboard .chart-card,
    .project-dashboard .map-card,
    .project-dashboard .info-card,
    .project-dashboard .other-section {
        padding: 20px;
    }

    .project-dashboard .bar-row,
    .project-dashboard .size-row {
        grid-template-columns: 1fr;
    }

    .project-dashboard .axis-head {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .project-dashboard .axis-head span:first-child,
    .project-dashboard .axis-head span:last-child {
        grid-column: auto;
        text-align: left;
    }

    .project-dashboard .axis-scale {
        gap: 4px;
        font-size: 10px;
    }

    .project-dashboard .category-mix-card .bars,
    .project-dashboard .tech-platform-card .bars {
        padding: 10px;
    }

    .project-dashboard .presence-item {
        flex-direction: column;
        align-items: flex-start;
    }

    .project-dashboard .map-wrap {
        min-height: 560px;
    }

    .project-dashboard .map-frame-wrap {
        min-height: 320px;
    }

    .project-dashboard .map-badge {
        position: static;
        display: inline-flex;
        margin: 6px 6px 0 0;
        animation: none;
    }

    .project-dashboard .map-frame-wrap {
        display: flex;
        flex-wrap: wrap;
        align-content: flex-start;
        gap: 6px;
        padding-bottom: 8px;
    }

    .project-dashboard .google-map {
        height: 250px;
        width: 100%;
    }

    .project-dashboard .map-hud {
        position: static;
        margin: 14px 14px 0;
    }

    .project-dashboard .map-hud-right {
        margin-top: 10px;
    }

    .project-dashboard .map-location-strip {
        position: static;
        grid-template-columns: 1fr;
        padding: 14px;
        margin-top: 280px;
    }

    .project-dashboard .pin-tag {
        font-size: 11px;
        padding: 6px 10px;
    }

    .project-dashboard .map-focus-badge {
        left: 14px;
        right: 14px;
        text-align: center;
        font-size: 11px;
    }

    .project-dashboard .team-size {
        flex-direction: column;
        align-items: flex-start;
    }
}