/* ======================================================================
   CONSTRUCTION MODULE STYLES
   Styling for المدير للتشييد والبناء (Almodeer for Construction and
   Building): brand header, Egyptian-market theme accents, navigation
   tabs, project switcher, auth screens, and the four construction
   modules (BOQ, Payment Certificates, Cost Control, Daily Site Diary).
   Layered on top of styles.css — reuses its CSS variables and only adds
   new component classes plus a few themed overrides.
====================================================================== */

:root{
  /* Engineering / architectural accent palette, layered alongside the
     existing --accent so the general analytics UI is untouched. */
  --em-slate:#1F2A3D;
  --em-slate-soft:#EAF0F6;
  --em-blueprint:#1B5FA8;
  --em-blueprint-soft:#E7F0FB;
  --em-amber:#C9821A;
  --em-amber-soft:#FBF1E0;
  --em-steel:#5C6470;
  --em-concrete:#8B9199;
  --em-danger:#C23B3B;
  --em-danger-soft:#FBEAEA;
  --em-ok:#138066;
  --em-ok-soft:#E4F5F0;
}

/* ---------- brand header override ---------- */
.brand-mark.em-mark{
  background:var(--em-slate);
  border-radius:6px;
}
.brand-mark.em-mark svg{ width:18px; height:18px; }
.brand-text .em-company-ar{
  font-family:var(--body);
  font-weight:700;
  font-size:16px;
  color:var(--ink);
}
.brand-text .em-company-en{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--ink-faint);
}

/* ---------- primary nav tabs (General Analytics / Projects & BOQ / المستخلصات ...) ---------- */
.em-tabs{
  display:flex; gap:4px; flex-wrap:wrap;
  max-width:1320px; margin:0 auto; padding:0 clamp(16px,4vw,40px);
  border-bottom:1px solid var(--line);
  background:var(--surface);
}
.em-tab{
  display:flex; align-items:center; gap:7px;
  padding:12px 16px; font-size:13px; font-weight:600; color:var(--ink-soft);
  border-bottom:2.5px solid transparent; margin-bottom:-1px;
  background:transparent; border-top:none; border-left:none; border-right:none;
}
.em-tab svg{ width:15px; height:15px; flex-shrink:0; }
.em-tab:hover{ color:var(--ink); }
.em-tab.active{ color:var(--em-blueprint); border-bottom-color:var(--em-blueprint); }
.em-tab-badge{
  font-family:var(--mono); font-size:10px; background:var(--em-danger-soft); color:var(--em-danger);
  border-radius:99px; padding:1px 6px; font-weight:700;
}
.em-tab-panel{ display:none; }
.em-tab-panel.active{ display:block; }

