/* Phase 4 LMS comparison page — scoped component styles */
.syn-lpc {
  --lpc-navy:#18124a; --lpc-blue:#32238f; --lpc-blue-dark:#25196e;
  --lpc-cyan:#fd6721; --lpc-orange:#fd6721; --lpc-orange-hover:#e95a19;
  --lpc-ink:#000; --lpc-muted:#444; --lpc-line:#d7d7d7; --lpc-soft:#f4f4f4;
  color:var(--lpc-ink); background:#fff; font-size:17px; line-height:1.65; overflow:hidden;
}
.syn-lpc *, .syn-lpc *::before, .syn-lpc *::after { box-sizing:border-box; }
.syn-lpc__wrap { width:min(1180px,calc(100% - 48px)); margin-inline:auto; }
.syn-lpc__section { padding:clamp(62px,8vw,104px) 0; }
.syn-lpc__section--soft { background:var(--lpc-soft); }
.syn-lpc h1,.syn-lpc h2,.syn-lpc h3 { margin-top:0; color:inherit; font-weight:700; letter-spacing:normal; }
.syn-lpc h1 { max-width:860px; margin-bottom:22px; font-size:clamp(40px,4.2vw,50px); line-height:1.12; }
.syn-lpc h2 { margin-bottom:18px; font-size:clamp(30px,3vw,36px); line-height:1.18; font-weight:600; }
.syn-lpc h3 { margin-bottom:13px; font-size:clamp(22px,2vw,28px); line-height:1.2; }
.syn-lpc p { margin-top:0; }
.syn-lpc__lead { font-size:clamp(20px,2vw,25px); line-height:1.45; }
.syn-lpc__eyebrow,.syn-lpc__platform-name { margin-bottom:14px; color:var(--lpc-blue); font-size:13px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.syn-lpc__intro { max-width:790px; margin-bottom:38px; }
.syn-lpc a { text-underline-offset:4px; }
.syn-lpc a:focus-visible,.syn-lpc__table-region:focus-visible { outline:4px solid var(--lpc-blue)!important; outline-offset:4px!important; border-radius:3px; }
.syn-lpc__hero a:focus-visible,.syn-lpc__final a:focus-visible { outline-color:#fff!important; }
.syn-lpc__button { display:inline-flex; min-height:52px; align-items:center; justify-content:center; padding:13px 24px; border:2px solid transparent; border-radius:0; font-weight:700; line-height:1.25; text-decoration:none; transition:transform .18s ease,background .18s ease; }
.syn-lpc__button:hover { transform:translateY(-2px); text-decoration:none; }
.syn-lpc__button--primary { color:var(--lpc-navy); background:var(--lpc-orange); }
.syn-lpc__button--primary:hover { color:var(--lpc-navy); background:var(--lpc-orange-hover); }
.syn-lpc__button--light { color:var(--lpc-navy); background:#fff; }
.syn-lpc__button--light:hover { color:var(--lpc-navy); background:var(--lpc-soft); }

.syn-lpc__hero { padding:clamp(70px,9vw,112px) 0; color:#fff; background:var(--lpc-blue); }
.syn-lpc__hero .syn-lpc__wrap { max-width:900px; margin-left:max(24px,calc((100% - 1180px)/2)); }
.syn-lpc__hero .syn-lpc__eyebrow,.syn-lpc__final .syn-lpc__eyebrow { color:#fff; }
.syn-lpc__hero p:not(.syn-lpc__eyebrow) { max-width:820px; }
.syn-lpc__hero .syn-lpc__button { margin-top:18px; }

.syn-lpc__platforms { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.syn-lpc__platform { display:flex; min-height:410px; flex-direction:column; padding:32px; border:1px solid var(--lpc-line); border-top:6px solid var(--lpc-blue); border-radius:0; background:#fff; box-shadow:none; }
.syn-lpc__platform--totara { border-top-color:var(--lpc-orange); background:linear-gradient(180deg,#fff8f3,#fff 44%); }
.syn-lpc__platform--talent { border-top-color:var(--lpc-cyan); }
.syn-lpc__platform a { margin-top:auto; color:var(--lpc-blue-dark); font-weight:700; }

.syn-lpc__scroll-hint { margin-bottom:12px; color:var(--lpc-muted); font-size:14px; }
.syn-lpc__table-region { max-width:100%; overflow-x:auto; border:1px solid var(--lpc-line); border-radius:0; background:#fff; box-shadow:none; scrollbar-color:var(--lpc-blue-dark) var(--lpc-line); }
.syn-lpc table { width:100%; min-width:900px; margin:0; border-collapse:separate; border-spacing:0; font-size:15px; }
.syn-lpc caption { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.syn-lpc th,.syn-lpc td { padding:17px 18px; border-right:1px solid var(--lpc-line); border-bottom:1px solid var(--lpc-line); text-align:left; vertical-align:top; }
.syn-lpc th:last-child,.syn-lpc td:last-child { border-right:0; }
.syn-lpc tbody tr:last-child th,.syn-lpc tbody tr:last-child td { border-bottom:0; }
.syn-lpc thead th { position:sticky; top:0; z-index:2; color:#fff; background:var(--lpc-navy); font-size:17px; }
.syn-lpc thead th:first-child { left:0; z-index:4; }
.syn-lpc tbody th,.syn-lpc tfoot th { position:sticky; left:0; z-index:1; width:215px; background:var(--lpc-soft); font-weight:700; }
.syn-lpc tbody tr:nth-child(even) td { background:#fafafa; }
.syn-lpc tfoot th,.syn-lpc tfoot td { border-top:2px solid var(--lpc-blue-dark); border-bottom:0; background:var(--lpc-soft); }
.syn-lpc tfoot a { color:var(--lpc-blue-dark); font-weight:700; }
.syn-lpc__notice { margin-top:22px; padding:19px 22px; border-left:5px solid var(--lpc-orange); color:#56301b; background:#fff5e9; font-size:14px; }

.syn-lpc__final { padding:clamp(66px,8vw,96px) 0; color:#fff; background:var(--lpc-navy); text-align:center; }
.syn-lpc__final p:not(.syn-lpc__eyebrow) { max-width:730px; margin:0 auto 27px; font-size:19px; }

@media (max-width:991px) {
  .syn-lpc__platforms { grid-template-columns:1fr; }
  .syn-lpc__platform { min-height:0; }
}
@media (max-width:767px) {
  .syn-lpc__wrap { width:min(100% - 30px,1180px); }
  .syn-lpc__section { padding:56px 0; }
  .syn-lpc__hero .syn-lpc__wrap { margin-inline:auto; }
  .syn-lpc h1 { font-size:clamp(36px,10vw,42px); overflow-wrap:anywhere; }
  .syn-lpc__button { width:100%; }
  .syn-lpc__platform { padding:27px; }
  .syn-lpc__table-region { margin-right:calc((100vw - 100%)/-2); border-radius:8px 0 0 8px; }
  .syn-lpc table { font-size:14px; }
  .syn-lpc th,.syn-lpc td { padding:15px 14px; }
  .syn-lpc tbody th,.syn-lpc tfoot th { width:175px; }
}
@media (prefers-reduced-motion:reduce) { .syn-lpc__button { transition:none; } }
