/* /case-study/royalspin-roulette-platform-case-study — AISHTMLNEWDESIGN-547
   Page-owned styles. EVERY selector is scoped to #page-case-study-royalspin-roulette-platform-case-study
   or a csrr- 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 — "CHAIN OF CUSTODY".
   This record's own centre of gravity is not the wheel and not the clock, it
   is the LOG: unreliable betting logs replaced by a blockchain ledger so
   results can't be disputed. So the page is set as a case file moving through
   an evidentiary chain — opened, filed, entered into record, verified, sworn,
   closed. Kraft-file paper ground, near-black case-ink, one stamped
   verification red as the sole signal colour (no green, no cyan — both
   already claimed by this case study's roulette siblings: TRUE WHEEL,
   AISHTMLNEWDESIGN-504, and LATENCY BUDGET, AISHTMLNEWDESIGN-526). Section
   captions read as a file's own progress stamps, not generic labels. No
   wheel, no clock, no motion.

   Structural pattern carried forward from AISHTMLNEWDESIGN-504/526 (the two
   other roulette case studies, both gate-clean after review):
     · 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 own sentence and
       never restated above it. This record writes its results figure-first
       ("65% improvement in platform performance and speed."), so the split is
       clean and no separate lead-in line is needed
     · .csrr-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 on 504 */

#page-case-study-royalspin-roulette-platform-case-study{
  --csrr-ink:#1c1815;
  --csrr-ink-2:#262019;
  --csrr-steel:#a89a82;
  --csrr-steel-dim:#6b6050;
  --csrr-paper:#f6f1e6;
  --csrr-paper-2:#eee5d2;
  --csrr-rule:#ddd0b3;
  --csrr-rule-dark:#3a3226;
  --csrr-red:#8a2a1f;         /* paper-ground accent — stamped verification red */
  --csrr-red-lit:#e2604a;     /* on-dark readout — --csrr-red is unreadable on ink */
  --csrr-text:#241f19;
  --csrr-text-soft:#524738;
  --csrr-wrap:1180px;
  font-family:"Inter",system-ui,sans-serif;
  font-size:16px;
  line-height:1.6;
  color:var(--csrr-text);
  background:var(--csrr-paper);
}

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

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

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

