/* =====================================================================
   CHAVANS — PLATFORMS & CAPABILITIES · INTERNAL PAGES
   Loads AFTER applied-ai.css (canvas --u = 100vw/1600, nav pills, type
   roles, pinned stage, CTA, footer). Source: "1. AI Platforms" PPTX.
   Left-aligned editorial layout on #E9EDF0 with a chartreuse hero card.
===================================================================== */
:root{
  --lime: #E3F671;          /* hero card (srgb E3F671) */
  --grey-text: #808080;     /* tx1 · 50%  — body copy */
  --rule: #D9D9D9;          /* bg1 · 85%  — table rules */
}

.pd-sec{ background: var(--mist); color: var(--ink); }

/* ---------- hero ---------- */
.pd-logo img{ width: calc(var(--u) * 157.5); height: auto; }
.pd-card{
  left: calc(var(--u) * 50.6); top: calc(var(--u) * 152.4);
  width: calc(var(--u) * 1499.6); height: calc(var(--u) * 659.2);
  background: var(--lime);
}
.pd-tag{ font-size: calc(var(--u) * 13.8); line-height: calc(var(--u) * 18); color: var(--ink-85); letter-spacing: 0.02em; }
.pd-hero-title{
  font-family: var(--sans); font-weight: 500;
  font-size: calc(var(--u) * 90);       /* 54pt */
  line-height: calc(var(--u) * 97.2);   /* lnSpc 90% */
  letter-spacing: -0.006em;
  color: var(--ink);
}
.pd-hero-sub{
  font-family: var(--mono);
  font-size: calc(var(--u) * 14.4);     /* 10.5pt */
  line-height: calc(var(--u) * 19.2);
  letter-spacing: 0.01em;
  color: var(--ink-75);
}

/* ---------- shared section bits ---------- */
.pd-tagrow{ color: var(--ink); }
.pd-tagrow .t-mono{ font-size: calc(var(--u) * 13.8); line-height: calc(var(--u) * 18); letter-spacing: 0.02em; }
.pd-h40{ font-family: var(--sans); font-weight: 500; font-size: calc(var(--u) * 66.67); line-height: calc(var(--u) * 64); letter-spacing: -0.004em; color: var(--ink); }
.pd-h32{ font-family: var(--sans); font-weight: 500; font-size: calc(var(--u) * 53.33); line-height: calc(var(--u) * 51.2); letter-spacing: -0.004em; color: var(--ink); }
.pd-h28{ font-family: var(--sans); font-weight: 500; font-size: calc(var(--u) * 46.67); line-height: calc(var(--u) * 44.8); letter-spacing: -0.003em; color: var(--ink); }
.pd-body{ font-family: var(--sans); font-size: calc(var(--u) * 18.33); line-height: calc(var(--u) * 22); color: var(--grey-text); text-wrap: pretty; }
.pd-body p + p{ margin-top: calc(var(--u) * 22); }
.pd-body b{ font-weight: 700; }

/* ---------- find the right platform (table) ---------- */
.pd-table{
  width: calc(var(--u) * 849.5);
  border-collapse: collapse;
  font-family: var(--sans);
  font-size: calc(var(--u) * 18.33);
  line-height: calc(var(--u) * 25.3);   /* lnSpc 115% */
  color: var(--grey-text);
}
.pd-table th, .pd-table td{
  text-align: left; font-weight: 400;
  padding: 0 calc(var(--u) * 1);
  height: calc(var(--u) * 25.8);
  border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
  white-space: nowrap;
}
.pd-table th{ font-weight: 700; color: var(--ink-75); }
.pd-table col:first-child{ width: calc(var(--u) * 535.9); }
.pd-table tbody tr{ transition: color .2s; cursor: pointer; }
.pd-table tbody tr:hover{ color: var(--ink); }
.pd-table td a{ display: inline-flex; align-items: center; gap: calc(var(--u) * 10); }
.pd-table td a::after{
  content: ""; width: calc(var(--u) * 18); height: 1px; background: currentColor;
  opacity: 0; transform: translateX(calc(var(--u) * -6));
  transition: opacity .2s, transform .25s;
}
.pd-table tbody tr:hover td a::after{ opacity: 1; transform: none; }

