/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/.pnpm/next@15.3.4_@babel+core@7.29.7_@opentelemetry+api@1.9.1_react-dom@19.1.0_react@19.1.0__react@19.1.0/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[5].use[2]!../../node_modules/.pnpm/next@15.3.4_@babel+core@7.29.7_@opentelemetry+api@1.9.1_react-dom@19.1.0_react@19.1.0__react@19.1.0/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[5].use[3]!./src/components/platform-page.module.css ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*
 * Shared chrome for the dedicated platform pages — 19D.2B-R3.
 *
 * `/why-kees` and `/solutions` are the two header items that were anchors until
 * this task. They are the same *kind* of page — a positioning argument in
 * bands — so they share one stylesheet rather than growing two near-identical
 * modules that drift apart on the next edit.
 *
 * Consistent with `home-marketing.module.css` but deliberately one notch
 * quieter: the home page owns `--t-display` and the full-strength gradient
 * hero, and a second page using both would make the site read as two front
 * doors. These use `--t-section` and a tinted band.
 *
 * Same rules as every module in this sequence: every value is a token, no raw
 * hex, no hand-written clamp, logical properties only so Arabic RTL and English
 * LTR share one stylesheet.
 */

.platform-page_page__p3kWg { -webkit-padding-after: var(--s24); padding-block-end: var(--s24); }

.platform-page_inner___BhRw {
  max-width: var(--max-w);
  margin-inline: auto;
  padding-inline: var(--s5);
}

.platform-page_band__pLnpT { padding-block: var(--section-rhythm); }
.platform-page_bandMuted__m_udC { background: var(--kees-band-muted); }

/* ── Hero ─────────────────────────────────────────────────────────────── */

.platform-page_hero__LwYpl {
  padding-block: var(--s20);
  background: var(--kees-band-brand);
  -webkit-border-after: 1px solid var(--kees-border);
          border-block-end: 1px solid var(--kees-border);
}

.platform-page_eyebrow__NVvXO {
  display: inline-block;
  -webkit-margin-after: var(--s4);
          margin-block-end: var(--s4);
  padding: var(--s1) var(--s4);
  border-radius: var(--r-full);
  background: var(--kees-band-surface);
  color: var(--kees-primary);
  font-size: var(--t-sm);
  font-weight: 800;
  letter-spacing: 0.04em;
}

.platform-page_title___dhuY {
  max-width: 24ch;
  margin: 0;
  font-size: var(--t-section);
  font-weight: 800;
  line-height: var(--lh-display);
  letter-spacing: var(--tracking-display);
  color: var(--kees-text);
}

.platform-page_lede__9_sqq {
  max-width: 64ch;
  margin-block: var(--s5) 0;
  font-size: var(--t-lg);
  line-height: 1.8;
  color: var(--kees-text-2);
}

/* ── Section headings inside the page ─────────────────────────────────── */

.platform-page_sectionTitle__5Q4aA {
  max-width: 28ch;
  margin: 0;
  font-size: var(--t-2xl);
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: var(--tracking-display);
  color: var(--kees-text);
}

.platform-page_sectionLede__q_Ksv {
  max-width: 62ch;
  margin-block: var(--s4) 0;
  font-size: var(--t-base);
  line-height: 1.8;
  color: var(--kees-text-2);
}

/* ── Numbered reason rows ─────────────────────────────────────────────────
   Same shape as the home page's "what is KEES" block, which is deliberate:
   these pages are the long form of that argument, so the reader should
   recognise the pattern. */

.platform-page_reasons__2CtEi {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
  grid-gap: var(--s5);
  gap: var(--s5);
  -webkit-margin-before: var(--s10);
          margin-block-start: var(--s10);
}

.platform-page_reason__zZVn3 {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-gap: var(--s5);
  gap: var(--s5);
  align-items: start;
  padding: var(--s6);
  border: 1px solid var(--kees-border);
  border-radius: var(--r-xl);
  background: var(--kees-band-surface);
  box-shadow: var(--shadow-sm);
}

.platform-page_reasonNum__w6wQX {
  display: grid;
  place-items: center;
  width: var(--s10);
  height: var(--s10);
  border-radius: var(--r-lg);
  background: var(--kees-primary);
  color: var(--kees-on-primary);
  font-size: var(--t-base);
  font-weight: 800;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.platform-page_reasonTitle__SP6Ed {
  margin: 0;
  font-size: var(--t-lg);
  font-weight: 700;
  color: var(--kees-text);
}

.platform-page_reasonBody__GQPPV {
  margin-block: var(--s2) 0;
  font-size: var(--t-base);
  line-height: 1.75;
  color: var(--kees-text-3);
}

/* ── Three-part model strip ───────────────────────────────────────────────
   Inverted, so the page's structural explanation is visually distinct from the
   list of reasons above it. */

.platform-page_model__QCQd8 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
  grid-gap: var(--s6);
  gap: var(--s6);
  -webkit-margin-before: var(--s10);
          margin-block-start: var(--s10);
  padding: var(--s10);
  border-radius: var(--r-2xl);
  background:
    radial-gradient(ellipse 50% 80% at 100% 0%, rgba(168, 218, 220, 0.16), transparent 60%),
    linear-gradient(150deg, var(--kees-band-contrast) 0%, var(--kees-primary-dark) 100%);
  color: var(--kees-band-on-contrast);
}

.platform-page_modelItem__YqSMK { display: grid; grid-gap: var(--s2); gap: var(--s2); align-content: start; }