/* ---------- project workspace switcher ---------- */
.em-project-switcher{ position:relative; z-index:100; }
.em-project-switcher-trigger{
  display:flex; align-items:center; gap:8px;
  background:var(--surface-alt); border:1px solid var(--line); border-radius:9px;
  padding:8px 12px; font-size:13px; font-weight:600; color:var(--ink); max-width:260px;
}
.em-project-switcher-trigger svg{ width:12px; height:12px; color:var(--ink-faint); flex-shrink:0; }
.em-project-switcher-name{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.em-project-switcher-menu{
  position:absolute; top:calc(100% + 6px); inset-inline-start:0; width:300px; z-index:9999;
  background:var(--surface); border:1px solid var(--line); border-radius:10px; box-shadow:0 16px 36px rgba(0,0,0,0.22);
  padding:8px; display:none; max-height:360px; overflow-y:auto;
}
.em-project-switcher-menu.open{ display:block; }
.em-project-item{
  display:flex; flex-direction:column; gap:2px; padding:9px 10px; border-radius:7px; cursor:pointer;
}
.em-project-item:hover{ background:var(--surface-alt); }
.em-project-item.active{ background:var(--em-blueprint-soft); }
.em-project-item-name{ font-size:13px; font-weight:600; color:var(--ink); }
.em-project-item-meta{ font-family:var(--mono); font-size:10.5px; color:var(--ink-faint); }
.em-project-item-status{
  display:inline-block; font-size:9.5px; font-family:var(--mono); text-transform:uppercase;
  letter-spacing:0.05em; padding:1px 6px; border-radius:99px; margin-top:2px; width:fit-content;
}
.em-status-active{ background:var(--em-ok-soft); color:var(--em-ok); }
.em-status-planning{ background:var(--em-amber-soft); color:var(--em-amber); }
.em-status-suspended{ background:var(--em-danger-soft); color:var(--em-danger); }
.em-status-completed{ background:var(--em-slate-soft); color:var(--em-slate); }
.em-project-switcher-foot{ border-top:1px solid var(--line); margin-top:6px; padding-top:6px; }
.em-project-switcher-foot button{
  width:100%; text-align:left; background:transparent; border:none; padding:8px 10px;
  font-size:12.5px; color:var(--em-blueprint); font-weight:600; border-radius:7px;
}
.em-project-switcher-foot button:hover{ background:var(--em-blueprint-soft); }

/* ---------- auth screens ---------- */
.em-auth-overlay{
  position:fixed; inset:0; z-index:200; background:var(--em-slate);
  display:flex; align-items:center; justify-content:center; padding:20px;
}
.em-auth-card{
  width:100%; max-width:400px; background:var(--surface); border-radius:16px;
  padding:36px 32px; box-shadow:0 20px 60px rgba(0,0,0,0.35);
}
.em-auth-brand{ display:flex; flex-direction:column; align-items:center; gap:10px; margin-bottom:26px; text-align:center; }
.em-auth-brand .brand-mark{ width:44px; height:44px; }
.em-auth-brand .brand-mark svg{ width:24px; height:24px; }
.em-auth-brand h2{ font-size:18px; font-weight:700; margin:0; }
.em-auth-brand p{ font-family:var(--mono); font-size:11px; color:var(--ink-faint); margin:0; text-transform:uppercase; letter-spacing:0.05em; }
.em-auth-tabs{ display:flex; gap:4px; background:var(--surface-alt); border-radius:9px; padding:3px; margin-bottom:20px; }
.em-auth-tab{
  flex:1; padding:8px; border-radius:7px; background:transparent; border:none; font-size:13px; font-weight:600; color:var(--ink-soft);
}
.em-auth-tab.active{ background:var(--surface); color:var(--ink); box-shadow:var(--shadow-sm); }
.em-auth-form{ display:flex; flex-direction:column; gap:14px; }
.em-auth-form label{ font-size:12.5px; font-weight:600; color:var(--ink-soft); margin-bottom:5px; display:block; }
.em-auth-form input, .em-auth-form select{
  width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:8px; font-size:14px;
}
.em-auth-error{ color:var(--em-danger); font-size:12.5px; display:none; }
.em-auth-error.show{ display:block; }
.em-auth-submit{ width:100%; justify-content:center; margin-top:4px; }
.em-auth-foot{ margin-top:18px; text-align:center; font-size:12px; color:var(--ink-faint); }

/* ---------- generic module scaffolding ---------- */
.em-module-empty{
  border:1px dashed var(--line-strong); border-radius:var(--radius); padding:48px 28px;
  text-align:center; color:var(--ink-faint); font-size:13px; background:var(--surface-alt);
}
.em-module-toolbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
.em-module-toolbar-right{ display:flex; gap:8px; flex-wrap:wrap; }

/* ---------- BOQ grid ---------- */
.em-boq-table-wrap{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm);
}
table.em-boq-table{ width:100%; border-collapse:collapse; font-size:13px; }
table.em-boq-table thead th{
  position:sticky; top:0; background:var(--surface-alt); text-align:left; padding:10px 12px;
  font-family:var(--mono); font-size:10.5px; letter-spacing:0.05em; text-transform:uppercase; color:var(--ink-soft);
  border-bottom:1px solid var(--line); white-space:nowrap;
}
table.em-boq-table td{ padding:9px 12px; border-bottom:1px solid var(--line); vertical-align:middle; }
table.em-boq-table td.is-num{ font-family:var(--mono); text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
table.em-boq-table tbody tr:hover{ background:var(--surface-alt); }
.em-progress-cell{ display:flex; align-items:center; gap:8px; min-width:120px; }
.em-progress-track{ flex:1; height:7px; border-radius:99px; background:var(--line); overflow:hidden; }
.em-progress-fill{ height:100%; border-radius:99px; background:var(--em-blueprint); }
.em-progress-fill.over{ background:var(--em-danger); }
.em-progress-fill.complete{ background:var(--em-ok); }
.em-progress-pct{ font-family:var(--mono); font-size:11px; color:var(--ink-soft); min-width:34px; text-align:right; }
.em-badge{
  display:inline-flex; align-items:center; gap:4px; font-size:10.5px; font-family:var(--mono);
  font-weight:700; padding:2px 7px; border-radius:99px; text-transform:uppercase; letter-spacing:0.03em;
}
.em-badge-over{ background:var(--em-danger-soft); color:var(--em-danger); }
.em-badge-ok{ background:var(--em-ok-soft); color:var(--em-ok); }
.em-badge-warn{ background:var(--em-amber-soft); color:var(--em-amber); }

/* ---------- certificate wizard ---------- */
.em-cert-wizard{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:20px; align-items:start; }
@media (max-width:920px){ .em-cert-wizard{ grid-template-columns:1fr; } }
.em-cert-panel{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:20px; box-shadow:var(--shadow-sm);
}
.em-cert-panel h3{ font-size:14px; margin-bottom:14px; }
.em-cert-row{ display:flex; justify-content:space-between; align-items:center; padding:9px 0; border-bottom:1px solid var(--line); font-size:13px; }
.em-cert-row:last-child{ border-bottom:none; }
.em-cert-row-label{ color:var(--ink-soft); }
.em-cert-row-value{ font-family:var(--mono); font-weight:600; font-variant-numeric:tabular-nums; }
.em-cert-row.deduction .em-cert-row-value{ color:var(--em-danger); }
.em-cert-row.total{ border-top:2px solid var(--ink); margin-top:6px; padding-top:12px; font-size:15px; }
.em-cert-row.total .em-cert-row-value{ color:var(--em-blueprint); font-size:17px; }
.em-cert-status-pill{
  font-family:var(--mono); font-size:10.5px; text-transform:uppercase; padding:3px 9px; border-radius:99px; font-weight:700;
}
.em-cert-status-draft{ background:var(--em-slate-soft); color:var(--em-slate); }
.em-cert-status-submitted{ background:var(--em-amber-soft); color:var(--em-amber); }
.em-cert-status-approved{ background:var(--em-blueprint-soft); color:var(--em-blueprint); }
.em-cert-status-paid{ background:var(--em-ok-soft); color:var(--em-ok); }
.em-cert-list-item{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:12px 14px; border:1px solid var(--line); border-radius:10px; margin-bottom:8px; background:var(--surface);
}

/* ---------- cost control ---------- */
.em-variance-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; }
.em-variance-card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:18px; box-shadow:var(--shadow-sm);
}
.em-variance-card-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.em-variance-material{ font-weight:700; font-size:13.5px; }
.em-variance-delta{ font-family:var(--mono); font-size:12px; font-weight:700; }
.em-variance-delta.up{ color:var(--em-danger); }
.em-variance-delta.down{ color:var(--em-ok); }
.em-variance-prices{ display:flex; align-items:baseline; gap:8px; font-family:var(--mono); }
.em-variance-price-old{ font-size:13px; color:var(--ink-faint); text-decoration:line-through; }
.em-variance-price-new{ font-size:19px; font-weight:700; }