/* ---------- pinned platforms [01]–[05] (reuses .s-pillars / .pl-* ) ---------- */
.pd-item-text{ left: calc(var(--u) * 91.6); top: calc(var(--u) * 116.1); width: calc(var(--u) * 740); }
.pd-item-text .pd-body{ width: calc(var(--u) * 640); margin-top: calc(var(--u) * 41); }
.pd-feat{ position: relative; margin-top: calc(var(--u) * 44); padding-left: calc(var(--u) * 38.8); }
.pd-feat .elbow{ position: absolute; left: calc(var(--u) * 7.8); top: calc(var(--u) * -2); }
.pd-feat p{
  font-family: var(--mono);
  font-size: calc(var(--u) * 14.4);
  line-height: calc(var(--u) * 19.9);
  letter-spacing: 0.01em;
  color: var(--ink-75);
}
.pd-feat .pd-feat-h{ font-weight: 700; margin-bottom: calc(var(--u) * 19.9); }

/* ---------- illustration ---------- */
.pd-stack-list{ display: grid; }

/* ---------- related resources ---------- */
.pd-res{ width: calc(var(--u) * 800); }
.pd-res-item + .pd-res-item{ margin-top: calc(var(--u) * 22); }
.pd-res-item a{
  color: var(--grey-text);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px;
  transition: color .2s;
}
.pd-res-item a:hover{ color: var(--ink); }
.pd-res-item span{ display: block; }

/* CTA band is tx1 95% on this template */
.pd-cta{ background: #0D0D0D; }

/* =====================================================================
   MOBILE (≤ 900px)
===================================================================== */
@media (max-width: 900px){
  .pd-sec{ padding: 16vw var(--g); }
  .s-hero.pd-sec{ padding: 6vw var(--g) 10vw; }
  .pd-logo img{ width: 130px; }
  .pd-card{ position: relative; left: auto; top: auto; width: auto; height: auto; margin-top: 10vw; padding: 9vw 6vw 11vw; }
  .pd-card .abs{ position: relative; left: auto; top: auto; }
  .pd-tagrow{ display: flex; align-items: center; gap: 10px; }
  .pd-tag, .pd-tagrow .t-mono{ font-size: 0.8125rem; line-height: 1.4; }
  .pd-hero-title{ font-size: 10vw; line-height: 1.04; margin-top: 8vw; }
  .pd-hero-title br{ display: none; }
  .pd-hero-row{ display: flex; gap: 12px; margin-top: 9vw; }
  .pd-hero-sub{ font-size: 0.8125rem; line-height: 1.5; }
  .pd-h40, .pd-h32{ font-size: 9vw; line-height: 1.08; margin-top: 6vw; }
  .pd-h28{ font-size: 7.4vw; line-height: 1.12; }
  .pd-body{ font-size: 1rem; line-height: 1.5; }
  .pd-body p + p{ margin-top: 1em; }
  .pd-intro{ margin-top: 6vw; }
  .pd-table-wrap{ margin-top: 8vw; overflow-x: auto; }
  .pd-table{ width: 100%; font-size: 0.875rem; line-height: 1.4; }
  .pd-table th, .pd-table td{ white-space: normal; height: auto; padding: 8px 6px 8px 0; vertical-align: top; }
  .pd-table col:first-child{ width: 58%; }
  .pd-item-text{ position: relative; left: auto; top: auto; width: auto; }
  .pd-item-text .pd-body{ width: auto; margin-top: 5vw; }
  .pd-feat{ margin-top: 8vw; padding-left: 30px; }
  .pd-feat .elbow{ left: 0; top: 0; }
  .pd-feat p{ font-size: 0.8125rem; line-height: 1.55; }
  .pd-res{ width: auto; margin-top: 5vw; }
  .pd-res + .pd-h32{ margin-top: 12vw; }
}
