/* ==== ERP TOOLS DIRECTORY + DETAIL — v2 preview styles ====
   Isolated stylesheet (no theme changes). Folds into theme CSS on approval.
   Everything scoped under .erpd (directory) or .erpt (detail). */

/* ---------- Shared tokens ---------- */
.erpd, .erpt { --ok: #0a8a4a; --warn: #b1442c; --ink-ink: #0d0d0d; --ink-soft: #4a4844; --hairline: #e6e3dc; --surface: #ffffff; --surface-2: #f7f5f0; --surface-3: #ede9e0; }
.erpd .container, .erpt .container { max-width: 1280px; margin: 0 auto; padding: 0 32px; }
@media (max-width: 720px) { .erpd .container, .erpt .container { padding: 0 20px; } }
.erpd *, .erpt * { box-sizing: border-box; }

/* Vendor mark (colored square with initials) */
.vmark { display: inline-flex; align-items: center; justify-content: center; font-family: var(--font-mono, ui-monospace, monospace); font-weight: 700; letter-spacing: -.02em; color: #fff; border-radius: 10px; flex: none; }
.vmark[data-v="oracle"]       { background: linear-gradient(135deg, #C74634 0%, #a2372a 100%); }
.vmark[data-v="sap"]          { background: linear-gradient(135deg, #003b7a 0%, #0056b3 100%); }
.vmark[data-v="microsoft"]    { background: linear-gradient(135deg, #0078D4 0%, #005a9e 100%); }
.vmark[data-v="sage"]         { background: linear-gradient(135deg, #00d639 0%, #00a02b 100%); }
.vmark[data-v="acumatica"]    { background: linear-gradient(135deg, #ff5e00 0%, #cc4b00 100%); }
.vmark[data-v="infor"]        { background: linear-gradient(135deg, #ff2e6e 0%, #cc244f 100%); }
.vmark[data-v="tyler"]        { background: linear-gradient(135deg, #1a4c8c 0%, #133968 100%); }
.vmark[data-v="workday"]      { background: linear-gradient(135deg, #F38B00 0%, #c66d00 100%); }
.vmark[data-v="centralsquare"]{ background: linear-gradient(135deg, #2b4b8c 0%, #1e3766 100%); }
.vmark[data-v="opengov"]      { background: linear-gradient(135deg, #0b7bff 0%, #085fc6 100%); }
.vmark[data-v="bsa"]          { background: linear-gradient(135deg, #3b7a3b 0%, #285228 100%); }
.vmark[data-v="springbrook"]  { background: linear-gradient(135deg, #6b8e23 0%, #4f6a1a 100%); }
.vmark[data-v="caselle"]      { background: linear-gradient(135deg, #2b6cb0 0%, #1e4d80 100%); }
.vmark[data-v="edmunds"]      { background: linear-gradient(135deg, #444 0%, #222 100%); }
.vmark[data-v="harris"]       { background: linear-gradient(135deg, #b5651d 0%, #8a4c15 100%); }
.vmark[data-v="ssi"]          { background: linear-gradient(135deg, #14638c 0%, #0e4664 100%); }
.vmark[data-v="deltek"]       { background: linear-gradient(135deg, #002855 0%, #001a3a 100%); }
.vmark[data-v="cgi"]          { background: linear-gradient(135deg, #e2231a 0%, #a91913 100%); }
.vmark[data-v="epicor"]       { background: linear-gradient(135deg, #d2222d 0%, #9c191f 100%); }
.vmark[data-v="ifs"]          { background: linear-gradient(135deg, #0d7a5e 0%, #095641 100%); }
.vmark[data-v="odoo"]         { background: linear-gradient(135deg, #714B67 0%, #4c334a 100%); }

/* When JS swaps the initials for a real vendor logo, the tile becomes a
   neutral white card so the brand color reads correctly. */
.vmark.has-logo { background: #fff; border: 1px solid var(--hairline); padding: 6px; overflow: hidden; }
.vmark.has-logo img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; }
/* SAP S/4HANA is a wide wordmark — let it breathe by removing padding
   so it fills the tile edge to edge. */
.vmark.has-logo[data-logo-slug="sap-s4hana"] { padding: 0; }
/* Oracle / NetSuite / Infor / CGI wordmarks are wide too. */
.vmark.has-logo[data-logo-slug="oracle"],
.vmark.has-logo[data-logo-slug="cgi-momentum"],
.vmark.has-logo[data-logo-slug="ssi-enquesta"] { padding: 3px; }


/* =========================================================
   DIRECTORY  (.erpd)
   ========================================================= */

.erpd { background: var(--surface); }

/* HERO — editorial */
.erpd-hero { position: relative; padding: clamp(80px, 10vw, 132px) 0 clamp(56px, 6vw, 88px); background: var(--surface-2); border-bottom: 1px solid var(--hairline); overflow: hidden; }
.erpd-hero::before { content: ""; position: absolute; inset: 0; background:
	radial-gradient(1200px 500px at 50% 0%, rgba(255,72,0,.08), transparent 60%),
	radial-gradient(700px 400px at 90% 100%, rgba(0,0,0,.03), transparent 60%);
	pointer-events: none; }
.erpd-hero .container { position: relative; }
.erpd-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-bottom: 20px; }
.erpd-eyebrow .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px rgba(255,72,0,.15); }
.erpd-h1 { font-size: clamp(48px, 7vw, 84px); line-height: 1.02; letter-spacing: -.025em; margin: 0 0 20px; max-width: 900px; font-weight: 600; }
.erpd-h1 em { font-style: normal; color: var(--accent); position: relative; }
.erpd-h1 em::after { content: ""; position: absolute; left: 0; right: 0; bottom: .04em; height: .12em; background: rgba(255,72,0,.18); z-index: -1; }
.erpd-lead { font-size: clamp(17px, 1.6vw, 20px); line-height: 1.55; color: var(--ink-soft); max-width: 680px; margin: 0 0 40px; }
.erpd-hero-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 0; background: var(--surface); border: 1px solid var(--hairline); border-radius: 20px; overflow: hidden; max-width: 900px; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.erpd-hero-stat { padding: 22px 26px; border-right: 1px solid var(--hairline); }
.erpd-hero-stat:last-child { border-right: none; }
.erpd-hero-stat .n { display: block; font-family: var(--font-number, ui-monospace, monospace); font-size: 30px; font-weight: 600; color: var(--ink-ink); letter-spacing: -.02em; line-height: 1; }
.erpd-hero-stat .l { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin-top: 8px; font-weight: 500; }
@media (max-width: 640px) { .erpd-hero-stat { border-right: none; border-bottom: 1px solid var(--hairline); } .erpd-hero-stat:last-child { border-bottom: none; } }

/* STICKY TOOLBAR */
.erpd-toolbar-wrap { position: sticky; top: 0; z-index: 40; background: rgba(255,255,255,.92); backdrop-filter: saturate(180%) blur(12px); -webkit-backdrop-filter: saturate(180%) blur(12px); border-bottom: 1px solid var(--hairline); }
.erpd-toolbar { display: flex; align-items: center; gap: 20px; padding: 16px 0; }
.erpd-search { position: relative; flex: 1; max-width: 460px; }
.erpd-search svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--muted); pointer-events: none; }
.erpd-search input { width: 100%; padding: 12px 40px 12px 42px; border: 1px solid var(--hairline); border-radius: 999px; font: inherit; font-size: 15px; background: #fff; color: var(--ink-ink); transition: border-color .15s, box-shadow .15s; }
.erpd-search input:focus { outline: none; border-color: var(--ink-ink); box-shadow: 0 0 0 4px rgba(0,0,0,.06); }
.erpd-search kbd { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-family: var(--font-mono, ui-monospace, monospace); font-size: 11px; padding: 2px 6px; background: var(--surface-2); border: 1px solid var(--hairline); border-radius: 4px; color: var(--muted); }
.erpd-toolbar-filters-btn { display: none; align-items: center; gap: 8px; padding: 12px 18px; border: 1px solid var(--hairline); background: #fff; border-radius: 999px; cursor: pointer; font-weight: 500; font-size: 14px; }
.erpd-toolbar-sort { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--muted); margin-left: auto; }
.erpd-toolbar-sort select { border: 1px solid var(--hairline); background: #fff; padding: 8px 14px; border-radius: 999px; font: inherit; font-size: 13px; color: var(--ink-ink); cursor: pointer; }

/* FILTER RAIL */
.erpd-shell { display: grid; grid-template-columns: 264px 1fr; gap: 48px; padding: 40px 0 100px; }
@media (max-width: 960px) { .erpd-shell { grid-template-columns: 1fr; gap: 24px; } .erpd-rail { order: -1; } .erpd-toolbar-filters-btn { display: inline-flex; } }
.erpd-rail { position: sticky; top: 88px; align-self: start; max-height: calc(100vh - 100px); overflow-y: auto; padding-right: 4px; scrollbar-width: thin; }
.erpd-rail::-webkit-scrollbar { width: 6px; } .erpd-rail::-webkit-scrollbar-thumb { background: var(--hairline); border-radius: 3px; }
@media (max-width: 960px) { .erpd-rail { position: static; max-height: none; overflow: visible; display: none; padding: 24px; background: var(--surface); border: 1px solid var(--hairline); border-radius: 20px; } .erpd-rail.is-open { display: block; } }

.erpd-fgroup { padding: 20px 0; border-top: 1px solid var(--hairline); }
.erpd-fgroup:first-child { padding-top: 4px; border-top: none; }
.erpd-fgroup h4 { display: flex; align-items: center; gap: 8px; font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); margin: 0 0 14px; font-weight: 600; }
.erpd-fgroup h4::before { content: ""; width: 12px; height: 1px; background: var(--accent); }

.erpd-fopts { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 2px; }
.erpd-fopt { display: flex; align-items: center; gap: 12px; padding: 9px 10px; margin: 0 -10px; border-radius: 10px; cursor: pointer; user-select: none; font-size: 14px; line-height: 1.3; color: var(--ink-soft); transition: background .15s, color .15s; position: relative; }
.erpd-fopt-radio { flex: none; width: 16px; height: 16px; border-radius: 50%; border: 1.5px solid var(--line-2, #d4d2cb); background: #fff; transition: border-color .15s, background .15s; position: relative; }
.erpd-fopt-radio::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--accent); transform: scale(0); transition: transform .15s var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)); }
.erpd-fopt-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.erpd-fopt-count { font-size: 11px; color: var(--muted-2, #9c988f); font-variant-numeric: tabular-nums; font-weight: 500; padding: 2px 8px; background: var(--surface-2); border-radius: 999px; min-width: 20px; text-align: center; transition: background .15s, color .15s; }

.erpd-fopt:hover { background: var(--surface-2); color: var(--ink-ink); }
.erpd-fopt:hover .erpd-fopt-radio { border-color: var(--muted); }

.erpd-fopt.is-active { color: var(--ink-ink); font-weight: 500; }
.erpd-fopt.is-active .erpd-fopt-radio { border-color: var(--accent); }
.erpd-fopt.is-active .erpd-fopt-radio::after { transform: scale(1); }
.erpd-fopt.is-active .erpd-fopt-count { background: rgba(255,72,0,.1); color: var(--accent); }

.erpd-fopt.is-disabled { opacity: .38; cursor: not-allowed; }
.erpd-fopt.is-disabled:hover { background: transparent; }

/* RESULTS HEADER */
.erpd-results-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 20px; padding-bottom: 16px; border-bottom: 1px solid var(--hairline); }
.erpd-results-count { font-size: 15px; color: var(--ink-soft); }
.erpd-results-count strong { color: var(--ink-ink); font-weight: 600; }
.erpd-results-clear { background: none; border: none; color: var(--accent); font: inherit; font-size: 14px; cursor: pointer; padding: 4px 8px; border-radius: 6px; font-weight: 500; }
.erpd-results-clear:hover { background: rgba(255,72,0,.08); }
.erpd-results-clear[hidden] { display: none; }

/* CARDS GRID */
.erpd-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
@media (max-width: 720px) { .erpd-grid { grid-template-columns: 1fr; } }

.erpd-card { position: relative; display: flex; flex-direction: column; padding: 26px; background: var(--surface); border: 1px solid var(--hairline); border-radius: 18px; text-decoration: none; color: inherit; transition: transform .28s cubic-bezier(.2,.7,.2,1), border-color .28s ease, box-shadow .28s ease; overflow: hidden; }
.erpd-card:hover, .erpd-card:focus-visible { transform: translateY(-4px); border-color: var(--ink-ink); box-shadow: 0 18px 40px -20px rgba(13,13,13,.18), 0 4px 12px -6px rgba(13,13,13,.08); outline: none; }

.erpd-card-top { display: grid; grid-template-columns: 52px 1fr; column-gap: 14px; row-gap: 4px; align-items: start; grid-template-areas: "logo name" "logo badge"; margin-bottom: 22px; }
.erpd-card-id { display: contents; }
.erpd-card .vmark { grid-area: logo; width: 52px; height: 52px; font-size: 19px; align-self: start; }
.erpd-card-id-text { grid-area: name; min-width: 0; }

/* Vendor eyebrow removed — the product name carries the brand */
.erpd-card-vendor { display: none; }
.erpd-card-name { display: block; font-size: 20px; font-weight: 600; letter-spacing: -.018em; color: var(--ink-ink); line-height: 1.2; text-wrap: balance; margin: 0; }

/* Verdict: bare dot + small text, docked right under the title as one identity block. No pill. */
.erpd-verdict { grid-area: badge; justify-self: start; display: inline-flex; align-items: center; gap: 7px; padding: 0; background: transparent; border: 0; border-radius: 0; font-size: 12px; font-weight: 500; color: var(--muted); white-space: nowrap; letter-spacing: .003em; }
.erpd-verdict .vdot { width: 5px; height: 5px; border-radius: 50%; background: var(--accent); box-shadow: none; }

.erpd-card-pitch { font-size: 14.5px; line-height: 1.55; color: var(--ink-soft); margin: 0 0 22px; flex: 1; text-wrap: pretty; }

.erpd-card-meta { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 1px solid var(--hairline); padding-top: 16px; margin: 0 0 16px; }
.erpd-card-meta-item { padding: 0 14px; border-left: 1px solid var(--hairline); min-width: 0; }
.erpd-card-meta-item:first-child { padding-left: 0; border-left: none; }
.erpd-card-meta-item:last-child { padding-right: 0; }
.erpd-card-meta-item .lbl { display: block; font-size: 10.5px; text-transform: uppercase; letter-spacing: .11em; color: var(--muted); margin-bottom: 6px; font-weight: 500; }
.erpd-card-meta-item .val { display: block; font-size: 13.5px; color: var(--ink-ink); font-weight: 500; line-height: 1.35; letter-spacing: -.005em; }

/* Tags: inline dot-separated labels, no more chip stack */
.erpd-card-tags { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 0; margin-bottom: 18px; row-gap: 4px; }
.erpd-tag { display: inline-flex; padding: 0; background: transparent; color: var(--muted); border-radius: 0; font-size: 11.5px; font-weight: 500; letter-spacing: .01em; }
.erpd-tag + .erpd-tag::before { content: "·"; margin: 0 8px; color: var(--hairline); font-weight: 500; }

/* CTA: no more hard border-top and bold blue-book styling — quiet by default, arrow leads on hover */
.erpd-card-cta { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 0; border-top: 0; color: var(--ink-soft); font-weight: 500; font-size: 13px; letter-spacing: -.002em; transition: color .22s ease; }
.erpd-card-cta .arr { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; background: var(--surface-2); color: var(--ink-ink); border-radius: 999px; transition: background .22s ease, color .22s ease, transform .22s cubic-bezier(.2,.7,.2,1); }
.erpd-card-cta .arr svg { width: 14px; height: 14px; }
.erpd-card:hover .erpd-card-cta, .erpd-card:focus-visible .erpd-card-cta { color: var(--ink-ink); }
.erpd-card:hover .erpd-card-cta .arr, .erpd-card:focus-visible .erpd-card-cta .arr { background: var(--ink-ink); color: var(--surface); transform: translateX(4px); }

@media (prefers-reduced-motion: reduce) {
	.erpd-card, .erpd-card-cta, .erpd-card-cta .arr { transition: none; }
	.erpd-card:hover, .erpd-card:focus-visible { transform: none; }
	.erpd-card:hover .erpd-card-cta .arr, .erpd-card:focus-visible .erpd-card-cta .arr { transform: none; }
}

.erpd-card.is-hidden { display: none; }

.erpd-empty { display: none; grid-column: 1/-1; text-align: center; padding: 80px 20px; background: var(--surface-2); border-radius: 20px; border: 1px dashed var(--hairline); }
.erpd-empty.is-shown { display: block; }
.erpd-empty h3 { margin: 0 0 8px; font-size: 22px; letter-spacing: -.01em; }
.erpd-empty p { margin: 0; color: var(--muted); }
.erpd-empty button { margin-top: 12px; padding: 10px 20px; background: var(--ink-ink); color: #fff; border: none; border-radius: 999px; font: inherit; font-weight: 500; cursor: pointer; font-size: 14px; }


/* =========================================================
   DETAIL PAGE  (.erpt)
   ========================================================= */

.erpt { background: var(--surface); }

/* HERO */
.erpt-hero { position: relative; padding: clamp(56px, 6vw, 88px) 0 clamp(48px, 5vw, 72px); background: var(--surface-2); border-bottom: 1px solid var(--hairline); overflow: hidden; }
.erpt-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(1000px 500px at 20% 0%, rgba(255,72,0,.05), transparent 60%); pointer-events: none; }
.erpt-hero .container { position: relative; }
.erpt-back { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); text-decoration: none; font-size: 14px; font-weight: 500; margin-bottom: 32px; }
.erpt-back:hover { color: var(--ink-ink); }
.erpt-back svg { width: 16px; height: 16px; }

.erpt-hero-grid { display: grid; grid-template-columns: 1fr 340px; gap: 48px; align-items: start; }
@media (max-width: 960px) { .erpt-hero-grid { grid-template-columns: 1fr; gap: 32px; } }

.erpt-id { display: flex; align-items: center; gap: 20px; margin-bottom: 20px; }
.erpt-id .vmark { width: 64px; height: 64px; font-size: 24px; border-radius: 14px; }
.erpt-id-text { display: flex; flex-direction: column; gap: 6px; align-self: center; }
/* Vendor: shown as small quiet label, not an all-caps eyebrow */
.erpt-vendor { display: block; font-size: 12px; font-weight: 500; text-transform: none; letter-spacing: .01em; color: var(--muted); }
/* Verdict badge: bare dot + text, no pill background */
.erpt-verdict-badge { display: inline-flex; align-items: center; gap: 7px; padding: 0; background: transparent; color: var(--ink-soft); border-radius: 0; font-size: 13.5px; font-weight: 500; align-self: flex-start; letter-spacing: -.005em; }
.erpt-verdict-badge .vdot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: none; flex-shrink: 0; }

.erpt-h1 { font-size: clamp(44px, 6vw, 76px); line-height: 1.01; letter-spacing: -.025em; margin: 0 0 20px; font-weight: 600; color: var(--ink-ink); }
.erpt-tagline { font-size: clamp(17px, 1.6vw, 21px); line-height: 1.5; color: var(--ink-soft); max-width: 620px; margin: 0 0 28px; }
.erpt-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.erpt-tags li { padding: 4px 12px; background: var(--surface); border: 1px solid var(--hairline); border-radius: 999px; font-size: 12px; color: var(--ink-soft); font-weight: 500; }

/* Facts card (right side of hero) */
.erpt-facts { background: var(--surface); border: 1px solid var(--hairline); border-radius: 20px; padding: 8px; box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 10px 30px -12px rgba(0,0,0,.1); }
.erpt-fact-row { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 14px 16px; border-bottom: 1px dashed var(--hairline); }
.erpt-fact-row:last-child { border-bottom: none; }
.erpt-fact-lbl { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 600; }
.erpt-fact-val { font-size: 14px; font-weight: 600; color: var(--ink-ink); text-align: right; }

/* Sticky in-page nav */
.erpt-nav-wrap { position: sticky; top: 0; z-index: 30; background: rgba(255,255,255,.94); backdrop-filter: saturate(180%) blur(12px); -webkit-backdrop-filter: saturate(180%) blur(12px); border-bottom: 1px solid var(--hairline); }
.erpt-nav { display: flex; align-items: center; gap: 4px; overflow-x: auto; padding: 12px 0; scrollbar-width: none; }
.erpt-nav::-webkit-scrollbar { display: none; }
.erpt-nav a { padding: 8px 14px; color: var(--muted); font-size: 14px; font-weight: 500; text-decoration: none; border-radius: 999px; white-space: nowrap; transition: color .15s, background .15s; }
.erpt-nav a:hover { color: var(--ink-ink); background: var(--surface-2); }
.erpt-nav a.is-active { color: #fff; background: var(--ink-ink); }

/* Sections */
.erpt-section { padding: clamp(64px, 7vw, 96px) 0; border-bottom: 1px solid var(--hairline); }
.erpt-section:nth-of-type(2n) { background: var(--surface-2); }
.erpt-section-head { max-width: 780px; margin: 0 0 44px; }
.erpt-section-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); margin-bottom: 14px; }
.erpt-section-eyebrow::before { content: ""; width: 20px; height: 1px; background: var(--accent); }
.erpt-section h2 { font-size: clamp(30px, 3.6vw, 44px); line-height: 1.08; letter-spacing: -.02em; margin: 0 0 14px; font-weight: 600; color: var(--ink-ink); }
.erpt-section-lead { font-size: 17px; line-height: 1.55; color: var(--ink-soft); margin: 0; }

.erpt-prose { max-width: 760px; }
.erpt-prose p { font-size: 17px; line-height: 1.65; color: var(--ink-soft); margin: 0 0 18px; }
.erpt-prose p:last-child { margin-bottom: 0; }

/* STRENGTHS / WEAKNESSES */
.erpt-swot { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (max-width: 720px) { .erpt-swot { grid-template-columns: 1fr; } }
.erpt-swot-col { padding: 32px; background: #fff; border: 1px solid var(--hairline); border-radius: 20px; }
.erpt-swot-col h3 { display: flex; align-items: center; gap: 12px; font-size: 18px; font-weight: 600; margin: 0 0 24px; letter-spacing: -.005em; padding-bottom: 20px; border-bottom: 1px solid var(--hairline); }
.erpt-swot-col h3 .swot-icon { width: 32px; height: 32px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; }
.erpt-swot-col h3 .swot-icon svg { width: 18px; height: 18px; }
.erpt-swot-col.good h3 .swot-icon { background: rgba(10,138,74,.1); color: var(--ok); }
.erpt-swot-col.bad h3 .swot-icon { background: rgba(177,68,44,.1); color: var(--warn); }
.erpt-swot-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 20px; }
.erpt-swot-col li { display: grid; grid-template-columns: 24px 1fr; gap: 12px; align-items: start; }
.erpt-swot-col li svg { width: 20px; height: 20px; margin-top: 2px; }
.erpt-swot-col.good li svg { color: var(--ok); }
.erpt-swot-col.bad li svg { color: var(--warn); }
.erpt-swot-col li strong { display: block; color: var(--ink-ink); font-weight: 600; font-size: 15px; margin-bottom: 4px; }
.erpt-swot-col li span { display: block; font-size: 14px; line-height: 1.55; color: var(--ink-soft); }

/* PRICING */
.erpt-pricing { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.erpt-price-card { padding: 28px 24px; background: #fff; border: 1px solid var(--hairline); border-radius: 20px; position: relative; }
.erpt-price-card.is-highlight { border-color: var(--ink-ink); box-shadow: 0 20px 40px -20px rgba(0,0,0,.15); }
.erpt-price-tier { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); margin-bottom: 16px; }
.erpt-price-tier .badge { padding: 2px 8px; background: var(--accent); color: #fff; border-radius: 999px; font-size: 10px; letter-spacing: .05em; }
.erpt-price-amount { font-family: var(--font-number, ui-monospace, monospace); font-size: 34px; font-weight: 600; color: var(--ink-ink); letter-spacing: -.02em; line-height: 1; margin-bottom: 6px; }
.erpt-price-amount small { font-size: 14px; color: var(--muted); font-weight: 400; margin-left: 4px; font-family: var(--font-sans, inherit); }
.erpt-price-note { font-size: 14px; line-height: 1.55; color: var(--ink-soft); margin: 12px 0 0; padding-top: 16px; border-top: 1px dashed var(--hairline); }

/* MODULES */
.erpt-modules { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; list-style: none; padding: 0; margin: 0; }
.erpt-modules li { display: flex; align-items: flex-start; gap: 12px; padding: 18px 20px; background: #fff; border: 1px solid var(--hairline); border-radius: 14px; }
.erpt-modules .mico { flex: none; width: 32px; height: 32px; border-radius: 8px; background: var(--surface-2); display: inline-flex; align-items: center; justify-content: center; color: var(--accent); }
.erpt-modules .mico svg { width: 18px; height: 18px; }
.erpt-modules strong { display: block; font-size: 14px; color: var(--ink-ink); font-weight: 600; margin-bottom: 2px; }
.erpt-modules span { display: block; font-size: 13px; color: var(--muted); line-height: 1.4; }

/* USE CASES */
.erpt-usecases { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; }
.erpt-usecase { padding: 28px; border: 1px solid var(--hairline); border-radius: 20px; background: #fff; }
.erpt-usecase-num { font-family: var(--font-number, ui-monospace, monospace); font-size: 12px; color: var(--muted); font-weight: 600; margin-bottom: 10px; letter-spacing: .05em; }
.erpt-usecase h3 { font-size: 18px; margin: 0 0 10px; font-weight: 600; letter-spacing: -.01em; color: var(--ink-ink); }
.erpt-usecase p { font-size: 14px; line-height: 1.6; color: var(--ink-soft); margin: 0; }

/* INTEGRATIONS */
.erpt-integrations { display: flex; flex-wrap: wrap; gap: 10px; padding: 0; margin: 0; list-style: none; }
.erpt-integrations li { padding: 10px 16px; background: #fff; border: 1px solid var(--hairline); border-radius: 12px; font-size: 14px; color: var(--ink-soft); font-weight: 500; }

/* ALTERNATIVES — comparison table */
.erpt-alt-table-wrap { border: 1px solid var(--hairline); border-radius: 20px; overflow: hidden; background: #fff; }
.erpt-alt-table { width: 100%; border-collapse: collapse; }
.erpt-alt-table thead th { text-align: left; padding: 18px 20px; background: var(--surface-2); border-bottom: 1px solid var(--hairline); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); }
.erpt-alt-table tbody td { padding: 20px; border-bottom: 1px solid var(--hairline); font-size: 14px; vertical-align: middle; color: var(--ink-soft); }
.erpt-alt-table tbody tr:last-child td { border-bottom: none; }
.erpt-alt-table tbody tr.is-self { background: rgba(255,72,0,.03); }
.erpt-alt-table tbody tr.is-self td:first-child { border-left: 3px solid var(--accent); padding-left: 17px; }
.erpt-alt-name { display: flex; align-items: center; gap: 12px; }
.erpt-alt-name .vmark { width: 36px; height: 36px; font-size: 14px; border-radius: 8px; }
.erpt-alt-name-text strong { display: block; color: var(--ink-ink); font-weight: 600; font-size: 15px; margin-bottom: 2px; }
.erpt-alt-name-text span { display: block; font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; font-weight: 600; }
.erpt-alt-link { display: inline-flex; align-items: center; gap: 4px; color: var(--ink-ink); font-weight: 600; text-decoration: none; font-size: 13px; }
.erpt-alt-link:hover { color: var(--accent); }
.erpt-alt-link svg { width: 14px; height: 14px; }
@media (max-width: 720px) {
	.erpt-alt-table thead { display: none; }
	.erpt-alt-table tbody td { display: block; padding: 8px 20px; border: none; }
	.erpt-alt-table tbody tr { display: block; padding: 20px 0; border-bottom: 1px solid var(--hairline); }
	.erpt-alt-table tbody td:first-child { padding-top: 20px; }
	.erpt-alt-table tbody td::before { content: attr(data-lbl); display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin-bottom: 2px; font-weight: 600; }
	.erpt-alt-table tbody td[data-lbl=""]::before { display: none; }
}

/* KCT VERDICT — big editorial callout */
.erpt-verdict { padding: clamp(48px, 5vw, 72px); background: var(--ink-ink); color: #fff; border-radius: 24px; position: relative; overflow: hidden; }
.erpt-verdict::before { content: ""; position: absolute; top: -100px; right: -100px; width: 500px; height: 500px; background: radial-gradient(circle, rgba(255,72,0,.25), transparent 60%); pointer-events: none; }
.erpt-verdict-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.6); margin-bottom: 20px; }
.erpt-verdict-eyebrow .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
.erpt-verdict h2 { color: #fff; font-size: clamp(28px, 3.4vw, 40px); line-height: 1.1; letter-spacing: -.02em; margin: 0 0 20px; max-width: 780px; font-weight: 600; }
.erpt-verdict-quote { font-size: clamp(20px, 2.2vw, 26px); line-height: 1.35; color: #fff; font-weight: 500; margin: 0 0 32px; max-width: 780px; letter-spacing: -.01em; padding-left: 20px; border-left: 3px solid var(--accent); }
.erpt-verdict-body { max-width: 780px; }
.erpt-verdict-body p { font-size: 16px; line-height: 1.65; color: rgba(255,255,255,.75); margin: 0 0 16px; }
.erpt-verdict-body p:last-child { margin-bottom: 0; }

/* PREV/NEXT */
.erpt-nextprev { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding-top: 24px; }
@media (max-width: 720px) { .erpt-nextprev { grid-template-columns: 1fr; } }
.erpt-nextprev a { display: flex; align-items: center; gap: 16px; padding: 24px; background: #fff; border: 1px solid var(--hairline); border-radius: 16px; text-decoration: none; color: inherit; transition: border-color .2s, transform .2s; }
.erpt-nextprev a:hover { border-color: var(--ink-ink); transform: translateY(-2px); }
.erpt-nextprev a.is-next { flex-direction: row-reverse; text-align: right; }
.erpt-nextprev .vmark { width: 44px; height: 44px; font-size: 16px; }
.erpt-nextprev .lbl { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 600; margin-bottom: 4px; }
.erpt-nextprev .nm { display: block; font-size: 16px; color: var(--ink-ink); font-weight: 600; }

/* CTA reuses site style but pinned into the flow */
.erpt-cta-wrap { padding: 0 0 100px; }