/* ---------- daily site diary ---------- */
.em-diary-form-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
@media (max-width:700px){ .em-diary-form-grid{ grid-template-columns:1fr; } }
.em-diary-entry{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:16px 18px; margin-bottom:10px; box-shadow:var(--shadow-sm);
}
.em-diary-entry-head{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:8px; }
.em-diary-date{ font-weight:700; font-size:14px; }
.em-diary-weather{ font-family:var(--mono); font-size:11.5px; color:var(--ink-faint); }
.em-diary-chips{ display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.em-diary-chip{
  font-family:var(--mono); font-size:11px; background:var(--surface-alt); border:1px solid var(--line);
  border-radius:99px; padding:3px 9px; color:var(--ink-soft);
}

/* ---------- executive dashboard ---------- */
.em-exec-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; margin-bottom:22px; }
.em-exec-card{
  background:var(--em-slate); color:#fff; border-radius:var(--radius); padding:20px; position:relative; overflow:hidden;
}
.em-exec-card-label{ font-family:var(--mono); font-size:10.5px; text-transform:uppercase; letter-spacing:0.06em; opacity:0.65; margin-bottom:10px; }
.em-exec-card-value{ font-family:var(--mono); font-size:26px; font-weight:700; }
.em-exec-card-sub{ font-size:11.5px; opacity:0.7; margin-top:6px; }
.em-exec-project-row{
  display:flex; align-items:center; gap:14px; padding:12px 14px; border:1px solid var(--line); border-radius:10px; margin-bottom:8px; background:var(--surface);
}
.em-exec-project-row .em-progress-track{ width:120px; }

