// CampusWhatWeHandle.jsx — Section D
const CAMPUS_HANDLED = [
  'Curated trucks matched to student/staff headcount and dietary mix',
  'Vendor onboarding paperwork (W-9, COI naming the institution, insurance minimums)',
  'Coordination with Aramark / Sodexo and campus dining contracts',
  'Municipal permits and health-department coordination',
  'Multi-truck logistics and rotation across campuses for high guest counts',
  'On-site coordinator the day of the event',
  'Allergen and dietary accommodations (vegan, gluten-free, halal, kosher)',
  'PO / invoice billing the way university and district finance offices need it',
];

const CampusWhatWeHandle = () => (
  <section style={{ padding:'clamp(64px, 8vw, 96px) 24px', background: T.bgAlt }}>
    <div style={{ maxWidth:1000, margin:'0 auto' }}>
      <h2 style={{ margin:'0 0 40px' }}>What "managed" actually means on campus</h2>
      <div style={{ display:'grid', gridTemplateColumns:'1fr 1fr', gap:'18px 48px' }} className="handle-grid">
        {CAMPUS_HANDLED.map((item, i) => (
          <div key={i} style={{ display:'flex', alignItems:'flex-start', gap:12 }}>
            <span style={{
              width:24, height:24, borderRadius:999, background: T.teal, color: T.white,
              display:'inline-flex', alignItems:'center', justifyContent:'center', flex:'0 0 auto', marginTop:1,
            }}><IconCheck size={14} stroke={2.5} /></span>
            <span style={{ fontSize:16, lineHeight:1.5, color: T.ink }}>{item}</span>
          </div>
        ))}
      </div>
      <div style={{
        marginTop:40, padding:'22px 26px', background: T.white,
        border:`1px solid ${T.border}`, borderRadius:12, borderLeft:`3px solid ${T.teal}`,
      }}>
        <p style={{ margin:0, fontSize:16, lineHeight:1.6, color: T.ink }}>
          Behind it all: a real booking platform — online quotes, e-signed contracts, integrated payments,
          and a campus-portal model we already run for FDU.
        </p>
      </div>
    </div>
    <style>{`
      @media (max-width: 720px) { .handle-grid { grid-template-columns: 1fr !important; } }
    `}</style>
  </section>
);

Object.assign(window, { CampusWhatWeHandle });