/* ── compat.css ──
   Component-specific CSS for roles-equipo pages.
   Loaded AFTER global.css so it overrides base styles cleanly.
   Does NOT include: body, html, *, .badge base, .navbar, .header, .footer.
   ─────────────────────────────────────────────────────────────────── */

:root {
  --primary:       #7a0f2f;
  --secondary:     #b8892f;
  --success:       #0f766e;
  --warning:       #d9a441;
  --danger:        #dc2626;
  --info:          #7c2d55;
  --color-pm:      #7a0f2f;
  --color-tl:      #9f1239;
  --color-analyst: #b8892f;
  --color-frontend:#7c2d55;
  --color-backend: #4b0618;
  --color-qa:      #a8551d;
  --color-devops:  #64748b;
  --gray-50:  #f9fafb;  --gray-100: #f3f4f6;  --gray-200: #e5e7eb;
  --gray-300: #d1d5db;  --gray-400: #9ca3af;  --gray-500: #6b7280;
  --gray-600: #4b5563;  --gray-700: #374151;  --gray-800: #1f2937;
  --gray-900: #111827;
  --shadow-sm: 0 1px 2px 0 rgba(0,0,0,.05);
  --shadow-md: 0 4px 12px -2px rgba(75,6,24,.12);
  --shadow-lg: 0 14px 28px -8px rgba(75,6,24,.18);
  --shadow-xl: 0 24px 40px -12px rgba(75,6,24,.20);
  --transition-fast:   all 0.15s ease-in-out;
  --transition-normal: all 0.3s ease-in-out;
  --card-padding-sm: 1.25rem;
  --card-padding-md: 1.5rem;
}

.sr-only {
  border:0; clip:rect(0,0,0,0); height:1px; margin:-1px;
  overflow:hidden; padding:0; position:absolute; white-space:nowrap; width:1px;
}

/* ── Section description (subtitle below h2) ───────────────────── */
.section-description {
  color: var(--gray-500);
  margin-bottom: 1.5rem;
  font-size: 0.97rem;
}