/* ---------- templates modal ---------- */
.em-modal-overlay{
  position:fixed; inset:0; z-index:150; background:rgba(20,23,31,0.55);
  display:flex; align-items:center; justify-content:center; padding:20px;
}
.em-modal{
  width:100%; max-width:560px; max-height:80vh; overflow-y:auto;
  background:var(--surface); border-radius:16px; padding:28px; box-shadow:0 20px 60px rgba(0,0,0,0.3);
}
.em-modal-head{ display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:18px; }
.em-modal-close{ background:transparent; border:none; color:var(--ink-faint); padding:4px; }
.em-template-item{
  display:flex; align-items:center; gap:12px; padding:13px 14px; border:1px solid var(--line);
  border-radius:10px; margin-bottom:8px;
}
.em-template-icon{
  width:34px; height:34px; border-radius:8px; background:var(--em-ok-soft); color:var(--em-ok);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.em-template-icon svg{ width:17px; height:17px; }
.em-template-name{ font-weight:600; font-size:13px; }
.em-template-desc{ font-size:11.5px; color:var(--ink-faint); }
.em-template-download{
  margin-left:auto; background:transparent; border:1px solid var(--line-strong); border-radius:8px; padding:6px 12px; font-size:12px; font-weight:600; color:var(--ink);
}
.em-template-download:hover{ border-color:var(--em-blueprint); color:var(--em-blueprint); }
body.rtl .em-template-download{ margin-left:0; margin-right:auto; }

/* ---------- print: official stamped report ---------- */
.em-print-official-header{ display:none; }
@media print{
  .em-print-official-header{
    display:flex; justify-content:space-between; align-items:flex-start;
    border-bottom:3px double var(--em-slate); padding-bottom:14px; margin-bottom:18px;
  }
  .em-print-official-header .em-company-block{ display:flex; flex-direction:column; gap:2px; }
  .em-print-official-header .em-company-ar{ font-size:17px; font-weight:700; }
  .em-print-official-header .em-company-en{ font-size:11px; color:#555; }
  .em-print-official-header .em-print-meta{ text-align:right; font-size:11px; color:#333; }
  .em-print-signoff{
    display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:40px; padding-top:14px;
  }
  .em-print-signoff-block{ text-align:center; font-size:11px; }
  .em-print-signoff-line{ border-top:1px solid #333; margin-top:44px; padding-top:5px; }
  .em-print-stamp-slot{
    width:110px; height:110px; border:1.5px dashed #999; border-radius:50%;
    display:flex; align-items:center; justify-content:center; margin:0 auto 6px;
    font-size:9.5px; color:#999; text-align:center; padding:6px;
  }
}

/* ---------- corporate topbar ---------- */
.em-topbar{
  background: var(--em-slate);
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  font-size: 11.5px;
  padding: 7px 0;
}
.em-topbar-inner{
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 clamp(16px, 4vw, 40px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
}
.em-topbar-left, .em-topbar-right{
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.em-slogan-primary{
  font-weight: 700;
  color: #f3a93b;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.em-slogan-secondary{
  color: rgba(255,255,255,0.85);
}
.em-badge-est{
  background: rgba(255,255,255,0.12);
  padding: 1px 7px;
  border-radius: 99px;
  font-size: 10.5px;
  font-family: var(--mono);
}
.em-topbar-dot{
  color: rgba(255,255,255,0.3);
}
.em-topbar-link{
  color: rgba(255,255,255,0.9);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: color 0.15s ease;
  direction: ltr;
}
.em-topbar-link:hover{
  color: #f3a93b;
}

/* ---------- company profile & showcase (panelAbout) ---------- */
.em-about-hero{
  background: linear-gradient(135deg, var(--surface) 0%, var(--surface-alt) 100%);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: clamp(24px, 4vw, 36px);
  margin-bottom: 24px;
  position: relative;
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.em-about-hero::before{
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 6px;
  height: 100%;
  background: linear-gradient(to bottom, var(--em-amber), var(--em-blueprint));
}
.em-about-eyebrow{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.em-about-badge{
  background: var(--em-amber-soft);
  color: var(--em-amber);
  font-weight: 700;
  font-size: 11.5px;
  padding: 3px 10px;
  border-radius: 99px;
}
.em-about-title{
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 800;
  color: var(--ink);
  margin: 0 0 8px 0;
  line-height: 1.3;
}
.em-about-slogans{
  font-size: clamp(14px, 1.8vw, 16px);
  color: var(--em-blueprint);
  font-weight: 700;
  margin-bottom: 16px;
}
.em-about-story{
  font-size: 14.5px;
  line-height: 1.8;
  color: var(--ink-soft);
  max-width: 960px;
  margin-bottom: 20px;
}
.em-about-stats{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 14px;
  margin-top: 20px;
}
.em-about-stat-box{
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px 16px;
}
.em-about-stat-num{
  font-size: 22px;
  font-weight: 800;
  font-family: var(--mono);
  color: var(--ink);
  direction: ltr;
  text-align: center;
}
.em-about-stat-lbl{
  font-size: 12px;
  color: var(--ink-faint);
  margin-top: 4px;
  text-align: center;
}

/* Core Values Grid */
.em-values-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px;
  margin-bottom: 26px;
}
.em-value-card{
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 20px;
  transition: transform 0.2s ease, border-color 0.2s ease;
}
.em-value-card:hover{
  transform: translateY(-2px);
  border-color: var(--em-blueprint);
}
.em-value-icon{
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--em-blueprint-soft);
  color: var(--em-blueprint);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
}
.em-value-title{
  font-size: 15.5px;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 6px;
}
.em-value-desc{
  font-size: 13px;
  color: var(--ink-soft);
  line-height: 1.6;
}

/* 4 Sectors Grid */
.em-sectors-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
  margin-bottom: 26px;
}
.em-sector-card{
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.em-sector-badge{
  font-size: 11px;
  font-weight: 700;
  color: var(--em-amber);
  background: var(--em-amber-soft);
  padding: 2px 8px;
  border-radius: 6px;
  width: fit-content;
}
.em-sector-title{
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
}
.em-sector-desc{
  font-size: 12.5px;
  color: var(--ink-soft);
  line-height: 1.5;
}

/* Capabilities Chips */
.em-capabilities-grid{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 26px;
}
.em-capability-chip{
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 30px;
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  box-shadow: var(--shadow-sm);
}
.em-capability-chip svg{
  color: var(--em-ok);
  width: 15px;
  height: 15px;
  flex-shrink: 0;
}

/* Mega Projects Case Studies */
.em-projects-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
  gap: 20px;
  margin-bottom: 28px;
}
@media (max-width: 640px){
  .em-projects-grid{
    grid-template-columns: 1fr;
    gap: 16px;
  }
}
.em-project-card{
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: var(--shadow-sm);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.em-project-card:hover{
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
  border-color: var(--em-blueprint);
}
.em-project-head{
  margin-bottom: 12px;
}
.em-project-size{
  display: inline-block;
  background: var(--em-ok-soft);
  color: var(--em-ok);
  font-weight: 700;
  font-size: 12px;
  padding: 3px 10px;
  border-radius: 99px;
  margin-bottom: 10px;
}
.em-project-title{
  font-size: 18px;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 4px;
}
.em-project-loc{
  font-size: 12.5px;
  color: var(--ink-faint);
  display: flex;
  align-items: center;
  gap: 5px;
}
.em-project-scope-list{
  margin: 14px 0 18px 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.em-project-scope-item{
  font-size: 12.5px;
  color: var(--ink-soft);
  line-height: 1.5;
  display: flex;
  align-items: flex-start;
  gap: 7px;
}
.em-project-scope-item svg{
  width: 14px;
  height: 14px;
  color: var(--em-blueprint);
  flex-shrink: 0;
  margin-top: 3px;
}
.em-project-cta{
  display: flex;
  gap: 10px;
  align-items: center;
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

/* Enhanced Corporate Footer */
.em-footer{
  background: var(--em-slate);
  color: #fff;
  padding: 40px 0 24px;
  margin-top: 60px;
  border-top: 3px solid var(--em-amber);
}
.em-footer-inner{
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 clamp(16px, 4vw, 40px);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 30px;
  margin-bottom: 30px;
}
.em-footer-brand h3{
  font-size: 18px;
  font-weight: 800;
  color: #fff;
  margin: 0 0 6px;
}
.em-footer-brand p{
  font-size: 12.5px;
  color: rgba(255,255,255,0.7);
  line-height: 1.6;
}
.em-footer-col h4{
  font-size: 13.5px;
  font-weight: 700;
  color: #f3a93b;
  margin: 0 0 12px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.em-footer-links{
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 12.5px;
}
.em-footer-links a{
  color: rgba(255,255,255,0.85);
  text-decoration: none;
  transition: color 0.15s;
}
.em-footer-links a:hover{
  color: #f3a93b;
}
.em-footer-bottom{
  max-width: 1320px;
  margin: 0 auto;
  padding: 20px clamp(16px, 4vw, 40px) 0;
  border-top: 1px solid rgba(255,255,255,0.1);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 11.5px;
  color: rgba(255,255,255,0.6);
}

/* ======================================================================
   DROPZONE 1-CLICK PRESET WIZARD (FOR NON-TECHNICAL CLIENTS)
====================================================================== */
.em-preset-wizard{
  margin-top: 28px;
  border-top: 1px dashed var(--line);
  padding-top: 20px;
  width: 100%;
}
.em-preset-title{
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-faint);
  margin-bottom: 14px;
  text-align: center;
}
.em-preset-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
  width: 100%;
}
.em-preset-card{
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px;
  text-align: right;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
}
.em-preset-card:hover{
  transform: translateY(-2px);
  border-color: var(--em-amber);
  box-shadow: 0 8px 20px rgba(0,0,0,0.12);
  background: var(--surface-hover);
}
.em-preset-badge{
  display: inline-block;
  font-size: 10.5px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 4px;
  background: rgba(37,65,178,0.12);
  color: var(--em-blueprint);
  margin-bottom: 8px;
  width: fit-content;
}
.em-preset-badge.em-badge-alt{
  background: rgba(229,169,60,0.15);
  color: var(--em-amber);
}
.em-preset-name{
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 6px;
  line-height: 1.4;
}
.em-preset-meta{
  font-size: 11.5px;
  color: var(--ink-faint);
  line-height: 1.5;
  margin-bottom: 12px;
}
.em-preset-action{
  font-size: 11.5px;
  font-weight: 600;
  color: var(--em-amber);
  margin-top: auto;
}

/* ======================================================================
   VIEW MODE SWITCHER (OWNER VS ENGINEER PRO)
====================================================================== */
.em-view-mode-bar{
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}
.em-view-mode-tabs{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 99px;
  padding: 4px;
}
.em-view-mode-btn{
  border: none;
  background: transparent;
  color: var(--ink-faint);
  padding: 6px 14px;
  border-radius: 99px;
  font-family: var(--body);
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.15s ease;
}
.em-view-mode-btn.active{
  background: var(--em-blueprint);
  color: #fff;
  box-shadow: 0 2px 8px rgba(37,65,178,0.3);
}

/* ======================================================================
   SMART NATURAL LANGUAGE EXECUTIVE DIGEST
====================================================================== */
.em-smart-digest{
  background: linear-gradient(135deg, rgba(37,65,178,0.06) 0%, rgba(229,169,60,0.08) 100%);
  border: 1px solid rgba(229,169,60,0.25);
  border-radius: 14px;
  padding: 22px 24px;
  margin-bottom: 24px;
  position: relative;
  overflow: hidden;
}
.em-digest-head{
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 12px;
}
.em-digest-title-row{
  display: flex;
  align-items: center;
  gap: 10px;
}
.em-digest-live-indicator{
  font-size: 11px;
  font-weight: 700;
  color: var(--em-ok);
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: rgba(19,128,102,0.1);
  padding: 2px 8px;
  border-radius: 99px;
}
.em-pulse-dot{
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--em-ok);
  animation: pulseDot 1.8s infinite;
}
@keyframes pulseDot{
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.4); opacity: 0.5; }
}
.em-digest-title{
  font-family: var(--display);
  font-size: 17px;
  font-weight: 700;
  color: var(--ink);
  margin: 0;
}
.em-digest-badge{
  font-size: 11.5px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 6px;
  font-family: var(--body);
}
.em-digest-narrative{
  font-size: 14px;
  line-height: 1.8;
  color: var(--ink);
  margin: 0 0 16px;
}
.em-digest-quick-stats{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.em-digest-stat-pill{
  background: var(--surface);
  border: 1px solid var(--line);
  padding: 6px 12px;
  border-radius: 8px;
  font-size: 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.em-digest-stat-pill span{
  color: var(--ink-faint);
}

/* ======================================================================
   ADVANCED PRO ANALYTICS WRAPPER
====================================================================== */
.em-pro-analytics-wrapper{
  border-top: 2px dashed var(--line);
  padding-top: 24px;
  margin-top: 24px;
}
.em-pro-header{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  padding: 10px 14px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
}