#page-case-study-royalspin-roulette-platform-case-study .csrr-prose,
#page-case-study-royalspin-roulette-platform-case-study .csrr-body{
  font-size:18px;line-height:1.72;color:var(--csrr-text-soft);margin:0;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-link{
  color:var(--csrr-red);font-weight:600;box-shadow:inset 0 -1px 0 0 currentColor;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-link:hover{box-shadow:inset 0 -2px 0 0 currentColor;}

/* ── buttons — every section CTA is centred, matching the hero's ─────── */
#page-case-study-royalspin-roulette-platform-case-study .csrr-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-royalspin-roulette-platform-case-study .csrr-btn--red{background:var(--csrr-red);color:#fff;}
#page-case-study-royalspin-roulette-platform-case-study .csrr-btn--red:hover{background:#6c2018;}
#page-case-study-royalspin-roulette-platform-case-study .csrr-btn--ink{background:transparent;color:var(--csrr-ink);border-color:var(--csrr-ink);}
#page-case-study-royalspin-roulette-platform-case-study .csrr-btn--ink:hover{background:var(--csrr-ink);color:var(--csrr-paper);}
#page-case-study-royalspin-roulette-platform-case-study .csrr-btn:focus-visible{outline:3px solid var(--csrr-red);outline-offset:3px;}
#page-case-study-royalspin-roulette-platform-case-study .csrr-secact{margin-top:38px;text-align:center;}

/* ── hero — rule 24: image-free, full-bleed, static gradient ─────────── */
#page-case-study-royalspin-roulette-platform-case-study .csrr-hero{
  background:linear-gradient(168deg,#262019 0%,#1c1815 58%,#161310 100%);
  padding:clamp(72px,9vw,120px) 24px clamp(64px,8vw,104px);
  border-bottom:1px solid var(--csrr-rule-dark);
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-hero__inner{max-width:900px;margin:0 auto;text-align:center;}
#page-case-study-royalspin-roulette-platform-case-study .csrr-hero__eyebrow{
  font-size:16px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--csrr-steel);margin:0 0 20px;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-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-royalspin-roulette-platform-case-study .csrr-hero__lede{
  font-size:19px;line-height:1.7;color:#d1c8b8;margin:0 auto;max-width:760px;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-hero__act{margin-top:34px;}
#page-case-study-royalspin-roulette-platform-case-study .csrr-hero__stack{
  margin-top:46px;padding-top:30px;border-top:1px solid var(--csrr-rule-dark);
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-hero__stackh{
  font-size:16px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--csrr-steel);margin:0 0 16px;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-stack{
  list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-stack__item{
  font-size:16px;font-weight:600;color:#e7e0d2;
  padding:9px 16px;border:1px solid #453b2d;border-radius:2px;background:rgba(255,255,255,.03);
}

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

/* ── section index — the fixture list ───────────────────────────────── */
#page-case-study-royalspin-roulette-platform-case-study .csrr-index{
  background:var(--csrr-paper-2);border-bottom:1px solid var(--csrr-rule);padding:44px 0;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-index__h{
  font-size:18px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--csrr-steel-dim);margin:0 0 20px;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-index__list{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--csrr-rule);border:1px solid var(--csrr-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-royalspin-roulette-platform-case-study .csrr-index__item{
  display:flex;align-items:flex-start;gap:12px;height:100%;
  box-sizing:border-box;
  background:var(--csrr-paper);padding:18px 18px;
  transition:background-color .18s ease;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-index__item:hover{background:#fff;}
#page-case-study-royalspin-roulette-platform-case-study .csrr-index__item:focus-visible{outline:3px solid var(--csrr-red);outline-offset:-3px;}
#page-case-study-royalspin-roulette-platform-case-study .csrr-index__n{
  font-size:16px;font-weight:700;color:var(--csrr-red);font-variant-numeric:tabular-nums;padding-top:2px;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-index__t{font-size:17px;font-weight:600;line-height:1.45;color:var(--csrr-ink);}

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

/* ── solution mapping table ─────────────────────────────────────────── */
#page-case-study-royalspin-roulette-platform-case-study .csrr-map__scroll{
  margin-top:30px;overflow-x:auto;border:1px solid var(--csrr-rule);background:#fff;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-table{width:100%;border-collapse:collapse;min-width:820px;}
#page-case-study-royalspin-roulette-platform-case-study .csrr-table th{
  text-align:left;padding:14px 20px;background:var(--csrr-ink);color:#fff;
  font-size:16px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  border-bottom:2px solid var(--csrr-red);
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-table td{
  padding:18px 20px;vertical-align:top;
  font-size:17px;line-height:1.62;color:var(--csrr-text-soft);
  border:1px solid var(--csrr-rule);width:33.33%;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-table tbody tr:nth-child(even) td{background:var(--csrr-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-royalspin-roulette-platform-case-study .csrr-table th:not(:first-child),
#page-case-study-royalspin-roulette-platform-case-study .csrr-table td:not(:first-child){
  border-left:4px solid var(--csrr-red);
}

/* ── 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-royalspin-roulette-platform-case-study .csrr-stats{
  list-style:none;margin:34px 0 0;padding:0;
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-stats__item{
  background:var(--csrr-ink-2);border:1px solid var(--csrr-rule-dark);
  border-radius:3px;padding:30px 24px;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-stats__p{margin:0;font-size:17px;line-height:1.6;color:#d1c8b8;}
#page-case-study-royalspin-roulette-platform-case-study .csrr-stats__tail{display:block;}
#page-case-study-royalspin-roulette-platform-case-study .csrr-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(--csrr-red-lit);font-variant-numeric:tabular-nums;
}

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

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

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

/* ── CTA modal ──────────────────────────────────────────────────────── */
#page-case-study-royalspin-roulette-platform-case-study .csrr-modal{
  display:none;position:fixed;inset:0;z-index:9999;
  background:rgba(20,16,12,.72);padding: 100px 24px 24px 24px;overflow-y:auto;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-modal.is-open{display:flex;align-items:flex-start;justify-content:center;}
#page-case-study-royalspin-roulette-platform-case-study .csrr-modal__box{
  position:relative;width:100%;max-width:640px;margin:auto;
  background:#fff;border-radius:4px;padding:44px 12px 12px;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-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(--csrr-rule);border-radius:3px;
  color:var(--csrr-ink);cursor:pointer;font-size:16px;
}
#page-case-study-royalspin-roulette-platform-case-study .csrr-modal__x:hover{background:var(--csrr-paper-2);}
#page-case-study-royalspin-roulette-platform-case-study .csrr-modal__x:focus-visible{outline:3px solid var(--csrr-red);outline-offset:2px;}
#page-case-study-royalspin-roulette-platform-case-study .csrr-modal__box iframe{display:block;width:100%;min-height:560px;border:0;}

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

  /* the mapping table becomes labelled records; the desktop rules would be noise */
  #page-case-study-royalspin-roulette-platform-case-study .csrr-map__scroll{overflow-x:visible;background:transparent;border:0;}
  #page-case-study-royalspin-roulette-platform-case-study .csrr-table{min-width:0;}
  #page-case-study-royalspin-roulette-platform-case-study .csrr-table thead{
    position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;
  }
  #page-case-study-royalspin-roulette-platform-case-study .csrr-table tbody tr{
    display:block;margin-bottom:16px;background:#fff;border:1px solid var(--csrr-rule);
  }
  #page-case-study-royalspin-roulette-platform-case-study .csrr-table tbody tr:nth-child(even) td{background:transparent;}
  #page-case-study-royalspin-roulette-platform-case-study .csrr-table td{display:block;width:auto;border:0;padding:14px 18px;}
  #page-case-study-royalspin-roulette-platform-case-study .csrr-table td+td{border-top:1px solid var(--csrr-rule);}
  #page-case-study-royalspin-roulette-platform-case-study .csrr-table th:not(:first-child),
  #page-case-study-royalspin-roulette-platform-case-study .csrr-table td:not(:first-child){border-left:0;}
  #page-case-study-royalspin-roulette-platform-case-study .csrr-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(--csrr-red);
  }
}