const EXPERIENCE = [
  { title: 'Senior Manager, Network Intelligence', dates: 'Jun 2025 – Present', company: 'Liberty Latin America — LCPR, San Juan, PR', bullets: [
    'Defining and executing the Network Intelligence & AIOps roadmap, bridging Network Operations, IT, and Customer Experience.',
    'Architected Pathfinder 2.0, a real-time flow analytics platform on Kafka, ClickHouse, PostgreSQL, Flask, and D3.js, for CGNAT and CMTS utilization insight.',
    'Built the AI strategy roadmap behind two production use cases: Truck Roll Reduction and Proactive Fault Detection / MTTR Reduction.',
    'Leading a monitoring platform upgrade across a multi-initiative portfolio spanning monitoring, analytics, and DevOps.',
  ]},
  { title: 'Technology Architect Sr. Manager', dates: 'May 2023 – Jun 2025', company: 'Liberty Latin America, San Juan, PR', bullets: [
    'Led end-to-end network architecture design for new product initiatives across access, core, and service layers.',
    'Partnered with product teams to tailor designs and maximize capital investment return.',
  ]},
  { title: 'Capacity Planning Sr. Manager', dates: 'Oct 2018 – May 2023', company: 'Liberty Latin America, San Juan, PR', bullets: [
    'Developed Prophet-based time-series forecasting models to predict regional capacity and prioritize CapEx.',
    'Reports and scenario models guided a core baseline budget in the tens of millions annually.',
    'Monitored performance trends to flag congestion risk ahead of service impact.',
  ]},
  { title: 'Core and Access Network Manager', dates: 'Feb 2010 – Oct 2018', company: 'Liberty Puerto Rico, San Juan, PR', bullets: [
    'Managed a multimillion-dollar annual capital budget from vendor procurement through project delivery.',
    'Operated multi-technology infrastructure: CMTS, OLT, B2B MPLS, DWDM, Video Multicast, WiFi, and IT.',
  ]},
  { title: 'Network Operations Specialist II', dates: 'Jul 2002 – Feb 2010', company: 'Centennial of Puerto Rico, Guaynabo, PR', bullets: [
    'Operated ISP, MAN, B2B, MPLS, Frame Relay, and ATM network topologies.',
  ]},
]

export function renderExperience() {
  const rows = EXPERIENCE.map(job => `
    <div class="job reveal">
      <div class="job-head">
        <h3 class="job-title">${job.title}</h3>
        <span class="job-dates mono">${job.dates}</span>
      </div>
      <p class="job-company">${job.company}</p>
      <ul class="job-bullets">
        ${job.bullets.map(b => `<li>${b}</li>`).join('')}
      </ul>
    </div>
  `).join('')

  return `
    <section class="experience" id="experience">
      <div class="container">
        <span class="section-kicker">Experience</span>
        ${rows}
      </div>
    </section>

    <style>
      .experience { padding: 64px 0; }
      .job { padding: 28px 0; border-top: 2px solid var(--border-strong); }
      .job-head {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 8px;
        align-items: baseline;
      }
      .job-title { font-size: 1.25rem; }
      .job-dates { font-size: 0.8rem; color: var(--muted); }
      .job-company { font-size: 0.9rem; color: var(--accent-700); margin: 6px 0 14px; }
      .job-bullets {
        margin: 0;
        padding-left: 20px;
        color: var(--muted-2);
        font-size: 0.95rem;
        line-height: 1.7;
        max-width: 74ch;
      }
      .job-bullets li { margin-bottom: 6px; }
    </style>
  `
}