/* /case-study/proplay-fantasy-sports-app-case-study — AISHTMLNEWDESIGN-512
   Page-owned styles. EVERY selector is scoped to #page-case-study-proplay-fantasy-sports-app-case-study
   or a cspf- prefixed class: this sheet must never style body, a bare element,
   #ais-header or #ais-footer. The document reset (html,body{margin:0}) is owned
   by the shared layout sheet. Font is Inter; no body/UI text below 16px.

   VISUAL DIRECTION — "MATCHDAY LEDGER".
   A fantasy platform is judged on two things: did it score fairly, and did the
   money settle. So the page is set as a matchday's own accounting rather than a
   stadium shot — cool slate ground, ruled paper for the written record, one
   pitch-green accent, fixture-number indexing (01–06), hairline rules doing the
   work that boxes and shadows usually do. No crowds, no motion, no turf texture.

   Built carrying the corrections that AISHTMLNEWDESIGN-504 needed across six
   review rounds, so they do not have to be found again here:
     · table column dividers are a 4px accent rule, not a 1px hairline — a
       hairline does not read as a column division at this size
     · no column in the table is bold; the three are peers
     · no table caption
     · every section CTA is centred, matching the hero's
     · the ROI figure is promoted IN PLACE inside the record's sentence rather
       than restated above it, so no number is printed twice
     · .cspf-index__item carries box-sizing:border-box — without it, height:100%
       plus padding overflows the grid cell and paints over the row gap, which
       is what hid that grid's row divider */

#page-case-study-proplay-fantasy-sports-app-case-study{
  --cspf-ink:#161d22;
  --cspf-ink-2:#1e272d;
  --cspf-steel:#8d98a1;
  --cspf-steel-dim:#5c666d;
  --cspf-paper:#f6f6f3;
  --cspf-paper-2:#eeeeea;
  --cspf-rule:#dcdcd4;
  --cspf-rule-dark:#2c353b;
  --cspf-green:#1a7f4b;        /* paper-ground accent */
  --cspf-green-lit:#43d183;    /* on-dark readout — --cspf-green is unreadable on ink */
  --cspf-text:#21282d;
  --cspf-text-soft:#4c565d;
  --cspf-wrap:1180px;
  font-family:"Inter",system-ui,sans-serif;
  font-size:16px;
  line-height:1.6;
  color:var(--cspf-text);
  background:var(--cspf-paper);
}