/* ── Badge variants (styles.css naming — not conflicting with global.css) ── */
.badge-primary   { background: var(--primary);    color: #fff; }
.badge-secondary { background: var(--secondary);  color: #fff; }
.badge-success   { background: var(--success);    color: #fff; }
.badge-warning   { background: var(--warning);    color: #fff; }
.badge-danger    { background: var(--danger);     color: #fff; }
.badge-info      { background: var(--info);       color: #fff; }
.badge-neutral   { background: var(--gray-400);   color: #fff; }
.badge-status-pending { background:#fef3c7; color:#92400e; border:1px solid #fcd34d; }
.badge-status-active  { background:#dbeafe; color:#1e40af; border:1px solid #93c5fd; }
.badge-status-done    { background:#d1fae5; color:#065f46; border:1px solid #6ee7b7; }
.badge-status-blocked { background:#fee2e2; color:#991b1b; border:1px solid #fca5a5; }

/* ── Page link cards (index.html) ──────────────────────────────── */
.page-links {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin: 1.5rem 0 2rem;
}
.page-link-card {
  background: linear-gradient(135deg,#fff9fb,#ffffff);
  border: 1px solid var(--gray-200);
  border-top: 5px solid var(--secondary);
  border-radius: 12px;
  box-shadow: var(--shadow-sm);
  color: inherit;
  display: block;
  padding: 1.25rem;
  text-decoration: none;
  transition: var(--transition-normal);
}
.page-link-card:hover {
  background: linear-gradient(135deg,#fff0f5,#fff7fa);
  border-top-color: var(--primary);
  box-shadow: var(--shadow-lg);
  transform: translateY(-4px);
}
.page-link-card strong {
  color: var(--primary);
  display: flex; align-items: center; gap: .65rem;
  font-size: 1.05rem; margin-bottom: .45rem;
}
.page-link-card span { color: var(--gray-600); display: block; font-size: .94rem; line-height: 1.55; }

/* ── Detail hero ───────────────────────────────────────────────── */
.detail-hero {
  background: radial-gradient(circle at right top,rgba(184,137,47,.18),transparent 16rem),
              linear-gradient(135deg,#fff7fa 0%,#ffffff 100%);
  border: 1px solid var(--gray-200);
  border-left: 6px solid var(--primary);
  border-radius: 14px;
  margin-bottom: 2rem;
  padding: clamp(1.5rem,3vw,2.5rem);
}
.detail-hero__eyebrow {
  color: var(--secondary);
  display: inline-flex; align-items: center; gap: .5rem;
  font-size: .82rem; font-weight: 900; letter-spacing: .4px;
  margin-bottom: .8rem; text-transform: uppercase;
}
.detail-hero h2 {
  color: var(--primary);
  font-size: clamp(1.4rem,3vw,2rem);
  border: none; padding: 0; margin-bottom: .8rem; margin-top: 0;
}
.detail-hero p { color: var(--gray-600); font-size: 1rem; line-height: 1.7; max-width: 78ch; }

/* ── Detail grid & cards ────────────────────────────────────────── */
.detail-grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  margin-bottom: 2rem;
}
.detail-card {
  background: #fff;
  border: 1px solid var(--gray-200);
  border-radius: 12px;
  box-shadow: var(--shadow-sm);
  padding: var(--card-padding-md);
  transition: var(--transition-normal);
}
.detail-card:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); border-color: var(--gray-300); }
.detail-card--accent  { border-top: 5px solid var(--secondary); }
.detail-card--success { border-top: 5px solid var(--success); }
.detail-card--danger  { border-top: 5px solid var(--danger); }
.detail-card--info    { border-top: 5px solid var(--info); }
.detail-card--neutral { border-top: 5px solid var(--gray-300); }
.detail-card h3 { color: var(--primary); display:flex; align-items:center; gap:.65rem; font-size:1.1rem; margin-bottom:.85rem; margin-top:0; }
.detail-card p  { color: var(--gray-700); margin-bottom: .8rem; }
.detail-card ul { list-style: none; padding: 0; }
.detail-card li { color: var(--gray-700); padding: .45rem 0 .45rem 1.5rem; position: relative; }
.detail-card li::before { color: var(--secondary); content: "•"; font-size: 1.1rem; left: 0; position: absolute; top: .38rem; }

/* ── Detail table ───────────────────────────────────────────────── */
.detail-table-wrap {
  background: #fff;
  border: 1px solid var(--gray-200);
  border-radius: 12px;
  box-shadow: var(--shadow-sm);
  margin-bottom: 2rem;
  overflow-x: auto;
}
.detail-table { border-collapse: collapse; min-width: 760px; width: 100%; }
.detail-table th, .detail-table td {
  border-bottom: 1px solid var(--gray-200);
  padding: .95rem 1rem;
  text-align: left;
  vertical-align: top;
}
.detail-table th { background: #fff7fa; color: var(--primary); font-size: .9rem; font-weight: 800; }
.detail-table tbody tr:nth-child(even) { background: #fff7fa; }
.detail-table tbody tr:hover { background: #fde8f1; }

/* ── Detail actions ─────────────────────────────────────────────── */
.detail-actions { display: flex; flex-wrap: wrap; gap: .9rem; }
.detail-action {
  align-items: center;
  background: #fff;
  border: 2px solid #e5bdca;
  border-radius: 10px;
  color: var(--primary);
  display: inline-flex;
  font-weight: 800;
  gap: .6rem;
  padding: .8rem 1rem;
  text-decoration: none;
  transition: var(--transition-fast);
  font: inherit;
}
.detail-action:hover { background: #fff7fa; border-color: var(--primary); box-shadow: var(--shadow-md); transform: translateY(-2px); color: var(--primary); }
.detail-action--sm   { font-size: .8rem; padding: .5rem .8rem; }

/* ── Gantt ──────────────────────────────────────────────────────── */
.gantt-wrap {
  border: 1px solid var(--gray-200);
  border-radius: 8px;
  background: var(--gray-50);
  margin: 1.5rem 0;
  overflow-x: auto;
  padding: 1rem;
}
.mermaid { min-width: 600px; }

/* ── Phase badges ───────────────────────────────────────────────── */
.phase-badge {
  border-radius: 20px; display: inline-block; font-size: .73rem;
  font-weight: 700; letter-spacing: .5px; padding: .2rem .6rem; text-transform: uppercase;
}
.phase-badge--s0 { background: var(--gray-200); color: var(--gray-700); }
.phase-badge--f1 { background: #dbeafe; color: #1e40af; }
.phase-badge--f2 { background: #d1fae5; color: #065f46; }
.phase-badge--f3 { background: #ede9fe; color: #5b21b6; }
.phase-badge--f4 { background: #fef3c7; color: #92400e; }
.phase-badge--f5 { background: #fee2e2; color: #991b1b; }
.phase-badge--f6 { background: #fce7f3; color: #9d174d; }

.hito-row { background: #fff7fa; }
.hito-row td { font-weight: 600; color: var(--primary); }

/* ── OpenProject Gantt CTA ──────────────────────────────────────── */
.op-gantt-cta {
  align-items: center;
  background: linear-gradient(135deg,#fdf2f8,#fce7f3);
  border: 1px solid #fbcfe8;
  border-radius: 10px;
  color: var(--primary);
  display: flex; font-weight: 700; gap: 1rem;
  margin-top: 1.5rem; padding: 1.25rem 1.5rem;
  text-decoration: none; transition: var(--transition-fast);
}
.op-gantt-cta:hover { background: linear-gradient(135deg,#fce7f3,#fbcfe8); box-shadow: var(--shadow-md); color: #4b0618; }
.op-gantt-cta i { font-size: 1.5rem; }
.op-gantt-cta__text { display: flex; flex-direction: column; gap: .2rem; }
.op-gantt-cta__sub  { font-size: .8rem; font-weight: 400; opacity: .75; }

/* ── Module labels ──────────────────────────────────────────────── */
.module-label { align-items: center; display: inline-flex; font-size: .75rem; font-weight: 700; gap: 5px; }
.module-label--web        { color: #1d4ed8; }
.module-label--asistencia { color: #15803d; }
.module-label--inventario { color: #b45309; }

/* ── Semáforo de riesgos ────────────────────────────────────────── */
.semaforo-grid {
  display: grid;
  gap: 1.1rem;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  margin: 1.5rem 0;
}
.semaforo-card {
  align-items: flex-start; border-left: 6px solid; border-radius: 10px;
  box-shadow: var(--shadow-sm); display: flex; gap: 1rem;
  padding: 1rem 1.1rem; transition: var(--transition-fast);
}
.semaforo-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.semaforo-card__dot { border-radius: 50%; flex-shrink:0; height:16px; margin-top:4px; width:16px; }
.semaforo-card--critico { background:#fef2f2; border-left-color:#dc2626; }
.semaforo-card--critico .semaforo-card__dot { background:#dc2626; }
.semaforo-card--alto    { background:#fff7ed; border-left-color:#ea580c; }
.semaforo-card--alto    .semaforo-card__dot { background:#ea580c; }
.semaforo-card--medio   { background:#fefce8; border-left-color:#ca8a04; }
.semaforo-card--medio   .semaforo-card__dot { background:#ca8a04; }
.semaforo-card--bajo    { background:#f0fdf4; border-left-color:#16a34a; }
.semaforo-card--bajo    .semaforo-card__dot { background:#16a34a; }
.semaforo-card__body h4 { color:var(--gray-800); font-size:.88rem; font-weight:700; margin-bottom:.2rem; margin-top:0; }
.semaforo-card__body p  { color:var(--gray-500); font-size:.78rem; margin:0; }

/* ── Risk level badges ──────────────────────────────────────────── */
.risk-level-badge { border-radius:4px; display:inline-block; font-size:.7rem; font-weight:700; letter-spacing:.5px; padding:.15rem .45rem; }
.risk-level-badge--critico { background:#fca5a5; color:#7f1d1d; }
.risk-level-badge--alto    { background:#fdba74; color:#7c2d12; }
.risk-level-badge--medio   { background:#fde68a; color:#78350f; }
.risk-level-badge--bajo    { background:#bbf7d0; color:#14532d; }

.risk-matrix-wrap { border-radius:8px; margin:1.5rem 0; overflow-x:auto; }

/* ── Cost tables ────────────────────────────────────────────────── */
.cost-table          { border-radius:8px; margin:1.5rem 0; overflow-x:auto; }
.cost-table table    { border-collapse:collapse; font-size:.85rem; min-width:680px; width:100%; }
.cost-table th       { background:var(--primary); color:#fff; font-size:.78rem; font-weight:700; letter-spacing:.4px; padding:.55rem .8rem; text-align:center; }
.cost-table th:first-child, .cost-table th:nth-child(2) { text-align:left; }
.cost-table td       { border-bottom:1px solid var(--gray-200); padding:.5rem .8rem; text-align:center; }
.cost-table td:first-child, .cost-table td:nth-child(2) { text-align:left; }
.cost-table tr:nth-child(even) td { background:var(--gray-50); }
.cost-table tr:hover td { background:#fff7fa; }
.cost-table .total-row td { background:var(--gray-100)!important; border-top:2px solid var(--primary); color:var(--primary); font-weight:700; }
.cost-table .total-row small { color:var(--primary); display:block; font-size:.72rem; font-weight:600; }
.cost-table .hours-zero { color:var(--gray-300); font-size:.75rem; }
.cost-table .hours-val  { font-variant-numeric:tabular-nums; font-weight:600; }
.cost-val   { color:var(--primary); font-variant-numeric:tabular-nums; font-weight:700; white-space:nowrap; }
.cost-intro { color:var(--gray-500); font-size:.88rem; margin-bottom:1.25rem; }

/* ── Budget summary ─────────────────────────────────────────────── */
.budget-summary {
  display:grid; gap:.85rem;
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  margin:1.25rem 0 1.75rem;
}
.budget-card { background:var(--gray-50); border:1px solid var(--gray-200); border-radius:10px; padding:1rem 1.2rem; }
.budget-card--total { background:linear-gradient(135deg,#fff7fa,#fce7f3); border-color:#fbcfe8; }
.budget-card__label { color:var(--gray-500); font-size:.73rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
.budget-card__value { color:var(--primary); font-size:1.35rem; font-weight:800; line-height:1.1; margin:.3rem 0 .2rem; }
.budget-card--total .budget-card__value { font-size:1.6rem; }
.budget-card__sub   { color:var(--gray-400); font-size:.72rem; }

/* ── Organigrama ────────────────────────────────────────────────── */
.organigrama { display:flex; flex-direction:column; align-items:center; gap:2.5rem; }
.org-level   { display:flex; justify-content:center; gap:1.5rem; flex-wrap:wrap; width:100%; }
.level-1, .level-2 { margin-bottom:1rem; }
.level-3 { gap:1.5rem; }
.org-card {
  background:#fff; border-radius:12px; padding:1.5rem; text-align:center;
  min-width:220px; box-shadow:var(--shadow-md); transition:var(--transition-normal);
  border-left:5px solid var(--gray-300); position:relative;
}
.org-card:hover { transform:translateY(-8px) scale(1.02); box-shadow:var(--shadow-xl); }
.card-pm       { border-left-color:var(--color-pm);       background:linear-gradient(135deg,rgba(122,15,47,.05),rgba(122,15,47,.02)); }
.card-tl       { border-left-color:var(--color-tl);       background:linear-gradient(135deg,rgba(5,150,105,.05),rgba(5,150,105,.02)); }
.card-analyst  { border-left-color:var(--color-analyst);  background:linear-gradient(135deg,rgba(217,119,6,.05),rgba(217,119,6,.02)); }
.card-frontend { border-left-color:var(--color-frontend); background:linear-gradient(135deg,rgba(37,99,235,.05),rgba(37,99,235,.02)); }
.card-backend  { border-left-color:var(--color-backend);  background:linear-gradient(135deg,rgba(8,145,178,.05),rgba(8,145,178,.02)); }
.card-qa       { border-left-color:var(--color-qa);       background:linear-gradient(135deg,rgba(124,58,237,.05),rgba(124,58,237,.02)); }
.card-avatar   { font-size:2.5rem; margin-bottom:1rem; color:var(--secondary); }
.org-card h3   { font-size:1.05rem; margin-bottom:.3rem; color:var(--gray-900); font-weight:700; margin-top:0; }
.org-card .role         { font-weight:600; color:var(--secondary); margin-bottom:.2rem; font-size:.95rem; }
.org-card .organization { font-size:.85rem; color:var(--primary); font-weight:600; margin-bottom:.5rem; }
.card-skills   { display:flex; justify-content:center; gap:.5rem; flex-wrap:wrap; margin-top:.8rem; }
.skill         { display:inline-flex; align-items:center; gap:.3rem; background:var(--gray-100); color:var(--gray-700); padding:.3rem .7rem; border-radius:20px; font-size:.75rem; font-weight:500; border:1px solid var(--gray-300); }

/* ── Hierarchy preview ──────────────────────────────────────────── */
.hierarchy-preview {
  background:linear-gradient(135deg,#f8fafc 0%,#e5e7eb 100%);
  border-radius:12px; margin-top:2rem; padding:clamp(1.25rem,3vw,2.5rem); text-align:center; width:100%;
}
.hierarchy-preview h3 { color:#1a1a1a; font-size:clamp(1.1rem,2vw,1.4rem); margin-bottom:.9rem; }
.hierarchy-preview > p { color:var(--gray-500); margin-bottom:1.5rem; }
.hierarchy-preview__canvas {
  background:#fff; border-left:6px solid #6b21a8; border-radius:12px;
  padding:clamp(1rem,2.5vw,2rem); position:relative; width:100%;
}
.hierarchy-preview__level {
  align-items:center; display:grid; gap:1rem;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  justify-items:center; margin:1.75rem 0; position:relative;
}
.hierarchy-preview__level:first-child { margin-top:0; }
.hierarchy-preview__level::before {
  background:linear-gradient(to right,transparent,#a78bfa,transparent);
  content:''; height:2px; left:0; position:absolute; right:0; top:-.9rem;
}
.hierarchy-preview__level:first-child::before { display:none; }
.hierarchy-preview__node {
  border:2px solid #a78bfa; border-radius:8px; font-size:.92rem; font-weight:800;
  line-height:1.3; padding:.95rem 1.1rem; width:min(100%,310px);
}
.hierarchy-preview__node small { display:block; font-size:.78rem; font-weight:700; margin-top:.25rem; opacity:.8; }
.hierarchy-preview__node--pm   { background:linear-gradient(135deg,#1a1a1a 0%,#374151 100%); border-color:#1a1a1a; color:#fff; }
.hierarchy-preview__node--tl   { background:linear-gradient(135deg,#ecfdf5,#d1fae5); border-color:#059669; }
.hierarchy-preview__node--front { background:linear-gradient(135deg,#fff7ed,#ffedd5); border-color:#f97316; }
.hierarchy-preview__node--back  { background:linear-gradient(135deg,#f0f9ff,#bae6fd); border-color:#0284c7; }
.hierarchy-preview__node--cicd  { background:linear-gradient(135deg,#fffbeb,#fde68a); border-color:#92400e; }
.hierarchy-preview__node--qa    { background:linear-gradient(135deg,#f5f3ff,#ddd6fe); border-color:#6d28d9; }

.team-drive-link {
  align-items:center; background:linear-gradient(135deg,#b91c1c,#7f1d1d);
  border:3px solid #ef4444; border-radius:10px; box-shadow:0 14px 28px rgba(185,28,28,.22);
  color:#fff; display:inline-flex; font-size:1rem; font-weight:900; gap:.65rem;
  justify-content:center; margin-top:1.2rem; max-width:100%; padding:.95rem 1.15rem;
  text-decoration:none; word-break:break-word;
}
.team-drive-link:hover { background:linear-gradient(135deg,#dc2626,#991b1b); color:#fff; }

/* ── Responsibilities ───────────────────────────────────────────── */
.responsibilities-grid {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:1.5rem;
}
.responsibility-card {
  background:var(--gray-50); padding:1.5rem; border-radius:12px;
  border-left:5px solid var(--secondary); transition:var(--transition-normal);
}
.responsibility-card:hover { background:#fff; box-shadow:var(--shadow-md); border-left-color:var(--primary); }
.responsibility-card h3 { font-size:1.1rem; margin-bottom:1rem; color:var(--primary); display:flex; align-items:center; gap:.5rem; margin-top:0; }
.responsibility-card h3 i { color:var(--secondary); }
.responsibility-card ul { list-style:none; padding-left:0; }
.responsibility-card li { padding:.5rem 0 .5rem 1.8rem; position:relative; color:var(--gray-700); font-size:.95rem; }
.responsibility-card li::before { content:"✓"; position:absolute; left:0; color:var(--success); font-weight:bold; font-size:1.2rem; }

/* ── Normas de calidad ──────────────────────────────────────────── */
.normas-container { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:1.5rem; }
.norma-card {
  background:var(--gray-50); padding:2rem; border-radius:12px;
  border-top:5px solid var(--secondary); transition:var(--transition-normal); cursor:pointer;
}
.norma-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); background:#fff; border-top-color:var(--primary); }
.norma-icon    { font-size:3rem; margin-bottom:1rem; color:var(--secondary); }
.norma-card h3 { font-size:1.2rem; color:var(--primary); margin-bottom:.3rem; font-weight:700; margin-top:0; }
.norma-subtitle { color:var(--secondary); font-weight:600; font-size:.9rem; margin-bottom:1rem; }
.norma-content  { font-size:.95rem; line-height:1.7; }
.norma-content p  { margin-bottom:1rem; color:var(--gray-700); }
.norma-content ul { padding-left:1.5rem; }
.norma-content li { margin-bottom:.5rem; color:var(--gray-600); }

/* ── Contact ────────────────────────────────────────────────────── */
.contact-info { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1.5rem; }
.contact-card {
  background:var(--gray-50); padding:2rem; border-radius:12px;
  border-left:5px solid var(--secondary); text-align:center; transition:var(--transition-normal);
}
.contact-card:hover { background:#fff; box-shadow:var(--shadow-md); border-left-color:var(--primary); }
.contact-card h3 { font-size:1.1rem; margin-bottom:.8rem; color:var(--primary); display:flex; align-items:center; justify-content:center; gap:.5rem; margin-top:0; }
.contact-card h3 i { color:var(--secondary); font-size:1.3rem; }
.contact-card p { margin:0; color:var(--gray-700); }
.contact-card a { color:var(--secondary); text-decoration:none; font-weight:600; }
.contact-card a:hover { color:var(--primary); text-decoration:underline; }

/* ── Swimlane (plan-proyecto) ───────────────────────────────────── */
.swimlane { border:1px solid var(--gray-200); border-radius:12px; margin-top:1.25rem; overflow:hidden; }
.swimlane__header { display:grid; grid-template-columns:82px 1fr 1fr 1fr; background:var(--gray-900); }
.swimlane__corner { background:var(--gray-800); display:flex; align-items:center; justify-content:center; padding:10px 6px; font-size:.65rem; color:rgba(255,255,255,.45); font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.swimlane__col-hdr { padding:11px 14px; border-left:1px solid rgba(255,255,255,.12); display:flex; align-items:center; gap:7px; font-size:.84rem; font-weight:800; color:#fff; }
.swimlane__col-hdr--web        { border-top:3px solid #3b82f6; }
.swimlane__col-hdr--asistencia { border-top:3px solid #22c55e; }
.swimlane__col-hdr--inventario { border-top:3px solid #f59e0b; }
.swimlane__col-hdr small { color:rgba(255,255,255,.55); font-size:.65rem; font-weight:500; }
.swimlane__row { display:grid; grid-template-columns:82px 1fr 1fr 1fr; border-bottom:1px solid var(--gray-200); }
.swimlane__row:last-child { border-bottom:none; }
.swimlane__row:hover .swimlane__cell { background:#fafbff; }
.swimlane__row:hover .swimlane__cell--diff { background:#fffbeb; }
.swimlane__row:hover .swimlane__phase-lbl { background:var(--gray-100); }
.swimlane__phase-lbl { background:var(--gray-50); border-right:2px solid var(--gray-200); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:12px 6px; text-align:center; transition:background .12s; }
.swimlane__phase-lbl small { color:var(--gray-400); font-size:.62rem; line-height:1.4; display:block; }
.swimlane__cell { border-left:1px solid var(--gray-100); padding:12px 14px; transition:background .12s; }
.swimlane__cell--diff { background:#fffbeb; }
.swimlane__cell-wp     { color:var(--primary); font-size:.67rem; font-weight:800; letter-spacing:.05em; margin-bottom:3px; text-transform:uppercase; }
.swimlane__cell-wp--warn { color:#b45309; }
.swimlane__cell-title  { color:var(--gray-900); font-size:.82rem; font-weight:700; line-height:1.3; margin-bottom:5px; }
.swimlane__cell-detail { color:var(--gray-600); font-size:.73rem; line-height:1.5; margin-bottom:6px; }
.swimlane__cell-who    { align-items:center; color:var(--gray-500); display:flex; flex-wrap:wrap; font-size:.69rem; gap:3px; }
@media (max-width: 900px) {
  .swimlane__header, .swimlane__row { grid-template-columns:1fr; }
  .swimlane__corner { display:none; }
  .swimlane__col-hdr { border-top:none; border-left:none; border-bottom:1px solid rgba(255,255,255,.15); }
  .swimlane__phase-lbl { border-right:none; border-bottom:1px solid var(--gray-200); flex-direction:row; justify-content:flex-start; gap:8px; }
  .swimlane__cell { border-left:none; border-bottom:1px solid var(--gray-100); }
}
.parallel-diff-row { background:#fffbeb; }

/* ── Subproject track cards ─────────────────────────────────────── */
.subproject-tracks { display:grid; gap:1.25rem; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); margin-top:1.25rem; }
.subproject-card { background:#fff; border:1px solid var(--gray-200); border-radius:12px; display:flex; flex-direction:column; overflow:hidden; transition:box-shadow .15s; }
.subproject-card:hover { box-shadow:0 6px 24px rgba(23,32,51,.10); }
.subproject-card__header { align-items:center; display:flex; gap:12px; padding:14px 18px; }
.subproject-card__header--web        { background:linear-gradient(135deg,#1d4ed8,#2563eb); }
.subproject-card__header--asistencia { background:linear-gradient(135deg,#15803d,#16a34a); }
.subproject-card__header--inventario { background:linear-gradient(135deg,#b45309,#d97706); }
.subproject-card__header i { color:rgba(255,255,255,.9); font-size:1.25rem; flex-shrink:0; }
.subproject-card__header-text { flex:1; min-width:0; }
.subproject-card__header h3 { color:#fff; font-size:.95rem; font-weight:800; margin:0 0 2px; }
.subproject-card__header p  { color:rgba(255,255,255,.72); font-size:.7rem; margin:0; }
.subproject-card__op-link { color:rgba(255,255,255,.75); font-size:.72rem; font-weight:600; margin-left:auto; text-decoration:none; white-space:nowrap; }
.subproject-card__op-link:hover { color:#fff; }
.subproject-card__body { flex:1; padding:8px 16px; }
.subproject-phase-row { border-bottom:1px solid var(--gray-100); display:grid; gap:8px; grid-template-columns:38px 1fr; padding:8px 0; align-items:start; }
.subproject-phase-row:last-child { border-bottom:none; }
.subproject-phase-row__content { color:var(--gray-800); font-size:.81rem; font-weight:600; line-height:1.35; }
.subproject-phase-row__who { color:var(--gray-500); font-size:.7rem; margin-top:2px; }
.subproject-card__footer { background:var(--gray-50); border-top:1px solid var(--gray-200); display:flex; gap:8px; padding:10px 14px; }

/* ── Member cards (RACI/team) ───────────────────────────────────── */
.member-cards-grid { display:grid; gap:1.1rem; grid-template-columns:repeat(auto-fill,minmax(305px,1fr)); }
.member-card { background:#fff; border:1px solid var(--gray-200); border-left:5px solid var(--gray-300); border-radius:12px; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; overflow:hidden; transition:var(--transition-normal); }
.member-card:hover { box-shadow:var(--shadow-md); transform:translateY(-2px); }
.member-card__head { align-items:center; display:flex; gap:.85rem; padding:1.1rem 1.2rem .8rem; }
.member-card__avatar { align-items:center; border-radius:50%; color:#fff; display:flex; flex-shrink:0; font-size:.66rem; font-weight:900; height:42px; justify-content:center; letter-spacing:.02em; width:42px; }
.member-card__meta { flex:1; min-width:0; }
.member-card__name { color:var(--gray-900); font-size:1rem; font-weight:800; line-height:1.2; }
.member-card__role { color:var(--gray-500); font-size:.78rem; font-weight:500; margin-top:2px; }
.member-card__tags { align-items:center; border-bottom:1px solid var(--gray-100); border-top:1px solid var(--gray-100); display:flex; flex-wrap:wrap; gap:5px; padding:.55rem 1.2rem; }
.member-tag { border-radius:4px; font-size:.64rem; font-weight:700; letter-spacing:.04em; padding:2px 6px; text-transform:uppercase; white-space:nowrap; }
.member-tag--phase { background:#fff1f5; color:var(--primary); border:1px solid #fecdd3; }
.member-tag--iso   { background:#dbeafe; color:#1e40af; }
.member-tag--scrum { background:#d1fae5; color:#065f46; }
.member-tag--pmbok { background:#ede9fe; color:#5b21b6; }
.member-tag--v     { background:#fef3c7; color:#92400e; }
.member-card__deliverables { flex:1; padding:.7rem 1.2rem .85rem; }
.member-card__dl-title { color:var(--gray-400); font-size:.65rem; font-weight:800; letter-spacing:.07em; margin-bottom:.45rem; text-transform:uppercase; }
.member-deliverable { border-bottom:1px solid var(--gray-100); display:flex; flex-direction:column; gap:2px; padding:.38rem 0; }
.member-deliverable:last-child { border-bottom:0; }
.member-deliverable__label { color:var(--gray-700); font-size:.8rem; font-weight:600; line-height:1.4; }
.member-deliverable__path { background:var(--gray-50); border:1px solid var(--gray-200); border-radius:4px; color:var(--primary); font-family:'Courier New',Courier,monospace; font-size:.66rem; font-weight:600; padding:1px 5px; display:inline-block; word-break:break-all; }
.member-card__footer { background:var(--gray-50); border-top:1px solid var(--gray-200); display:flex; gap:7px; padding:.6rem 1.2rem; }
.member-btn { align-items:center; background:#fff; border:1.5px solid #e5bdca; border-radius:7px; color:var(--primary); display:inline-flex; flex:1; font-size:.77rem; font-weight:700; gap:5px; justify-content:center; padding:.42rem .65rem; text-decoration:none; transition:var(--transition-fast); }
.member-btn:hover { background:#fff7fa; border-color:var(--primary); color:var(--primary); }
.member-btn--primary { background:linear-gradient(135deg,var(--primary),#9f1239); border-color:transparent; color:#fff; }
.member-btn--primary:hover { background:linear-gradient(135deg,#9f1239,var(--primary)); color:#fff; }

/* ── Method legend ──────────────────────────────────────────────── */
.method-legend { background:var(--gray-50); border:1px solid var(--gray-200); border-radius:10px; display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; margin-bottom:1.5rem; padding:.8rem 1rem; }
.method-legend__item { align-items:center; display:flex; font-size:.76rem; gap:5px; }
.method-legend__item .member-tag { cursor:default; }

/* ── 3-col detail grid ──────────────────────────────────────────── */
.detail-grid--3col { grid-template-columns:repeat(3,1fr); }
@media (max-width: 900px) { .detail-grid--3col { grid-template-columns:1fr; } }

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .organigrama { gap:1.5rem; }
  .level-3 { gap:1rem; }
  .org-card { min-width:180px; padding:1rem; }
  .card-avatar { font-size:2rem; }
  .org-card h3 { font-size:.95rem; }
  .responsibilities-grid, .normas-container, .contact-info { grid-template-columns:1fr; }
}