/* Capital Project Progress Monitoring System page. All selectors are scoped to .its-page--ppms. */
.its-page--ppms { --ppms-ink:#10283d; --ppms-navy:#0b1c2c; --ppms-blue:#176a91; --ppms-cyan:#57c6d6; --ppms-muted:#607487; }
.its-page--ppms .ppms-hero { position:relative; overflow:hidden; isolation:isolate; background:linear-gradient(118deg,#081b2b 0%,#10334b 58%,#12506a 100%); color:#fff; padding:clamp(64px,8vw,112px) 0 76px; }
.its-page--ppms .ppms-hero::before { content:""; position:absolute; inset:0; z-index:-1; opacity:.22; background:radial-gradient(circle at 75% 20%,#58c8dc 0,transparent 30%),linear-gradient(90deg,transparent 49%,rgba(255,255,255,.08) 50%,transparent 51%); }
.its-page--ppms .ppms-hero__inner { position:relative; z-index:2; max-width:760px; }
.its-page--ppms .its-breadcrumb { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:30px; color:rgba(255,255,255,.68); font-size:13px; }
.its-page--ppms .its-breadcrumb a { color:#fff; text-decoration:none; }
.its-page--ppms .its-eyebrow,.its-page--ppms .ppms-label { display:inline-block; color:var(--ppms-cyan); font-size:11px; font-weight:800; letter-spacing:.17em; text-transform:uppercase; }
.its-page--ppms .ppms-hero h1 { max-width:760px; margin:17px 0 20px; color:#fff; font-size:clamp(36px,4.6vw,62px); line-height:1.08; letter-spacing:-.035em; }
.its-page--ppms .ppms-hero h1 em { color:var(--ppms-cyan); font-style:normal; white-space:nowrap; }
.its-page--ppms .ppms-hero__subtitle { max-width:700px; margin:0 0 15px; color:#eaf6fa; font-size:clamp(19px,2vw,25px); line-height:1.4; font-weight:600; }
.its-page--ppms .ppms-hero__inner>p { max-width:670px; color:rgba(255,255,255,.76); font-size:16px; line-height:1.8; }
.its-page--ppms .ppms-hero__actions { display:flex; flex-wrap:wrap; gap:13px; margin-top:27px; }
.its-page--ppms .ppms-hero .its-button,.its-page--ppms .ppms-cta .its-button { display:inline-flex; align-items:center; justify-content:center; gap:12px; border-radius:4px; padding:14px 20px; text-decoration:none; font-weight:700; }
.its-page--ppms .ppms-secondary-button { display:inline-flex; align-items:center; gap:12px; padding:13px 19px; border:1px solid rgba(255,255,255,.35); border-radius:4px; color:#fff; text-decoration:none; font-weight:700; }
.its-page--ppms .ppms-hero__metrics { display:flex; gap:0; margin-top:39px; max-width:570px; border-top:1px solid rgba(255,255,255,.2); padding-top:22px; }
.its-page--ppms .ppms-hero__metrics>div { display:flex; flex:1; flex-direction:column; gap:4px; padding:0 18px; border-right:1px solid rgba(255,255,255,.18); }
.its-page--ppms .ppms-hero__metrics>div:first-child { padding-left:0; }
.its-page--ppms .ppms-hero__metrics>div:last-child { border:0; }
.its-page--ppms .ppms-hero__metrics strong { color:#fff; font-size:26px; line-height:1.2; }
.its-page--ppms .ppms-hero__metrics span { color:rgba(255,255,255,.65); font-size:12px; }
.its-page--ppms .ppms-hero__visual { position:absolute; top:10%; right:-2%; width:42%; height:80%; min-height:430px; overflow:hidden; opacity:.88; border-left:1px solid rgba(104,208,222,.14); background:radial-gradient(ellipse at 52% 50%,rgba(40,155,184,.16),transparent 62%); }
.its-page--ppms .ppms-grid-lines { position:absolute; inset:0; background-image:linear-gradient(rgba(123,217,231,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(123,217,231,.1) 1px,transparent 1px); background-size:34px 34px; mask-image:linear-gradient(90deg,transparent,#000 25%,#000); }
.its-page--ppms .ppms-map-shape { position:absolute; left:25%; top:12%; width:57%; height:74%; background:linear-gradient(135deg,rgba(75,187,208,.24),rgba(29,102,137,.07)); clip-path:polygon(36% 0,51% 7%,58% 18%,76% 25%,82% 42%,72% 52%,78% 65%,61% 78%,52% 100%,38% 82%,24% 73%,28% 57%,12% 45%,21% 28%,17% 15%); border:1px solid rgba(110,224,237,.6); filter:drop-shadow(0 0 18px rgba(69,198,219,.18)); }
.its-page--ppms .ppms-route { position:absolute; height:2px; transform-origin:left center; background:linear-gradient(90deg,transparent,var(--ppms-cyan),#d5fbff); box-shadow:0 0 12px rgba(87,198,214,.8); }
.its-page--ppms .ppms-route--one { left:26%; top:32%; width:55%; transform:rotate(25deg); }
.its-page--ppms .ppms-route--two { left:31%; top:69%; width:46%; transform:rotate(-28deg); }
.its-page--ppms .ppms-map-point { position:absolute; display:grid; grid-template-columns:12px auto; gap:2px 8px; align-items:center; padding:10px 13px; border:1px solid rgba(117,222,235,.34); border-radius:5px; background:rgba(6,28,44,.88); box-shadow:0 8px 25px rgba(0,0,0,.18); color:#fff; font-size:9px; letter-spacing:.07em; }
.its-page--ppms .ppms-map-point i { grid-row:span 2; width:8px; height:8px; border-radius:50%; background:var(--ppms-cyan); box-shadow:0 0 0 5px rgba(87,198,214,.13); }
.its-page--ppms .ppms-map-point b { font-size:17px; letter-spacing:0; }
.its-page--ppms .ppms-map-point--one { top:22%; left:24%; }.its-page--ppms .ppms-map-point--two { top:48%; right:5%; }.its-page--ppms .ppms-map-point--three { bottom:16%; left:26%; }
.its-page--ppms .ppms-map-caption { position:absolute; right:5%; bottom:3%; color:rgba(255,255,255,.8); font-size:11px; font-weight:800; letter-spacing:.12em; line-height:1.8; text-align:right; }.its-page--ppms .ppms-map-caption span { color:var(--ppms-cyan); font-size:9px; }
.its-page--ppms .ppms-overview { padding:76px 0; background:#fff; }
.its-page--ppms .ppms-overview__grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(35px,7vw,100px); align-items:start; }
.its-page--ppms .ppms-overview h2,.its-page--ppms .ppms-section-heading h2,.its-page--ppms .ppms-cta h2 { margin:13px 0 0; color:var(--ppms-ink); font-size:clamp(27px,3vw,39px); line-height:1.2; letter-spacing:-.025em; }
.its-page--ppms .ppms-overview__copy p { margin:0 0 16px; color:var(--ppms-muted); font-size:15px; line-height:1.85; }
.its-page--ppms .ppms-overview__copy strong { color:var(--ppms-ink); }
.its-page--ppms .ppms-modules,.its-page--ppms .ppms-value { padding:80px 0; background:#f3f7fa; }
.its-page--ppms .ppms-section-heading { max-width:760px; margin:0 auto 37px; text-align:center; }
.its-page--ppms .ppms-section-heading>span { color:var(--ppms-blue); font-size:11px; font-weight:800; letter-spacing:.16em; }
.its-page--ppms .ppms-section-heading p { margin:14px auto 0; max-width:650px; color:var(--ppms-muted); font-size:15px; line-height:1.75; }
.its-page--ppms .ppms-module-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.its-page--ppms .ppms-module-card { position:relative; padding:30px; overflow:hidden; border:1px solid #e0e9ef; border-radius:8px; background:#fff; box-shadow:0 10px 28px rgba(16,40,61,.035); }
.its-page--ppms .ppms-module-card::after { content:""; position:absolute; top:0; left:0; width:4px; height:100%; background:linear-gradient(var(--ppms-cyan),var(--ppms-blue)); }
.its-page--ppms .ppms-module-card__number { color:#a7bac8; font-size:12px; font-weight:800; letter-spacing:.12em; }
.its-page--ppms .ppms-module-card__icon { position:absolute; top:22px; right:26px; display:grid; place-items:center; width:42px; height:42px; border-radius:50%; background:#eaf7fa; color:var(--ppms-blue); font-size:24px; }
.its-page--ppms .ppms-module-card h3 { max-width:90%; margin:16px 0 17px; color:var(--ppms-ink); font-size:21px; line-height:1.35; }
.its-page--ppms .ppms-module-card ul { display:grid; gap:12px; margin:0; padding-left:19px; color:var(--ppms-muted); font-size:14px; line-height:1.7; }
.its-page--ppms .ppms-module-card li::marker { color:var(--ppms-cyan); }.its-page--ppms .ppms-module-card li strong { color:#233d51; }
.its-page--ppms .ppms-value { background:#fff; }
.its-page--ppms .ppms-value-table-wrap { overflow:hidden; border:1px solid #dfe8ee; border-radius:8px; box-shadow:0 12px 30px rgba(16,40,61,.045); }
.its-page--ppms .ppms-value-table { width:100%; border-collapse:collapse; text-align:left; }
.its-page--ppms .ppms-value-table thead { background:#102b40; color:#fff; }
.its-page--ppms .ppms-value-table th { padding:18px 24px; font-size:12px; letter-spacing:.1em; text-transform:uppercase; }
.its-page--ppms .ppms-value-table td { width:50%; padding:20px 24px; border-bottom:1px solid #e7edf1; color:var(--ppms-muted); font-size:14px; line-height:1.65; vertical-align:middle; }
.its-page--ppms .ppms-value-table tr:last-child td { border-bottom:0; }
.its-page--ppms .ppms-value-table tbody tr:nth-child(even) { background:#f8fafc; }
.its-page--ppms .ppms-value-table td:first-child { color:var(--ppms-ink); }
.its-page--ppms .ppms-value-table td strong { display:inline; font-weight:700; }
.its-page--ppms .ppms-challenge-mark { display:inline-grid; place-items:center; width:29px; height:29px; margin-right:12px; border-radius:50%; background:#e5f5f8; color:#176a91; font-size:10px; font-weight:800; vertical-align:middle; }
.its-page--ppms .ppms-cta { padding:65px 0; background:linear-gradient(115deg,#0a2031,#124a64); color:#fff; }
.its-page--ppms .ppms-cta__inner { display:flex; align-items:center; justify-content:space-between; gap:35px; }
.its-page--ppms .ppms-cta h2 { max-width:700px; color:#fff; }
.its-page--ppms .ppms-cta p { max-width:700px; margin:14px 0 0; color:rgba(255,255,255,.72); line-height:1.75; }
.its-page--ppms .ppms-cta .its-button { flex-shrink:0; }
@media(max-width:1050px) {
 .its-page--ppms .ppms-hero__visual { right:-13%; width:49%; opacity:.48; }
 .its-page--ppms .ppms-hero__inner { max-width:700px; }
 .its-page--ppms .ppms-overview__grid { gap:40px; }
}
@media(max-width:760px) {
 .its-page--ppms .ppms-hero { padding:44px 0 48px; }
 .its-page--ppms .ppms-hero__inner { max-width:none; }
 .its-page--ppms .ppms-hero__visual { top:0; right:-30%; width:90%; height:100%; min-height:0; opacity:.2; }
 .its-page--ppms .ppms-hero h1 { font-size:clamp(34px,9vw,46px); }
 .its-page--ppms .ppms-hero h1 em { white-space:normal; }
 .its-page--ppms .ppms-hero__subtitle { font-size:19px; }
 .its-page--ppms .ppms-hero__inner>p { font-size:14px; }
 .its-page--ppms .ppms-hero__metrics { margin-top:30px; }
 .its-page--ppms .ppms-hero__metrics>div { padding:0 10px; }
 .its-page--ppms .ppms-hero__metrics strong { font-size:22px; }
 .its-page--ppms .ppms-hero__metrics span { font-size:10px; }
 .its-page--ppms .ppms-overview,.its-page--ppms .ppms-modules,.its-page--ppms .ppms-value { padding:54px 0; }
 .its-page--ppms .ppms-overview__grid { grid-template-columns:1fr; gap:22px; }
 .its-page--ppms .ppms-module-grid { grid-template-columns:1fr; gap:15px; }
 .its-page--ppms .ppms-module-card { padding:25px 22px; }
 .its-page--ppms .ppms-module-card h3 { font-size:19px; }
 .its-page--ppms .ppms-value-table-wrap { overflow:visible; border:0; box-shadow:none; }
 .its-page--ppms .ppms-value-table,.its-page--ppms .ppms-value-table tbody,.its-page--ppms .ppms-value-table tr,.its-page--ppms .ppms-value-table td { display:block; width:100%; }
 .its-page--ppms .ppms-value-table thead { display:none; }
 .its-page--ppms .ppms-value-table tr { margin-bottom:13px; overflow:hidden; border:1px solid #e0e8ee; border-radius:7px; background:#fff; }
 .its-page--ppms .ppms-value-table td { padding:15px 17px; border-bottom:1px solid #e7edf1; }
 .its-page--ppms .ppms-value-table td:first-child { background:#f5f9fb; }
 .its-page--ppms .ppms-value-table td:last-child { border-bottom:0; }
 .its-page--ppms .ppms-cta { padding:48px 0; }
 .its-page--ppms .ppms-cta__inner { align-items:flex-start; flex-direction:column; gap:24px; }
}
@media(max-width:420px) {
 .its-page--ppms .ppms-hero__actions { align-items:stretch; flex-direction:column; }
 .its-page--ppms .ppms-hero__actions a { justify-content:center; }
 .its-page--ppms .ppms-hero__metrics span { max-width:80px; }
 .its-page--ppms .its-breadcrumb { gap:6px; font-size:11px; }
}


/* Banner layout refinement: match the supplied PPMS reference screenshot. */
.its-page--ppms .ppms-hero {
    min-height: 740px;
    padding: 18px 0 58px;
    display: flex;
    align-items: stretch;
}
.its-page--ppms .ppms-hero__inner {
    width: min(1270px, calc(100% - 64px));
    max-width: 1270px;
    margin: 0 auto;
    padding-right: 0;
    box-sizing: border-box;
}
.its-page--ppms .ppms-hero .its-breadcrumb {
    margin-bottom: 32px;
}
.its-page--ppms .ppms-hero__inner > .its-eyebrow,
.its-page--ppms .ppms-hero__inner > h1,
.its-page--ppms .ppms-hero__inner > .ppms-hero__subtitle,
.its-page--ppms .ppms-hero__inner > p,
.its-page--ppms .ppms-hero__actions,
.its-page--ppms .ppms-hero__metrics {
    max-width: 590px;
    position: relative;
    z-index: 2;
}
.its-page--ppms .ppms-hero h1 {
    max-width: 700px;
    margin-top: 18px;
    margin-bottom: 20px;
    font-size: clamp(42px, 4.05vw, 64px);
    line-height: 1.08;
    letter-spacing: -.04em;
}
.its-page--ppms .ppms-hero__subtitle {
    max-width: 660px;
    font-size: clamp(20px, 1.65vw, 26px);
    line-height: 1.4;
}
.its-page--ppms .ppms-hero__inner > p {
    max-width: 650px;
    margin-top: 24px;
    font-size: 16px;
    line-height: 1.8;
}
.its-page--ppms .ppms-hero__visual {
    top: 0;
    right: 0;
    width: 40%;
    height: 100%;
    min-height: 0;
    opacity: .9;
}
.its-page--ppms .ppms-grid-lines {
    background-size: 35px 35px;
}
.its-page--ppms .ppms-hero__metrics {
    width: 100%;
    margin-top: 39px;
}
@media (max-width: 1100px) {
    .its-page--ppms .ppms-hero { min-height: 690px; }
    .its-page--ppms .ppms-hero__inner { width: min(100% - 48px, 1000px); }
    .its-page--ppms .ppms-hero__inner > .its-eyebrow,
    .its-page--ppms .ppms-hero__inner > h1,
    .its-page--ppms .ppms-hero__inner > .ppms-hero__subtitle,
    .its-page--ppms .ppms-hero__inner > p,
    .its-page--ppms .ppms-hero__actions,
    .its-page--ppms .ppms-hero__metrics { max-width: 58%; }
    .its-page--ppms .ppms-hero__visual { width: 46%; opacity: .7; }
    .its-page--ppms .ppms-hero h1 { font-size: clamp(40px, 5vw, 56px); }
}
@media (max-width: 760px) {
    .its-page--ppms .ppms-hero {
        min-height: auto;
        padding: 24px 0 42px;
    }
    .its-page--ppms .ppms-hero__inner { width: calc(100% - 40px); }
    .its-page--ppms .ppms-hero__inner > .its-eyebrow,
    .its-page--ppms .ppms-hero__inner > h1,
    .its-page--ppms .ppms-hero__inner > .ppms-hero__subtitle,
    .its-page--ppms .ppms-hero__inner > p,
    .its-page--ppms .ppms-hero__actions,
    .its-page--ppms .ppms-hero__metrics { max-width: 100%; }
    .its-page--ppms .ppms-hero .its-breadcrumb { margin-bottom: 25px; }
    .its-page--ppms .ppms-hero h1 { font-size: clamp(34px, 9vw, 46px); }
    .its-page--ppms .ppms-hero__visual {
        top: 0;
        right: -24%;
        width: 100%;
        height: 100%;
        min-height: 0;
        opacity: .16;
    }
    .its-page--ppms .ppms-hero__metrics { margin-top: 28px; }
}