/* ── shared shells ──────────────────────────────────────────────────── */
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-wrap{max-width:var(--cspf-wrap);margin:0 auto;padding:0 24px;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-wrap--read{max-width:820px;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-sec{padding:76px 0;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-sec--paper{background:var(--cspf-paper);}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-sec--paper2{background:var(--cspf-paper-2);}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-sec--ink{background:var(--cspf-ink);}

#page-case-study-proplay-fantasy-sports-app-case-study .cspf-h2{
  font-size:clamp(32px,4vw,48px);line-height:1.12;font-weight:800;
  letter-spacing:-.02em;margin:0 0 22px;color:var(--cspf-ink);
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-h2--light{color:var(--cspf-paper);}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-h2--centre{text-align:center;}

#page-case-study-proplay-fantasy-sports-app-case-study .cspf-kicker{
  display:flex;align-items:center;gap:10px;
  font-size:16px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--cspf-steel-dim);margin:0 0 14px;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-kicker--light{color:var(--cspf-steel);}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-kicker--centre{justify-content:center;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-kicker__n{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:34px;height:26px;padding:0 8px;border-radius:2px;
  background:var(--cspf-green);color:#fff;
  font-size:16px;font-weight:700;letter-spacing:.04em;font-variant-numeric:tabular-nums;
}

#page-case-study-proplay-fantasy-sports-app-case-study .cspf-prose,
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-body{
  font-size:18px;line-height:1.72;color:var(--cspf-text-soft);margin:0;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-link{
  color:var(--cspf-green);font-weight:600;box-shadow:inset 0 -1px 0 0 currentColor;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-link:hover{box-shadow:inset 0 -2px 0 0 currentColor;}

/* ── buttons — every section CTA is centred, matching the hero's ─────── */
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:54px;padding:0 32px;border:1px solid transparent;border-radius:3px;
  font-family:inherit;font-size:17px;font-weight:700;letter-spacing:.01em;
  cursor:pointer;transition:background-color .18s ease,color .18s ease,border-color .18s ease;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-btn--green{background:var(--cspf-green);color:#fff;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-btn--green:hover{background:#15683d;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-btn--ink{background:transparent;color:var(--cspf-ink);border-color:var(--cspf-ink);}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-btn--ink:hover{background:var(--cspf-ink);color:var(--cspf-paper);}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-btn:focus-visible{outline:3px solid var(--cspf-green);outline-offset:3px;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-secact{margin-top:38px;text-align:center;}

/* ── hero — rule 24: image-free, full-bleed, static gradient ─────────── */
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-hero{
  background:linear-gradient(170deg,#1e272d 0%,#161d22 58%,#11171b 100%);
  padding:clamp(72px,9vw,120px) 24px clamp(64px,8vw,104px);
  border-bottom:1px solid var(--cspf-rule-dark);
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-hero__inner{max-width:900px;margin:0 auto;text-align:center;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-hero__eyebrow{
  font-size:16px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cspf-steel);margin:0 0 20px;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-hero__h1{
  font-size:clamp(36px,5vw,60px);line-height:1.07;font-weight:800;
  letter-spacing:-.025em;color:#fff;margin:0 0 24px;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-hero__lede{
  font-size:19px;line-height:1.7;color:#c1cad1;margin:0 auto;max-width:760px;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-hero__act{margin-top:34px;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-hero__stack{
  margin-top:46px;padding-top:30px;border-top:1px solid var(--cspf-rule-dark);
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-hero__stackh{
  font-size:16px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--cspf-steel);margin:0 0 16px;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-stack{
  list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-stack__item{
  font-size:16px;font-weight:600;color:#dde3e8;
  padding:9px 16px;border:1px solid #37424a;border-radius:2px;background:rgba(255,255,255,.03);
}

/* ── breadcrumb ─────────────────────────────────────────────────────── */
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-crumb{background:var(--cspf-paper);border-bottom:1px solid var(--cspf-rule);}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-crumb__bar{
  display:flex;align-items:center;flex-wrap:wrap;gap:8px;
  padding:16px 0;font-size:16px;color:var(--cspf-text-soft);
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-crumb__bar a{color:var(--cspf-text-soft);font-weight:500;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-crumb__bar a:hover{color:var(--cspf-green);}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-crumb__back{display:inline-flex;align-items:center;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-crumb__back img{display:block;width:14px;height:14px;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-crumb__sep{color:var(--cspf-steel);}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-crumb__here{color:var(--cspf-ink);font-weight:600;}

/* ── section index — the fixture list ───────────────────────────────── */
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-index{
  background:var(--cspf-paper-2);border-bottom:1px solid var(--cspf-rule);padding:44px 0;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-index__h{
  font-size:18px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--cspf-steel-dim);margin:0 0 20px;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-index__list{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--cspf-rule);border:1px solid var(--cspf-rule);
}
/* box-sizing is NOT optional here. The shared layout sheet does not set
   border-box for this element, and height:100% plus 18px of vertical padding
   under content-box measures taller than the grid cell — the link then overflows
   its <li> and paints paper over the 1px ROW gap, while the column gaps survive
   because the overflow is vertical only. That is exactly how 504 lost its row
   divider, and it is invisible in the CSS unless you know to look. */
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-index__item{
  display:flex;align-items:flex-start;gap:12px;height:100%;
  box-sizing:border-box;
  background:var(--cspf-paper);padding:18px 18px;
  transition:background-color .18s ease;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-index__item:hover{background:#fff;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-index__item:focus-visible{outline:3px solid var(--cspf-green);outline-offset:-3px;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-index__n{
  font-size:16px;font-weight:700;color:var(--cspf-green);font-variant-numeric:tabular-nums;padding-top:2px;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-index__t{font-size:17px;font-weight:600;line-height:1.45;color:var(--cspf-ink);}

/* ── challenges ─────────────────────────────────────────────────────── */
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-chlist{list-style:none;margin:34px 0 0;padding:0;counter-reset:cspf-ch;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-chlist__item{
  counter-increment:cspf-ch;display:flex;gap:20px;padding:24px 0;border-top:1px solid var(--cspf-rule);
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-chlist__item:last-child{border-bottom:1px solid var(--cspf-rule);}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-chlist__item::before{
  content:counter(cspf-ch,decimal-leading-zero);
  flex:0 0 auto;width:44px;height:44px;border-radius:50%;
  border:1px solid var(--cspf-ink);color:var(--cspf-ink);
  display:flex;align-items:center;justify-content:center;
  font-size:16px;font-weight:700;font-variant-numeric:tabular-nums;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-chlist__t{font-size:22px;font-weight:700;line-height:1.3;color:var(--cspf-ink);margin:0 0 8px;}

/* ── solution mapping table ─────────────────────────────────────────── */
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-map__scroll{
  margin-top:30px;overflow-x:auto;border:1px solid var(--cspf-rule);background:#fff;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-table{width:100%;border-collapse:collapse;min-width:820px;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-table th{
  text-align:left;padding:14px 20px;background:var(--cspf-ink);color:#fff;
  font-size:16px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  border-bottom:2px solid var(--cspf-green);
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-table td{
  padding:18px 20px;vertical-align:top;
  font-size:17px;line-height:1.62;color:var(--cspf-text-soft);
  border:1px solid var(--cspf-rule);width:33.33%;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-table tbody tr:nth-child(even) td{background:var(--cspf-paper);}
/* COLUMN DIVIDERS: a 4px accent rule on the left edge of Solution and Result, so
   it runs the full height of the table through header and body as one unbroken
   line. A 1px hairline was tried on 504 and is not what a reader registers as a
   column division at this size. No column is bold — the three are peers. */
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-table th:not(:first-child),
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-table td:not(:first-child){
  border-left:4px solid var(--cspf-green);
}

/* ── measurable results — the ledger board ──────────────────────────── */
/* Four readouts in a row. The percentage is promoted to its own line at display
   size IN PLACE, inside the record's own sentence — one copy, original word
   order, not a word altered. Restating the figure above the sentence prints the
   number twice, which is a content change; the record is verbatim. */
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-stats{
  list-style:none;margin:34px 0 0;padding:0;
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-stats__item{
  background:var(--cspf-ink-2);border:1px solid var(--cspf-rule-dark);
  border-radius:3px;padding:30px 24px;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-stats__p{margin:0;font-size:17px;line-height:1.6;color:#c1cad1;}
/* the lead reserves two lines so all four figures land on one baseline */
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-stats__lead{display:block;min-height:3.2em;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-stats__tail{display:block;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-stats__fig{
  display:block;margin:2px 0 4px;
  font-size:clamp(38px,4vw,54px);line-height:1.04;font-weight:800;
  letter-spacing:-.03em;color:var(--cspf-green-lit);font-variant-numeric:tabular-nums;
}

/* ── why AIS ────────────────────────────────────────────────────────── */
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-whylist{
  list-style:none;margin:32px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:26px;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-whylist__item{
  padding:26px 26px 28px;background:#fff;border:1px solid var(--cspf-rule);
  border-top:3px solid var(--cspf-green);border-radius:2px;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-whylist__t{font-size:21px;font-weight:700;line-height:1.3;color:var(--cspf-ink);margin:0 0 10px;}

/* ── client quote ───────────────────────────────────────────────────── */
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-quote__fig{margin:28px 0 0;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-quote__bq{margin:0;padding:30px 0 0;border-top:2px solid var(--cspf-ink);}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-quote__p{
  margin:0;font-size:clamp(22px,2.6vw,30px);line-height:1.5;
  font-weight:600;letter-spacing:-.01em;color:var(--cspf-ink);
}

/* ── area we serve ──────────────────────────────────────────────────── */
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-servelist{
  list-style:none;margin:34px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:22px;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-servelist__item{
  padding:24px 22px;background:var(--cspf-paper-2);border:1px solid var(--cspf-rule);border-radius:2px;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-servelist__r{
  display:flex;align-items:center;gap:8px;margin:0 0 12px;
  font-size:16px;font-weight:700;letter-spacing:.1em;color:var(--cspf-ink);
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-servelist__r img{display:block;width:14px;height:14px;flex:0 0 auto;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-tel{display:inline-block;margin:0 0 10px;font-size:18px;font-weight:700;color:var(--cspf-green);}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-tel:hover{color:#15683d;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-servelist__item .cspf-body{font-size:16px;line-height:1.62;}

/* ── CTA modal ──────────────────────────────────────────────────────── */
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-modal{
  display:none;position:fixed;inset:0;z-index:9999;
  background:rgba(11,15,18,.72);padding: 100px 24px 24px 24px;overflow-y:auto;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-modal.is-open{display:flex;align-items:flex-start;justify-content:center;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-modal__box{
  position:relative;width:100%;max-width:640px;margin:auto;
  background:#fff;border-radius:4px;padding:44px 12px 12px;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-modal__x{
  position:absolute;top:10px;right:10px;
  width:36px;height:36px;display:flex;align-items:center;justify-content:center;
  background:transparent;border:1px solid var(--cspf-rule);border-radius:3px;
  color:var(--cspf-ink);cursor:pointer;font-size:16px;
}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-modal__x:hover{background:var(--cspf-paper-2);}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-modal__x:focus-visible{outline:3px solid var(--cspf-green);outline-offset:2px;}
#page-case-study-proplay-fantasy-sports-app-case-study .cspf-modal__box iframe{display:block;width:100%;min-height:560px;border:0;}

/* ── responsive ─────────────────────────────────────────────────────── */
@media (max-width:1024px){
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-index__list{grid-template-columns:repeat(2,1fr);}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-servelist{grid-template-columns:repeat(2,1fr);}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-stats{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:760px){
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-sec{padding:56px 0;}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-index__list{grid-template-columns:1fr;}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-stats{grid-template-columns:1fr;}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-whylist{grid-template-columns:1fr;}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-servelist{grid-template-columns:1fr;}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-btn{width:100%;}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-stack{justify-content:flex-start;}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-hero__inner{text-align:left;}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-hero__lede{margin-left:0;}

  /* the mapping table becomes labelled records; the desktop rules would be noise */
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-map__scroll{overflow-x:visible;background:transparent;border:0;}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-table{min-width:0;}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-table thead{
    position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;
  }
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-table tbody tr{
    display:block;margin-bottom:16px;background:#fff;border:1px solid var(--cspf-rule);
  }
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-table tbody tr:nth-child(even) td{background:transparent;}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-table td{display:block;width:auto;border:0;padding:14px 18px;}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-table td+td{border-top:1px solid var(--cspf-rule);}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-table th:not(:first-child),
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-table td:not(:first-child){border-left:0;}
  #page-case-study-proplay-fantasy-sports-app-case-study .cspf-table td::before{
    content:attr(data-th);display:block;margin-bottom:6px;
    font-size:16px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--cspf-green);
  }
}