.platform-page_modelStep__GUi_r {
  display: inline-grid;
  place-items: center;
  width: var(--s8);
  height: var(--s8);
  border-radius: var(--r-full);
  background: rgba(255, 255, 255, 0.16);
  color: var(--kees-soft);
  font-size: var(--t-sm);
  font-weight: 800;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.platform-page_modelTitle__Z7Rk7 {
  -webkit-margin-before: var(--s2);
          margin-block-start: var(--s2);
  font-size: var(--t-lg);
  font-weight: 700;
  color: var(--kees-band-on-contrast);
}

.platform-page_modelBody__w1I1M {
  margin: 0;
  font-size: var(--t-sm);
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.8);
}

/* ── Solution groups ──────────────────────────────────────────────────── */

.platform-page_group__tubp3 { -webkit-margin-before: var(--s16); margin-block-start: var(--s16); }
.platform-page_group__tubp3:first-of-type { -webkit-margin-before: var(--s10); margin-block-start: var(--s10); }

.platform-page_groupGrid__leUt7 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr));
  grid-gap: var(--s4);
  gap: var(--s4);
  -webkit-margin-before: var(--s8);
          margin-block-start: var(--s8);
}

.platform-page_item__ejfDc {
  display: flex;
  flex-direction: column;
  gap: var(--s2);
  padding: var(--s6);
  border: 1px solid var(--kees-border);
  border-radius: var(--r-xl);
  background: var(--kees-band-surface);
  transition: border-color var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out);
}

.platform-page_item__ejfDc:hover {
  border-color: var(--kees-accent);
  box-shadow: var(--shadow-card-hover);
}

.platform-page_itemIcon__vtrEs {
  display: grid;
  place-items: center;
  width: var(--s10);
  height: var(--s10);
  -webkit-margin-after: var(--s2);
          margin-block-end: var(--s2);
  border-radius: var(--r-md);
  background: var(--kees-primary-light);
  color: var(--kees-primary);
}

.platform-page_itemTitle__qLqkh {
  margin: 0;
  font-size: var(--t-base);
  font-weight: 700;
  color: var(--kees-text);
}

.platform-page_itemBody__JApgz {
  margin: 0;
  font-size: var(--t-sm);
  line-height: 1.7;
  color: var(--kees-text-3);
}

/* ── "Still being built" ──────────────────────────────────────────────────
   Dashed and muted so it cannot be mistaken for the working list above it. */

.platform-page_soon__6Tlah {
  -webkit-margin-before: var(--s16);
          margin-block-start: var(--s16);
  padding: var(--s6);
  border: 1px dashed var(--kees-border);
  border-radius: var(--r-lg);
  background: var(--kees-band-muted);
}

.platform-page_soonTitle__DuSBT {
  margin: 0;
  font-size: var(--t-base);
  font-weight: 800;
  color: var(--kees-text);
}

.platform-page_soonBody__rPR06 {
  max-width: 74ch;
  margin-block: var(--s2) 0;
  font-size: var(--t-sm);
  line-height: 1.7;
  color: var(--kees-text-3);
}

/* ── Closing CTA ──────────────────────────────────────────────────────── */

.platform-page_cta__btBU_ {
  -webkit-margin-before: var(--section-rhythm);
          margin-block-start: var(--section-rhythm);
  padding-block: var(--s20);
  background:
    radial-gradient(ellipse 60% 70% at 15% 0%, rgba(168, 218, 220, 0.16), transparent 60%),
    linear-gradient(150deg, var(--kees-band-contrast) 0%, var(--kees-primary-dark) 100%);
  color: var(--kees-band-on-contrast);
}

.platform-page_ctaInner__HpMSi { text-align: center; }

.platform-page_ctaTitle__O_qfd {
  margin: 0;
  font-size: var(--t-2xl);
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: var(--tracking-display);
}

.platform-page_ctaBody__JuQSH {
  max-width: 52ch;
  margin: var(--s4) auto 0;
  font-size: var(--t-base);
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.84);
}

.platform-page_ctaRow__PzrKA {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--s4);
  -webkit-margin-before: var(--s8);
          margin-block-start: var(--s8);
}

.platform-page_ctaPrimary__9t0Vg,
.platform-page_ctaGhost__wpMNN {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--control-h);
  min-width: var(--tap-min);
  padding-inline: var(--s8);
  border-radius: var(--r-md);
  border: 1.5px solid transparent;
  font-size: var(--t-base);
  font-weight: 700;
  transition: background var(--dur-fast) var(--ease-out),
              transform var(--dur-fast) var(--ease-out);
}

.platform-page_ctaPrimary__9t0Vg:hover,
.platform-page_ctaGhost__wpMNN:hover { transform: translateY(-2px); }

.platform-page_ctaPrimary__9t0Vg {
  background: var(--kees-band-on-contrast);
  color: var(--kees-primary);
  border-color: var(--kees-band-on-contrast);
}

.platform-page_ctaGhost__wpMNN {
  background: rgba(255, 255, 255, 0.08);
  color: var(--kees-band-on-contrast);
  border-color: rgba(255, 255, 255, 0.45);
}

.platform-page_ctaGhost__wpMNN:hover { background: rgba(255, 255, 255, 0.16); }

@media (max-width: 40rem) {
  .platform-page_inner___BhRw { padding-inline: var(--s4); }
  .platform-page_hero__LwYpl { padding-block: var(--s16); }
  .platform-page_model__QCQd8 { padding: var(--s6); }
  .platform-page_cta__btBU_ { padding-block: var(--s16); }
  .platform-page_ctaRow__PzrKA > * { flex: 1 1 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .platform-page_ctaPrimary__9t0Vg:hover,
  .platform-page_ctaGhost__wpMNN:hover { transform: none; }
}

