:root {
  --navy:#0b2948;
  --navy-2:#123e68;
  --blue:#1f5d8f;
  --orange:#ef8f24;
  --orange-soft:#fff2df;
  --gold:#f5bf62;
  --ink:#142437;
  --muted:#627388;
  --paper:#f3f6fa;
  --white:#fff;
  --line:#d9e4ee;
  --soft:#eaf1f7;
  --green:#13765a;
  --green-soft:#e3f5ee;
  --red:#a84545;
  --red-soft:#fbeaea;
  --shadow:0 18px 50px rgba(11,41,72,.09);
  --radius:20px;
}

* { box-sizing:border-box; }
html { width:100%; max-width:100%; scroll-behavior:smooth; overflow-x:hidden; overflow-x:clip; overscroll-behavior-x:none; -webkit-text-size-adjust:100%; text-size-adjust:100%; touch-action:pan-x pan-y; }
body { width:100%; max-width:100%; min-width:0; margin:0; overflow-x:hidden; overflow-x:clip; background:var(--paper); color:var(--ink); font-family:Tahoma,Arial,"Noto Sans Arabic",sans-serif; font-size:16px; line-height:1.65; touch-action:pan-x pan-y; }
img,svg,video,canvas,iframe { display:block; max-width:100%; height:auto; }
main,section,article,header,footer,nav { min-width:0; }
a { color:inherit; }
button,input,select { font:inherit; }
.skip-link { position:fixed; top:-80px; right:1rem; z-index:1000; background:var(--orange); color:#111; padding:.75rem 1rem; border-radius:10px; }
.skip-link:focus { top:1rem; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.topbar { position:sticky; top:0; z-index:50; min-height:78px; padding:12px max(clamp(18px,4vw,66px),env(safe-area-inset-right)) 12px max(clamp(18px,4vw,66px),env(safe-area-inset-left)); display:flex; align-items:center; justify-content:space-between; gap:22px; background:rgba(11,41,72,.97); color:white; box-shadow:0 8px 30px rgba(4,20,35,.2); backdrop-filter:blur(14px); }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; min-width:max-content; }
.brand-mark { width:50px; height:50px; display:grid; place-items:center; border-radius:15px; background:linear-gradient(135deg,var(--orange),var(--gold)); color:var(--navy); font-weight:900; font-size:.95rem; border:2px solid rgba(255,255,255,.35); box-shadow:inset 0 0 0 3px rgba(255,255,255,.18); }
.brand small,.brand strong { display:block; line-height:1.25; }
.brand small { color:#b9ccdd; font-size:.68rem; letter-spacing:.055em; }
.brand strong { font-size:.92rem; margin-top:4px; }
.main-nav { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:8px 18px; }
.main-nav a { text-decoration:none; color:#d9e6f1; font-size:.78rem; font-weight:700; }
.main-nav a:hover { color:#ffd391; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:.7rem 1.1rem; border:1px solid transparent; border-radius:12px; text-decoration:none; text-align:center; font-weight:900; cursor:pointer; touch-action:manipulation; transition:transform .18s ease,background .18s ease; }
.button:hover { transform:translateY(-1px); }
.button.primary { background:var(--orange); color:#13253a; }
.button.secondary { background:transparent; color:white; border-color:rgba(255,255,255,.34); }
.button.neutral { background:#e6edf4; color:var(--navy); }
.compact-button { min-height:42px; padding:.55rem .85rem; font-size:.76rem; min-width:max-content; }

main { width:min(1500px,calc(100% - 36px)); margin:28px auto 64px; }
.hero { min-height:570px; display:grid; grid-template-columns:minmax(0,1.45fr) minmax(330px,.65fr); align-items:stretch; overflow:hidden; border-radius:28px; color:white; background:radial-gradient(circle at 14% 115%,rgba(239,143,36,.27),transparent 34%),linear-gradient(125deg,var(--navy),#123e68 65%,#225b85); box-shadow:0 28px 75px rgba(11,41,72,.18); }
.hero-copy { padding:clamp(34px,6vw,86px); display:flex; flex-direction:column; justify-content:center; }
.eyebrow { display:block; color:var(--orange); font-size:.73rem; font-weight:900; letter-spacing:.09em; text-transform:uppercase; margin-bottom:.4rem; }
.eyebrow.light { color:#ffd18b; }
.hero h1 { margin:.25rem 0 1.2rem; max-width:950px; font-size:clamp(2.1rem,4.4vw,4.6rem); line-height:1.15; }
.hero-copy>p { max-width:900px; margin:0; color:#d7e4ef; font-size:1.08rem; }
.hero-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:30px; }
.owner-line { margin-top:34px!important; padding-top:18px; border-top:1px solid rgba(255,255,255,.18); font-size:.88rem!important; }
.owner-line strong { color:white; }
.hero-scorecard { padding:28px; display:grid; grid-template-columns:1fr 1fr; gap:12px; align-content:center; background:rgba(255,255,255,.06); border-right:1px solid rgba(255,255,255,.12); }
.hero-scorecard div { min-height:140px; padding:22px; border-radius:18px; display:flex; flex-direction:column; justify-content:center; background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.13); }
.hero-scorecard strong { display:block; direction:ltr; text-align:right; color:#ffd18b; font-size:clamp(1.9rem,3vw,3rem); line-height:1; }
.hero-scorecard span { display:block; margin-top:10px; color:#dce9f3; font-size:.82rem; }

/* Keep Arabic time units attached to the correct value in every direction. */
.duration-value { display:inline-flex!important; flex-flow:row nowrap; direction:rtl!important; unicode-bidi:isolate; align-items:baseline; justify-content:flex-start; gap:.42em; margin:0!important; color:inherit!important; font-size:inherit!important; font-weight:inherit; line-height:1!important; white-space:nowrap; }
.duration-segment { display:inline-flex!important; flex-flow:row nowrap; direction:rtl!important; unicode-bidi:isolate; align-items:baseline; gap:.15em; margin:0!important; color:inherit!important; font-size:inherit!important; line-height:1!important; }
.duration-number { direction:ltr; unicode-bidi:isolate; color:inherit!important; font:inherit; font-size:inherit!important; font-weight:inherit; line-height:1!important; }
.duration-unit { margin:0!important; color:inherit!important; font-family:Tahoma,Arial,"Noto Sans Arabic",sans-serif; font-size:.72em!important; font-weight:900; line-height:1!important; opacity:1; }
.hero-scorecard strong .duration-value { color:#ffd18b!important; font-size:clamp(1.35rem,2vw,1.7rem)!important; font-weight:900; }
.hero-scorecard strong .duration-unit { font-size:.76em!important; }

.content-section { margin-top:58px; scroll-margin-top:96px; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:25px; margin:0 3px 20px; }
.section-heading h2 { margin:0; color:var(--navy); font-size:clamp(1.45rem,2.2vw,2.2rem); line-height:1.3; }
.section-heading p { max-width:660px; margin:0; color:var(--muted); font-size:.88rem; }
.compact-heading { align-items:center; margin:0 0 20px; }
.panel { background:white; border:1px solid rgba(11,41,72,.08); border-radius:var(--radius); box-shadow:var(--shadow); }

.kpi-grid { display:grid; gap:14px; }
.kpi-grid-4 { grid-template-columns:repeat(4,minmax(180px,1fr)); }
.kpi-card { min-height:170px; padding:24px; background:white; border:1px solid rgba(11,41,72,.08); border-radius:18px; box-shadow:0 13px 34px rgba(11,41,72,.07); }
.kpi-card.featured { background:linear-gradient(145deg,var(--navy),var(--navy-2)); color:white; }
.kpi-card strong { display:block; direction:ltr; text-align:right; color:var(--navy); font-size:clamp(2rem,3.2vw,3rem); line-height:1; }
.kpi-card.featured strong { color:var(--gold); }
.kpi-card h3 { margin:12px 0 5px; font-size:1rem; }
.kpi-card p { margin:0; color:var(--muted); font-size:.76rem; }
.kpi-card.featured p { color:#cbdbe8; }

.split-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.work-summary,.release-panel,.table-panel,.chart-panel { padding:clamp(22px,3vw,34px); }
.mini-kpi-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.mini-kpi { min-height:115px; padding:16px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(145deg,#fbfdff,#f3f7fb); }
.mini-kpi strong,.mini-kpi span,.mini-kpi small { display:block; }
.mini-kpi strong { direction:ltr; text-align:right; color:var(--navy); font-size:1.45rem; line-height:1.15; }
.mini-kpi span { font-size:.78rem; font-weight:900; margin-top:8px; }
.mini-kpi small { color:var(--muted); font-size:.68rem; margin-top:3px; }
.scope-note { margin:16px 0 0; padding:13px 15px; border-radius:12px; background:#fff5e7; color:#70451e; border-right:4px solid var(--orange); font-size:.79rem; }
.overtime-kpi-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.overtime-kpi { min-height:150px; padding:22px; border-radius:16px; background:white; border:1px solid var(--line); }
.overtime-kpi.featured { background:linear-gradient(145deg,var(--navy),var(--navy-2)); color:white; border-color:var(--navy); }
.overtime-kpi strong,.overtime-kpi h3,.overtime-kpi p { display:block; margin:0; }
.overtime-kpi>strong { direction:ltr; text-align:right; color:var(--navy); font-size:1.85rem; line-height:1.15; }
.overtime-kpi.featured>strong { color:var(--gold); }
.overtime-kpi h3 { margin-top:13px; font-size:.86rem; }
.overtime-kpi p { margin-top:5px; color:var(--muted); font-size:.72rem; }
.overtime-kpi.featured p { color:#cbdbe8; }
.overtime-details-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px; }
.overtime-panel { padding:24px; }
.overtime-panel h3 { margin:0 0 15px; color:var(--navy); font-size:1rem; }
.overtime-breakdown-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.overtime-breakdown-item { min-height:88px; padding:15px; border-radius:12px; background:#f7fafc; border:1px solid var(--line); }
.overtime-breakdown-item span,.overtime-breakdown-item strong { display:block; }
.overtime-breakdown-item span { color:var(--muted); font-size:.72rem; }
.overtime-breakdown-item strong { margin-top:6px; direction:ltr; text-align:right; color:#8c4a11; font-size:1.05rem; }
.overtime-policy-list { display:grid; gap:9px; }
.overtime-policy-item { display:grid; grid-template-columns:125px 1fr; gap:12px; align-items:center; min-height:58px; padding:12px 14px; border-radius:12px; background:white; border:1px solid var(--line); }
.overtime-policy-item strong { color:var(--navy); font-size:.75rem; }
.overtime-policy-item span { color:var(--muted); font-size:.73rem; }
.status-badge { padding:.38rem .7rem; border-radius:999px; background:var(--green-soft); color:var(--green); border:1px solid #bce3d4; font-size:.72rem; font-weight:900; direction:ltr; }
.release-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.release-item { padding:13px; border:1px solid var(--line); background:#fbfdff; border-radius:12px; }
.release-item span,.release-item strong { display:block; }
.release-item span { color:var(--muted); font-size:.7rem; }
.release-item strong { direction:ltr; text-align:right; color:var(--navy); font-size:1rem; overflow-wrap:anywhere; }
.qa-details { margin-top:14px; padding:13px 15px; border:1px solid var(--line); border-radius:12px; }
.qa-details summary { cursor:pointer; color:var(--navy); font-weight:900; font-size:.8rem; }
.qa-details ul { margin:.6rem 0 0; padding-right:1.2rem; color:var(--muted); font-size:.76rem; }

.latest-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.latest-card { position:relative; min-height:205px; padding:22px; overflow:hidden; border-radius:16px; background:white; border:1px solid var(--line); }
.latest-card>span { display:inline-block; padding:.25rem .55rem; border-radius:999px; background:var(--orange-soft); color:#864912; font-size:.68rem; font-weight:900; }
.latest-card>strong { display:block; margin:14px 0 8px; color:var(--navy); font-size:1rem; }
.latest-card>p { position:relative; margin:0; color:var(--muted); font-size:.78rem; }
.latest-card>b { position:absolute; left:14px; bottom:4px; color:rgba(11,41,72,.07); font-size:3.5rem; line-height:1; direction:ltr; }
.current-status-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:14px; }
.current-status-item { padding:15px; border-radius:13px; background:var(--navy); color:white; }
.current-status-item.pending { background:#7d4a1b; }
.current-status-item span,.current-status-item strong { display:block; }
.current-status-item span { color:#ffd391; font-size:.68rem; font-weight:900; }
.current-status-item strong { margin-top:6px; color:white; font-size:.76rem; }

.portfolio-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }
.portfolio-card { position:relative; min-height:330px; padding:26px; background:white; border:1px solid rgba(11,41,72,.08); border-radius:18px; box-shadow:0 13px 34px rgba(11,41,72,.06); overflow:hidden; }
.portfolio-card:first-child { background:linear-gradient(150deg,var(--navy),var(--navy-2)); color:white; }
.card-number { position:absolute; left:18px; top:12px; color:rgba(11,41,72,.08); font-size:4.4rem; line-height:1; font-weight:900; direction:ltr; }
.portfolio-card:first-child .card-number { color:rgba(255,255,255,.08); }
.period-label { position:relative; display:inline-block; padding:.25rem .55rem; border-radius:999px; background:#fff2dd; color:#8a4a13; font-size:.66rem; font-weight:900; }
.portfolio-card:first-child .period-label { background:rgba(255,255,255,.12); color:#ffd391; }
.portfolio-card h3 { position:relative; margin:16px 0 9px; color:var(--navy); font-size:1.16rem; }
.portfolio-card:first-child h3 { color:white; }
.portfolio-card p { position:relative; margin:0; color:var(--muted); font-size:.83rem; }
.portfolio-card:first-child p { color:#d4e2ed; }
.portfolio-card ul { position:relative; margin:15px 0 0; padding-right:1.1rem; display:grid; grid-template-columns:1fr 1fr; gap:5px 14px; color:#41576c; font-size:.7rem; }
.portfolio-card:first-child ul { color:#dce8f2; }
.text-link { display:inline-block; margin-top:16px; color:#ffd08a; font-size:.78rem; font-weight:900; text-decoration:none; }

.tinted-section { padding:clamp(24px,4vw,48px); border-radius:26px; background:linear-gradient(145deg,#eaf1f7,#f8fbfd); border:1px solid #d9e5ee; }
.module-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.module-card { display:grid; grid-template-columns:42px 1fr; gap:13px; min-height:152px; padding:19px; border-radius:15px; background:white; border:1px solid var(--line); }
.module-card>span { width:42px; height:42px; display:grid; place-items:center; border-radius:11px; background:var(--navy); color:#ffd08a; font-size:.72rem; font-weight:900; direction:ltr; }
.module-card h3 { margin:1px 0 6px; color:var(--navy); font-size:.98rem; direction:ltr; text-align:right; }
.module-card p { margin:0; color:var(--muted); font-size:.76rem; }

.data-section { align-items:start; }
.table-wrap { max-width:100%; overflow:auto; -webkit-overflow-scrolling:touch; }
table { width:100%; border-collapse:collapse; }
th,td { padding:12px 13px; border-bottom:1px solid var(--line); text-align:right; vertical-align:top; font-size:.77rem; }
th { background:var(--navy); color:white; font-size:.7rem; }
tbody tr:nth-child(even) td { background:#f7fafc; }
.impact-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.impact-item { min-height:92px; padding:15px; border-radius:13px; background:linear-gradient(145deg,var(--navy),var(--navy-2)); color:white; }
.impact-item strong,.impact-item span { display:block; }
.impact-item strong { direction:ltr; text-align:right; color:var(--gold); font-size:1.38rem; }
.impact-item span { color:#d5e3ef; font-size:.72rem; margin-top:5px; }

.portal-tabs { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:12px; }
.portal-tab { min-height:52px; padding:15px; text-align:right; border:1px solid var(--line); border-radius:13px; background:white; color:var(--navy); cursor:pointer; touch-action:manipulation; }
.portal-tab strong,.portal-tab span { display:block; }
.portal-tab strong { font-size:.86rem; }
.portal-tab span { color:var(--muted); font-size:.68rem; }
.portal-tab.active { background:var(--navy); color:white; border-color:var(--navy); }
.portal-tab.active span { color:#cbdce9; }
.portal-panel { padding:clamp(20px,3vw,32px); }
.portal-panel[hidden] { display:none; }
.portal-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:18px; }
.portal-heading h3 { margin:0; color:var(--navy); font-size:1.55rem; }
.portal-heading p { margin:.35rem 0 0; color:var(--muted); font-size:.8rem; }
.portal-heading>strong { direction:ltr; min-width:max-content; color:var(--orange); font-size:1.2rem; }
.portal-table td:first-child { width:19%; }
.portal-table td:last-child { width:100px; }
.state { display:inline-block; min-width:68px; padding:.22rem .5rem; border-radius:999px; text-align:center; font-size:.66rem; font-weight:900; }
.active-state { color:var(--green); background:var(--green-soft); }
.inactive-state { color:var(--red); background:var(--red-soft); }
.work-modules { margin-top:18px; padding:15px; border:1px solid var(--line); border-radius:13px; background:#f8fafc; }
.work-modules summary { cursor:pointer; color:var(--navy); font-size:.8rem; font-weight:900; }
.work-modules div { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.work-modules span { padding:.28rem .55rem; border-radius:999px; background:white; border:1px solid var(--line); color:#3e566e; font-size:.68rem; }

.analytics-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.analytics-grid>.sr-only { position:absolute; }
.wide-chart { grid-column:1/-1; }
.bar-chart { width:100%; height:255px; display:flex; align-items:flex-end; gap:9px; overflow-x:auto; overflow-y:hidden; border-bottom:1px solid var(--line); scrollbar-width:thin; scrollbar-color:#9eb3c7 transparent; -webkit-overflow-scrolling:touch; }
.vertical-bar { flex:1; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:6px; min-width:0; }
.vertical-bar b { color:var(--navy); font-size:.66rem; direction:ltr; white-space:nowrap; }
.vertical-bar .duration-value { font-size:.72rem!important; font-weight:900; }
.vertical-bar .duration-unit { font-size:1em!important; }
.vertical-bar i { width:min(52px,70%); display:block; min-height:5px; border-radius:8px 8px 2px 2px; background:linear-gradient(180deg,var(--orange),#f5bd61); }
.overtime-chart .vertical-bar i { background:linear-gradient(180deg,#174b78,var(--orange)); }
.vertical-bar span { color:var(--muted); font-size:.66rem; }
.category-chart { display:grid; grid-template-columns:1fr 1fr; gap:9px 25px; }
.category-row { display:grid; grid-template-columns:135px 1fr 42px; align-items:center; gap:10px; }
.category-row>span { color:#344b63; font-size:.74rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.category-row>div { height:9px; background:var(--soft); border-radius:999px; overflow:hidden; }
.category-row i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--orange),var(--navy-2)); }
.category-row b { direction:ltr; color:var(--navy); font-size:.7rem; }

.filter-bar { position:sticky; top:90px; z-index:20; display:grid; grid-template-columns:2fr repeat(3,1fr) auto; align-items:end; gap:10px; padding:17px; }
.filter-bar label { display:grid; gap:5px; }
.filter-bar label span { color:var(--muted); font-size:.68rem; font-weight:900; }
.filter-bar input,.filter-bar select { width:100%; min-height:44px; padding:.62rem .75rem; border:1px solid #cbd8e4; border-radius:10px; background:white; color:var(--ink); font-size:.8rem; }
.filter-bar input:focus,.filter-bar select:focus { outline:3px solid rgba(239,143,36,.18); border-color:var(--orange); }
.timeline-list { display:grid; gap:13px; margin-top:14px; }
.day-card { display:grid; grid-template-columns:185px 1fr; overflow:hidden; }
.day-meta { padding:20px; display:flex; flex-direction:column; gap:8px; background:linear-gradient(150deg,var(--navy),var(--navy-2)); color:white; }
.day-meta time { direction:ltr; text-align:right; font-size:.86rem; font-weight:900; }
.day-meta>span { color:#ffd08a; font-size:.7rem; }
.day-meta>strong { margin-top:auto; direction:ltr; text-align:right; color:white; font-size:1.28rem; }
.day-meta>small { color:#cbdbe8; font-size:.68rem; }
.day-meta .day-overtime { color:#ffd08a; font-weight:900; }
.day-content { padding:21px 23px; }
.day-content>h3 { margin:0; color:var(--navy); font-size:1.08rem; }
.day-content>p { margin:.55rem 0 .8rem; color:#41566c; font-size:.84rem; }
.chips { display:flex; flex-wrap:wrap; gap:6px; }
.chips span { padding:.23rem .52rem; border-radius:999px; background:#eaf1f7; color:#2d4d6b; font-size:.66rem; font-weight:800; }
.session-list { display:grid; gap:7px; margin-top:13px; padding-top:11px; border-top:1px dashed var(--line); }
.session-row { display:grid; grid-template-columns:105px minmax(190px,1fr) 70px 100px 125px; align-items:center; gap:9px; padding:9px 10px; border-radius:10px; background:#f7fafc; border:1px solid #e2eaf2; font-size:.69rem; }
.session-row b { color:var(--navy); }
.session-row span { direction:rtl; color:#41576e; }
.session-row strong { direction:ltr; color:#8c4a11; }
.session-row em { padding:.2rem .45rem; border-radius:999px; direction:ltr; text-align:center; font-style:normal; font-weight:900; white-space:nowrap; }
.session-row .duration-value { font-size:.82rem!important; font-weight:900; vertical-align:middle; }
.session-row .duration-unit { font-size:1em!important; }
.day-overtime .duration-value { font-size:.78rem!important; font-weight:900; vertical-align:middle; }
.day-overtime .duration-unit { font-size:1em!important; }
.session-row .full-overtime { color:#8b4210; background:#ffead0; }
.session-row .partial-overtime { color:#8a6412; background:#fff5cf; }
.session-row .no-overtime { color:var(--green); background:var(--green-soft); }
.session-row small { color:var(--muted); }
.deliverables { margin-top:12px; }
.deliverables summary { cursor:pointer; color:var(--navy); font-weight:900; font-size:.73rem; }
.deliverables ul { margin:.6rem 0 0; padding:0 1.1rem 0 0; columns:2; column-gap:28px; }
.deliverables li { break-inside:avoid; margin:.18rem 0; direction:ltr; text-align:left; color:var(--muted); font-size:.68rem; overflow-wrap:anywhere; }
.empty-state { padding:40px; margin-top:14px; text-align:center; color:var(--muted); }

.infrastructure-callout { margin-top:58px; padding:clamp(28px,5vw,58px); display:flex; align-items:center; justify-content:space-between; gap:30px; border-radius:25px; background:radial-gradient(circle at 0 100%,rgba(239,143,36,.25),transparent 34%),linear-gradient(120deg,var(--navy),#174b78); color:white; }
.infrastructure-callout h2 { margin:0; font-size:clamp(1.6rem,2.8vw,2.8rem); }
.infrastructure-callout p { max-width:840px; margin:.7rem 0 0; color:#d2e1ed; }
.callout-actions { display:flex; flex-wrap:wrap; gap:9px; min-width:max-content; }

/* Infrastructure report */
.infra-hero { min-height:480px; }
.infra-hero .hero-scorecard { grid-template-columns:1fr 1fr; }
.metric-wall { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.infra-metric { min-height:145px; padding:21px; border-radius:16px; background:white; border:1px solid rgba(11,41,72,.08); box-shadow:0 12px 32px rgba(11,41,72,.06); }
.infra-metric strong { display:block; direction:ltr; text-align:right; color:var(--navy); font-size:1.85rem; }
.infra-metric span { display:block; margin-top:8px; color:var(--muted); font-size:.75rem; }
.phase-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:13px; }
.infra-phase { padding:23px; border-radius:17px; background:white; border:1px solid var(--line); }
.infra-phase time { display:inline-block; color:#8c4a11; background:#fff1dd; border-radius:999px; padding:.25rem .55rem; font-size:.68rem; font-weight:900; }
.infra-phase h3 { margin:14px 0 8px; color:var(--navy); font-size:1.02rem; }
.infra-phase ul { margin:0; padding-right:1.05rem; color:var(--muted); font-size:.75rem; }
.infra-phase li { margin:.35rem 0; }
.workstream-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.infra-workstream { display:grid; grid-template-columns:48px 1fr; gap:14px; padding:20px; border-radius:15px; background:white; border:1px solid var(--line); }
.infra-workstream span { width:48px; height:48px; display:grid; place-items:center; border-radius:12px; background:var(--navy); color:#ffd08a; font-size:.68rem; font-weight:900; direction:ltr; }
.infra-workstream h3 { margin:0 0 5px; color:var(--navy); font-size:.94rem; direction:ltr; text-align:right; }
.infra-workstream p { margin:0; color:var(--muted); font-size:.76rem; }
.vlan-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:8px; }
.vlan-grid span { min-height:88px; display:flex; align-items:center; justify-content:center; text-align:center; padding:13px; border-radius:13px; background:linear-gradient(145deg,var(--navy),var(--navy-2)); color:white; font-size:.73rem; font-weight:800; }
.outcome-list { display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:0; margin:0; list-style:none; }
.outcome-list li { padding:17px 18px; border-radius:13px; background:white; border:1px solid var(--line); color:#344b62; font-size:.8rem; }
.outcome-list li:before { content:"✓"; display:inline-grid; place-items:center; width:22px; height:22px; margin-left:8px; border-radius:50%; background:var(--green-soft); color:var(--green); font-weight:900; }

footer { padding:28px clamp(18px,4vw,66px); display:flex; justify-content:space-between; gap:20px; background:var(--navy); color:white; font-size:.76rem; }
footer strong,footer span { display:block; }
footer span,footer p { margin:.25rem 0 0; color:#b9ccdd; }

@media (max-width:1180px) {
  .main-nav { display:none; }
  .kpi-grid-4,.metric-wall { grid-template-columns:repeat(2,1fr); }
  .portfolio-grid,.module-grid,.latest-grid { grid-template-columns:repeat(2,1fr); }
  .current-status-grid { grid-template-columns:repeat(2,1fr); }
  .overtime-kpi-grid { grid-template-columns:repeat(2,1fr); }
  .phase-grid { grid-template-columns:repeat(2,1fr); }
  .vlan-grid { grid-template-columns:repeat(4,1fr); }
  .filter-bar { grid-template-columns:2fr 1fr 1fr; }
  .filter-bar label:nth-of-type(4),.filter-bar button { grid-row:2; }
}

@media (max-width:820px) {
  .topbar { position:sticky; top:0; width:100%; max-width:100%; flex-wrap:wrap; gap:8px 12px; min-height:auto; padding:8px max(11px,env(safe-area-inset-right)) 8px max(11px,env(safe-area-inset-left)); overflow:hidden; }
  .brand { flex:1 1 0; gap:8px; min-width:0; overflow:hidden; }
  .brand-mark { width:42px; height:42px; flex:0 0 42px; border-radius:12px; font-size:.78rem; }
  .brand small { display:none; }
  .brand strong { overflow-wrap:anywhere; }
  .compact-button { flex:0 0 auto; min-width:0; min-height:40px; padding:.5rem .72rem; font-size:.72rem; white-space:nowrap; }
  .main-nav { order:3; width:100%; max-width:100%; margin:0 0 -8px; padding:7px 0 9px; display:flex; flex-wrap:nowrap; justify-content:flex-start; gap:7px; overflow-x:auto; overscroll-behavior-inline:contain; scrollbar-width:none; -webkit-overflow-scrolling:touch; touch-action:pan-x pan-y; border-top:1px solid rgba(255,255,255,.1); }
  .main-nav::-webkit-scrollbar { display:none; }
  .main-nav a { flex:0 0 auto; min-height:36px; display:inline-flex; align-items:center; padding:.35rem .7rem; border-radius:999px; background:rgba(255,255,255,.08); font-size:.75rem; }
  main { width:auto; max-width:1500px; margin:10px 9px 46px; }
  .hero { min-height:auto; grid-template-columns:1fr; }
  .hero-copy { padding:34px 24px; }
  .hero-scorecard { min-width:0; border-right:0; border-top:1px solid rgba(255,255,255,.12); }
  .hero-scorecard>div { min-width:0; overflow:hidden; }
  .split-grid,.analytics-grid { grid-template-columns:1fr; }
  .overtime-details-grid { grid-template-columns:1fr; }
  .wide-chart { grid-column:auto; }
  .portal-tabs { grid-template-columns:1fr 1fr; }
  .category-chart { grid-template-columns:1fr; }
  .filter-bar { position:relative; top:auto; grid-template-columns:1fr 1fr; }
  .filter-bar .search-field { grid-column:1/-1; }
  .filter-bar label:nth-of-type(4),.filter-bar button { grid-row:auto; }
  .day-card { grid-template-columns:1fr; }
  .day-meta { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .day-meta>strong { margin:0; }
  .session-row { grid-template-columns:1fr 1fr; }
  .workstream-grid,.outcome-list { grid-template-columns:1fr; }
  .latest-grid,.current-status-grid { grid-template-columns:1fr; }
  .infrastructure-callout { align-items:flex-start; flex-direction:column; }
  .callout-actions { min-width:0; }
  .bar-chart { scroll-snap-type:x proximity; }
  .vertical-bar { flex:0 0 58px; scroll-snap-align:start; }
  .filter-bar input,.filter-bar select { font-size:16px; }
  .responsive-table,.responsive-table tbody,.responsive-table tr,.responsive-table td,
  .portal-table,.portal-table tbody,.portal-table tr,.portal-table td { display:block; width:100%!important; }
  .responsive-table thead,.portal-table thead { display:none; }
  .responsive-table tbody,.portal-table tbody { display:grid; gap:10px; }
  .responsive-table tr,.portal-table tr { overflow:hidden; border:1px solid var(--line); border-radius:13px; background:white; }
  .responsive-table td,.portal-table td { display:grid; grid-template-columns:minmax(86px,32%) minmax(0,1fr); gap:12px; padding:11px 13px; border-bottom:1px solid var(--line); background:white!important; text-align:right; overflow-wrap:anywhere; }
  .responsive-table td:last-child,.portal-table td:last-child { border-bottom:0; }
  .responsive-table td:before,.portal-table td:before { content:attr(data-label); color:var(--navy); font-size:.75rem; font-weight:900; }
}

@media (max-width:560px) {
  .brand strong { max-width:132px; font-size:.75rem; line-height:1.15; }
  .compact-button { min-height:38px; padding:.42rem .62rem; font-size:.68rem; }
  .hero { border-radius:19px; }
  .hero-copy { padding:28px 18px; }
  .hero h1 { font-size:clamp(1.7rem,8vw,2rem); line-height:1.22; }
  .hero-copy>p { font-size:.95rem; }
  .hero-actions { display:grid; grid-template-columns:1fr; margin-top:22px; }
  .owner-line { margin-top:24px!important; }
  .hero-scorecard { grid-template-columns:1fr 1fr; gap:8px; padding:13px; }
  .hero-scorecard div { min-height:105px; padding:13px 10px; border-radius:13px; }
  .hero-scorecard strong { font-size:clamp(1.35rem,6vw,1.75rem); }
  .hero-scorecard strong .duration-value { max-width:100%; gap:.25em; font-size:clamp(1.05rem,4.9vw,1.28rem)!important; }
  .hero-scorecard strong .duration-unit { font-size:.72em!important; }
  .hero-scorecard span { margin-top:7px; font-size:.74rem; }
  .kpi-grid-4,.metric-wall,.mini-kpi-grid,.portfolio-grid,.module-grid,.impact-grid,.phase-grid { grid-template-columns:1fr; }
  .overtime-kpi-grid,.overtime-breakdown-grid { grid-template-columns:1fr; }
  .overtime-policy-item { grid-template-columns:1fr; gap:4px; }
  .content-section { margin-top:38px; scroll-margin-top:132px; }
  .tinted-section { padding:17px 13px; border-radius:18px; }
  .panel { border-radius:15px; }
  .kpi-card,.overtime-kpi,.work-summary,.release-panel,.table-panel,.chart-panel { padding:18px; }
  .section-heading { align-items:flex-start; flex-direction:column; }
  .section-heading.compact-heading { flex-direction:row; align-items:center; }
  .section-heading h2 { font-size:1.4rem; }
  .portal-tabs { grid-template-columns:1fr 1fr; gap:7px; }
  .portal-tab { min-width:0; padding:11px; }
  .portal-tab strong { font-size:.78rem; overflow-wrap:anywhere; }
  .portal-heading { align-items:flex-start; flex-direction:column; }
  .filter-bar { grid-template-columns:1fr; }
  .filter-bar .search-field { grid-column:auto; }
  .day-meta { padding:16px; gap:7px; }
  .day-meta>strong { font-size:1.1rem; }
  .day-content { min-width:0; padding:17px 14px; }
  .session-row { grid-template-columns:1fr; gap:4px; }
  .session-row>* { min-width:0; }
  .session-row strong,.session-row em { justify-self:start; }
  .deliverables ul { columns:1; }
  .vlan-grid { grid-template-columns:1fr 1fr; }
  .category-row { grid-template-columns:minmax(92px,34%) minmax(70px,1fr) 34px; gap:7px; }
  .category-row>span { white-space:normal; line-height:1.35; }
  .infrastructure-callout { padding:24px 18px; }
  .callout-actions { width:100%; }
  .callout-actions .button { width:100%; }
  footer { flex-direction:column; }
}

@media (max-width:360px) {
  .brand strong { max-width:112px; font-size:.68rem; }
  .compact-button { padding:.4rem .5rem; }
  .hero-scorecard strong { font-size:1.28rem; }
  .hero-scorecard strong .duration-value { font-size:1rem!important; }
  .portal-tabs { grid-template-columns:1fr; }
  .responsive-table td,.portal-table td { grid-template-columns:78px minmax(0,1fr); gap:8px; padding:10px; }
}

@media print {
  .topbar,.filter-bar,.hero-actions,.callout-actions { display:none!important; }
  body { background:white; }
  main { width:100%; margin:0; }
  .panel,.kpi-card,.portfolio-card,.infra-metric { box-shadow:none; }
  .hero { border-radius:0; break-after:page; }
  .day-card,.module-card,.portfolio-card { break-inside:avoid; }
}
