/* ══════════════════════════════════════════════════════════════════════════
   /blackjack-game-development — page-isolated stylesheet
   AISHTMLNEWDESIGN-325

   Visual direction: "Ivory Table" — a two-suit card system. Ink black, bone
   ivory and a single suit-crimson accent, composed as a dealt hand rather
   than a card grid, so this page does not read as a clone of the roulette
   (green/gold) or Canada (indigo/maple) pages in this repo.

   Every rule is scoped to #page-blackjack-game-development, so this file can
   never touch the shared header/footer (owned by /assets/css/layout.css).

   Design contract (.claude/skills/frontend-design/SKILL.md):
     · rule  7 — Inter is the primary family
     · rule  8 — nothing below 16px
     · rule 11 — no muted slate body copy on light backgrounds (#2b2521 floor)
     · rule 24 — image-free full-bleed hero, centred readable column
     · rule 25 — one CTA per section, every label unique
     · rule 26 — no running animation: no @keyframes, no infinite; every
                 transition is a finite response to hover / focus / click
   ══════════════════════════════════════════════════════════════════════════ */

/* The browser default is body{margin:8px}. layout.css does not reset it, and
   every reset in this file is scoped inside #page-blackjack-game-development,
   so nothing was clearing it — leaving an 8px white gutter down all four edges
   of the page, header and footer included (the same defect fixed on
   /roulette-game-development in cc129e96a). */
body{margin:0;}

#page-blackjack-game-development{
  /* ── palette ─────────────────────────────────────────────────────────── */
  --ink:#141210;          /* table shadow          */
  --ink-2:#201c18;        /* raised ink surface    */
  --ink-3:#3a322b;        /* ink hairline          */
  --bone:#f7f2e8;         /* ivory surface         */
  --bone-2:#efe7d8;       /* deeper ivory          */
  --paper:#ffffff;
  --line:#e3dbcd;
  --line-strong:#cbbfa9;
  --body:#2b2521;         /* AA on white + bone    */
  --body-dark:#e6ded1;    /* AA on ink             */
  --strong:#141210;
  --red:#b3122b;          /* the one accent        */
  --red-deep:#8d0d21;
  --red-soft:#f0798d;     /* accent on ink         */
  --red-tint:#fbeef0;

  --wrap:1240px;
  --gut:clamp(20px,4vw,40px);
  --sec:clamp(58px,7vw,104px);
  --r:16px;

  font-family:"Inter",system-ui,sans-serif;
  font-size:16px;
  line-height:1.65;
  color:var(--body);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  font-variant-numeric:tabular-nums;
}

/* ── self-contained resets (never inherit ambient globals) ──────────────── */
#page-blackjack-game-development *,
#page-blackjack-game-development *::before,
#page-blackjack-game-development *::after{box-sizing:border-box;}
#page-blackjack-game-development h1,
#page-blackjack-game-development h2,
#page-blackjack-game-development h3,
#page-blackjack-game-development h4,
#page-blackjack-game-development p,
#page-blackjack-game-development ul,
#page-blackjack-game-development ol,
#page-blackjack-game-development figure,
#page-blackjack-game-development blockquote{margin:0;}
#page-blackjack-game-development ul,
#page-blackjack-game-development ol{list-style:none;padding:0;}
#page-blackjack-game-development img{max-width:100%;height:auto;display:block;}
#page-blackjack-game-development h1,
#page-blackjack-game-development h2,
#page-blackjack-game-development h3,
#page-blackjack-game-development h4{
  color:var(--strong);font-weight:800;letter-spacing:-.022em;line-height:1.16;
}

/* ── layout primitives ──────────────────────────────────────────────────── */
#page-blackjack-game-development .bj-wrap{
  width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut);
}
#page-blackjack-game-development .bj-sec{padding-block:var(--sec);position:relative;}
#page-blackjack-game-development .bj-sec--bone{background:var(--bone);}
#page-blackjack-game-development .bj-sec--paper{background:var(--paper);}
#page-blackjack-game-development .bj-sec--ink{
  background:linear-gradient(178deg,#191512 0%,#141210 58%,#1b1613 100%);
  color:var(--body-dark);
}
#page-blackjack-game-development .bj-sec--ink h2,
#page-blackjack-game-development .bj-sec--ink h3,
#page-blackjack-game-development .bj-sec--ink h4{color:#fff;}

/* static suit lattice — a geometric pattern, no motion, no raster image */
#page-blackjack-game-development .bj-weave::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 1px,transparent 1px 64px),
    repeating-linear-gradient(-45deg,rgba(179,18,43,.14) 0 1px,transparent 1px 64px);
  mask-image:linear-gradient(180deg,rgba(0,0,0,.9),transparent 76%);
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.9),transparent 76%);
}
#page-blackjack-game-development .bj-sec--ink > *{position:relative;z-index:1;}

/* ── section heads: hairline-led, asymmetric ────────────────────────────── */
#page-blackjack-game-development .bj-head{
  display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:clamp(18px,4vw,60px);align-items:end;
  border-top:2px solid var(--ink);padding-top:clamp(18px,2.4vw,28px);
  margin-bottom:clamp(32px,4.2vw,58px);
}
#page-blackjack-game-development .bj-sec--ink .bj-head{border-top-color:var(--ink-3);}
#page-blackjack-game-development .bj-head--solo{grid-template-columns:minmax(0,1fr);}
/* centred head — used by the FAQ. The eyebrow is a flex row with a suit glyph,
   so it needs its own justify-content; text-align alone would not move it. */
#page-blackjack-game-development .bj-head--center{
  grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;
}
#page-blackjack-game-development .bj-head--center .bj-eyebrow{justify-content:center;}
#page-blackjack-game-development .bj-head--center .bj-h2{max-width:26ch;margin-inline:auto;}
#page-blackjack-game-development .bj-eyebrow{
  display:flex;align-items:center;gap:10px;
  font-size:16px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--red);margin-bottom:14px;
}
#page-blackjack-game-development .bj-eyebrow::before{
  content:"\2660\a0\2665";letter-spacing:.02em;font-size:15px;line-height:1;
}
#page-blackjack-game-development .bj-sec--ink .bj-eyebrow{color:var(--red-soft);}
#page-blackjack-game-development .bj-h2{font-size:clamp(28px,3.4vw,46px);max-width:22ch;}
#page-blackjack-game-development .bj-h2--wide{max-width:32ch;}
#page-blackjack-game-development .bj-h2 em{font-style:normal;color:var(--red);}
#page-blackjack-game-development .bj-sec--ink .bj-h2 em{color:var(--red-soft);}
#page-blackjack-game-development .bj-lede{font-size:clamp(17px,1.5vw,19px);color:var(--body);}
#page-blackjack-game-development .bj-sec--ink .bj-lede{color:var(--body-dark);}
#page-blackjack-game-development .bj-copy p{font-size:17px;color:var(--body);}
#page-blackjack-game-development .bj-copy p + p{margin-top:18px;}
#page-blackjack-game-development .bj-sec--ink .bj-copy p{color:var(--body-dark);}
#page-blackjack-game-development .bj-copy a{
  color:var(--red);font-weight:600;
  border-bottom:2px solid rgba(179,18,43,.28);
  transition:border-color .18s ease,color .18s ease;
}
#page-blackjack-game-development .bj-copy a:hover{color:var(--red-deep);border-bottom-color:var(--red-deep);}
#page-blackjack-game-development .bj-sec--ink .bj-copy a{color:var(--red-soft);border-bottom-color:rgba(240,121,141,.4);}
#page-blackjack-game-development .bj-sec--ink .bj-copy a:hover{color:#fff;border-bottom-color:#fff;}

/* ── buttons ────────────────────────────────────────────────────────────── */
#page-blackjack-game-development .bj-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:52px;padding:14px 30px;border:2px solid transparent;border-radius:6px;
  font:inherit;font-size:17px;font-weight:700;letter-spacing:-.01em;
  cursor:pointer;text-align:center;
  transition:background-color .18s ease,color .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
#page-blackjack-game-development .bj-btn--red{
  background:var(--red);color:#fff;box-shadow:0 10px 26px -14px rgba(179,18,43,.9);
}
#page-blackjack-game-development .bj-btn--red:hover{background:var(--red-deep);transform:translateY(-2px);}
#page-blackjack-game-development .bj-btn--ink{background:var(--ink);color:#fff;}
#page-blackjack-game-development .bj-btn--ink:hover{background:var(--ink-2);transform:translateY(-2px);}
#page-blackjack-game-development .bj-btn--bone{background:var(--bone);color:var(--ink);border-color:var(--bone);}
#page-blackjack-game-development .bj-btn--bone:hover{background:transparent;color:#fff;border-color:#fff;}
#page-blackjack-game-development .bj-btn--outline{background:transparent;color:var(--ink);border-color:var(--line-strong);}
#page-blackjack-game-development .bj-btn--outline:hover{background:var(--ink);color:#fff;border-color:var(--ink);}
#page-blackjack-game-development .bj-btn:active{transform:translateY(0);}
#page-blackjack-game-development a:focus-visible,
#page-blackjack-game-development button:focus-visible,
#page-blackjack-game-development summary:focus-visible{
  outline:3px solid var(--red);outline-offset:3px;border-radius:6px;
}
#page-blackjack-game-development .bj-sec--ink a:focus-visible,
#page-blackjack-game-development .bj-sec--ink button:focus-visible,
#page-blackjack-game-development .bj-hero button:focus-visible{outline-color:#ffb9c5;}
#page-blackjack-game-development .bj-textlink{
  font-weight:700;color:var(--red);border-bottom:2px solid rgba(179,18,43,.32);
  transition:border-color .18s ease,color .18s ease;
}
#page-blackjack-game-development .bj-textlink:hover{color:var(--red-deep);border-bottom-color:var(--red-deep);}
#page-blackjack-game-development .bj-sec--ink .bj-textlink{color:var(--red-soft);border-bottom-color:rgba(240,121,141,.45);}
#page-blackjack-game-development .bj-sec--ink .bj-textlink:hover{color:#fff;border-bottom-color:#fff;}
#page-blackjack-game-development .bj-act{margin-top:clamp(28px,3.4vw,44px);}
#page-blackjack-game-development .bj-act--center{text-align:center;}

/* ══ HERO — rule 24: full-bleed, image-free, centred 900px column ═════════ */
#page-blackjack-game-development .bj-hero{
  width:100%;position:relative;overflow:hidden;
  padding:clamp(92px,11.5vw,168px) var(--gut) clamp(76px,8.5vw,124px);
  background:
    radial-gradient(120% 76% at 82% -8%,rgba(179,18,43,.42) 0%,rgba(179,18,43,0) 56%),
    radial-gradient(88% 66% at 2% 4%,rgba(255,255,255,.09) 0%,rgba(255,255,255,0) 60%),
    linear-gradient(166deg,#1d1815 0%,#141210 52%,#0e0c0b 100%);
  color:#efe8dd;
  border-bottom:1px solid var(--ink-3);
}
/* static card-back diamond weave — pure CSS, no motion, no image */
#page-blackjack-game-development .bj-hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 1px,transparent 1px 58px),
    repeating-linear-gradient(-45deg,rgba(255,255,255,.05) 0 1px,transparent 1px 58px);
  mask-image:radial-gradient(78% 76% at 50% 34%,rgba(0,0,0,.85),transparent 74%);
  -webkit-mask-image:radial-gradient(78% 76% at 50% 34%,rgba(0,0,0,.85),transparent 74%);
}
#page-blackjack-game-development .bj-hero__inner{
  max-width:900px;margin-inline:auto;text-align:center;position:relative;z-index:1;
}
#page-blackjack-game-development .bj-hero__tag{
  display:inline-flex;align-items:center;justify-content:center;
  flex-wrap:wrap;gap:4px 12px;text-align:center;
  font-size:16px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;
  color:#ffd0d8;background:rgba(179,18,43,.2);
  border:1px solid rgba(240,121,141,.45);border-radius:999px;padding:9px 22px;
}
#page-blackjack-game-development .bj-hero__tag b{color:#fff;letter-spacing:.18em;}
#page-blackjack-game-development .bj-hero h1{
  color:#fff;font-size:clamp(38px,5.5vw,72px);line-height:1.05;letter-spacing:-.036em;
  margin:clamp(20px,2.6vw,30px) 0 0;
}
#page-blackjack-game-development .bj-hero h1 em{
  font-style:normal;color:#ff9dae;
  background:linear-gradient(180deg,rgba(255,157,174,0) 68%,rgba(179,18,43,.5) 68%);
}
#page-blackjack-game-development .bj-hero__copy{
  font-size:clamp(18px,1.65vw,21px);line-height:1.65;color:#e6ded1;
  margin:clamp(22px,2.6vw,30px) auto 0;max-width:860px;
}
#page-blackjack-game-development .bj-hero .bj-btn{margin-top:clamp(26px,3vw,36px);}
#page-blackjack-game-development .bj-hero__facts{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;
  margin-top:clamp(34px,4.2vw,56px);text-align:left;
}
#page-blackjack-game-development .bj-hero__facts > div{
  border:1px solid rgba(255,255,255,.14);border-radius:12px;
  background:rgba(255,255,255,.045);padding:18px 20px;
}
#page-blackjack-game-development .bj-hero__facts b{
  display:block;color:#fff;font-size:18px;font-weight:800;letter-spacing:-.02em;
}
#page-blackjack-game-development .bj-hero__facts span{
  display:block;margin-top:6px;font-size:16px;line-height:1.5;color:#d6cdbf;
}

/* ── breadcrumb strip ───────────────────────────────────────────────────── */
#page-blackjack-game-development .bj-crumbbar{background:var(--bone-2);border-bottom:1px solid var(--line);}
#page-blackjack-game-development .bj-crumb{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding-block:14px;font-size:16px;color:var(--body);
}
#page-blackjack-game-development .bj-crumb a{font-weight:600;color:var(--red);}
#page-blackjack-game-development .bj-crumb a:hover{color:var(--red-deep);}
#page-blackjack-game-development .bj-crumb span[aria-current]{font-weight:700;color:var(--ink);}
#page-blackjack-game-development .bj-crumb img{width:16px;height:16px;}

/* ── intro: product frame + copy ────────────────────────────────────────── */
#page-blackjack-game-development .bj-intro{
  display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  gap:clamp(28px,5vw,72px);align-items:center;
}
#page-blackjack-game-development .bj-frame{
  position:relative;border:2px solid var(--ink);border-radius:var(--r);
  background:var(--bone);padding:14px;
}
#page-blackjack-game-development .bj-frame img{border-radius:8px;width:100%;}
#page-blackjack-game-development .bj-frame figcaption{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-top:12px;font-size:16px;font-weight:700;color:var(--ink);
}
#page-blackjack-game-development .bj-frame figcaption span:last-child{color:var(--red);letter-spacing:.12em;}

/* ── partner band ───────────────────────────────────────────────────────── */
#page-blackjack-game-development .bj-partner{
  position:relative;overflow:hidden;color:#f3ece1;
  padding-block:clamp(56px,6.6vw,96px);
  background-color:#141210;
  background-image:
    linear-gradient(100deg,rgba(20,18,16,.96) 0%,rgba(20,18,16,.86) 44%,rgba(179,18,43,.62) 100%),
    url("https://aiscmsapi.aistechnolabs.com/product_images/collaborate-bg.webp");
  background-size:cover;background-position:center;
}
#page-blackjack-game-development .bj-partner__inner{max-width:760px;}
#page-blackjack-game-development .bj-partner h2{color:#fff;font-size:clamp(27px,3.2vw,42px);}
#page-blackjack-game-development .bj-partner p{margin-top:18px;font-size:clamp(17px,1.5vw,19px);color:#e9e0d4;}

/* ── the hand: five feature cards with a rank + suit index ──────────────── */
/* flex, not grid: five cards deal 3 + 2, and the short row centres itself
   instead of leaving a hole in the third column. Every card keeps the same
   width and, within a row, the same height. */
#page-blackjack-game-development .bj-hand{
  display:flex;flex-wrap:wrap;justify-content:center;
  gap:clamp(16px,2vw,24px);
}
#page-blackjack-game-development .bj-hand > .bj-play{
  flex:0 1 calc(33.333% - clamp(16px,2vw,24px));min-width:270px;
}
#page-blackjack-game-development .bj-play{
  position:relative;background:var(--paper);border:2px solid var(--ink);
  border-radius:14px;padding:clamp(24px,2.6vw,32px);
  box-shadow:6px 6px 0 0 rgba(20,18,16,.08);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
#page-blackjack-game-development .bj-play:hover{
  transform:translateY(-4px) rotate(-.6deg);
  box-shadow:10px 12px 0 0 rgba(179,18,43,.16);border-color:var(--red);
}
#page-blackjack-game-development .bj-play::before,
#page-blackjack-game-development .bj-play::after{
  position:absolute;font-weight:800;font-size:17px;line-height:1;letter-spacing:-.02em;
  color:var(--ink);
}
#page-blackjack-game-development .bj-play::before{content:attr(data-rank);top:14px;left:16px;}
#page-blackjack-game-development .bj-play::after{content:attr(data-rank);bottom:14px;right:16px;transform:rotate(180deg);}
#page-blackjack-game-development .bj-play--red::before,
#page-blackjack-game-development .bj-play--red::after{color:var(--red);}
#page-blackjack-game-development .bj-play__pip{
  display:block;font-size:26px;line-height:1;margin-bottom:16px;color:var(--ink);
}
#page-blackjack-game-development .bj-play--red .bj-play__pip{color:var(--red);}
#page-blackjack-game-development .bj-play h3{font-size:21px;margin-bottom:12px;}
#page-blackjack-game-development .bj-play p{font-size:16.5px;color:var(--body);}

/* ── ledger rows (HTML5 capabilities) ───────────────────────────────────── */
#page-blackjack-game-development .bj-ledger{border-top:1px solid var(--ink-3);}
#page-blackjack-game-development .bj-row{
  display:grid;grid-template-columns:88px minmax(0,1fr) minmax(0,1.5fr);
  gap:clamp(14px,3vw,40px);align-items:start;
  padding-block:clamp(24px,3vw,34px);border-bottom:1px solid var(--ink-3);
  transition:background-color .18s ease;
}
#page-blackjack-game-development .bj-row:hover{background:rgba(255,255,255,.035);}
#page-blackjack-game-development .bj-row__n{
  font-size:17px;font-weight:800;letter-spacing:.14em;color:var(--red-soft);padding-top:4px;
}
#page-blackjack-game-development .bj-row h3{font-size:clamp(20px,2vw,26px);}
#page-blackjack-game-development .bj-row p{font-size:17px;color:var(--body-dark);}

/* ── hire band ──────────────────────────────────────────────────────────── */
#page-blackjack-game-development .bj-hire{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(28px,5vw,64px);align-items:center;
}
#page-blackjack-game-development .bj-hire h2{font-size:clamp(26px,3vw,40px);}
#page-blackjack-game-development .bj-hire__acts{
  display:flex;flex-wrap:wrap;gap:22px;align-items:center;margin-top:clamp(26px,3vw,36px);
}
#page-blackjack-game-development .bj-hire img{border-radius:var(--r);}

/* ── essay + pull quote ─────────────────────────────────────────────────── */
#page-blackjack-game-development .bj-essay{
  display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);
  gap:clamp(26px,4.5vw,64px);align-items:start;
}
#page-blackjack-game-development .bj-pull{
  border-left:4px solid var(--red);background:var(--bone);border-radius:0 12px 12px 0;
  padding:clamp(22px,2.6vw,30px);
}
#page-blackjack-game-development .bj-pull p{font-size:19px;font-weight:600;color:var(--ink);line-height:1.5;}
#page-blackjack-game-development .bj-pull span{
  display:flex;align-items:center;gap:10px;margin-top:16px;
  font-size:16px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--red);
}
#page-blackjack-game-development .bj-pull img{width:22px;height:22px;}

/* ── FAQ — numbered ledger. Each row carries a Qn index in front of the
   question and an "Ans." lead-in on the answer, so a scanned page still reads
   as a question-and-answer list when nothing is expanded. The index and the
   lead-in are presentation: the <h3> text and the FAQPage JSON-LD stay clean,
   which is what search engines and the accessibility tree consume. ──────── */
#page-blackjack-game-development .bj-faq{display:grid;gap:14px;max-width:940px;margin-inline:auto;}
#page-blackjack-game-development .bj-faq details{
  background:var(--paper);border:1px solid var(--line-strong);border-radius:12px;
  transition:border-color .18s ease,box-shadow .18s ease;
}
#page-blackjack-game-development .bj-faq details:hover{border-color:var(--line-strong);box-shadow:0 10px 24px -20px rgba(20,18,16,.7);}
#page-blackjack-game-development .bj-faq details[open]{border-color:var(--red);box-shadow:0 12px 30px -22px rgba(20,18,16,.8);}
#page-blackjack-game-development .bj-faq summary{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;
  gap:clamp(12px,1.6vw,18px);
  padding:18px clamp(16px,2.2vw,24px);cursor:pointer;list-style:none;
}
#page-blackjack-game-development .bj-faq summary::-webkit-details-marker{display:none;}
#page-blackjack-game-development .bj-faq summary h3{font-size:clamp(17px,1.6vw,20px);line-height:1.35;}

/* Qn index */
#page-blackjack-game-development .bj-faq__n{
  flex:none;display:inline-flex;align-items:center;justify-content:center;
  min-width:46px;height:36px;padding:0 10px;border-radius:8px;
  background:var(--ink);color:#fff;
  font-size:16px;font-weight:800;letter-spacing:.04em;font-variant-numeric:tabular-nums;
  transition:background-color .18s ease;
}
#page-blackjack-game-development .bj-faq details[open] .bj-faq__n{background:var(--red);}

#page-blackjack-game-development .bj-faq__pm{
  position:relative;flex:none;width:26px;height:26px;border-radius:50%;
  border:2px solid var(--ink);transition:background-color .18s ease,border-color .18s ease,transform .18s ease;
}
#page-blackjack-game-development .bj-faq__pm::before,
#page-blackjack-game-development .bj-faq__pm::after{
  content:"";position:absolute;top:50%;left:50%;background:var(--ink);
  transform:translate(-50%,-50%);transition:opacity .18s ease,background-color .18s ease;
}
#page-blackjack-game-development .bj-faq__pm::before{width:12px;height:2px;}
#page-blackjack-game-development .bj-faq__pm::after{width:2px;height:12px;}
#page-blackjack-game-development .bj-faq details[open] .bj-faq__pm{background:var(--red);border-color:var(--red);transform:rotate(90deg);}
#page-blackjack-game-development .bj-faq details[open] .bj-faq__pm::before,
#page-blackjack-game-development .bj-faq details[open] .bj-faq__pm::after{background:#fff;}
/* Open = minus. The control rotates 90deg, so the bar that must survive is the
   VERTICAL one (::after) — rotated it reads horizontal. Hiding ::after instead
   left a vertical bar in the open state, which reads as neither + nor -. */
#page-blackjack-game-development .bj-faq details[open] .bj-faq__pm::before{opacity:0;}

/* answer — left edge aligns with the Qn index, so "Ans." sits directly under it */
#page-blackjack-game-development .bj-faq__a{
  padding:0 clamp(16px,2.2vw,24px) 22px;
  border-top:1px solid var(--line);padding-top:16px;margin-top:2px;
}
#page-blackjack-game-development .bj-faq__a p{font-size:17px;color:var(--body);}
#page-blackjack-game-development .bj-faq__ans{
  font-weight:800;color:var(--red);margin-right:8px;letter-spacing:.02em;
}
@media (max-width:560px){
  /* the question wraps to 2-3 lines here, so the Qn index reads better pinned to
     the first line than floating in the vertical middle of the block */
  #page-blackjack-game-development .bj-faq summary{
    grid-template-columns:auto minmax(0,1fr);row-gap:10px;align-items:start;
  }
  #page-blackjack-game-development .bj-faq__n{margin-top:-2px;}
  #page-blackjack-game-development .bj-faq__pm{grid-column:2;justify-self:end;margin-top:-4px;}
}

/* ── customer stories ───────────────────────────────────────────────────── */
#page-blackjack-game-development .bj-stories{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.4vw,28px);
}
#page-blackjack-game-development .bj-story{
  background:rgba(255,255,255,.05);border:1px solid var(--ink-3);border-radius:14px;
  padding:16px;display:flex;flex-direction:column;gap:16px;
}
#page-blackjack-game-development .bj-vid{
  position:relative;display:block;width:100%;padding:0;border:0;border-radius:10px;
  overflow:hidden;cursor:pointer;background:#000;line-height:0;
}
/* the three source thumbnails have different intrinsic ratios; pin them to
   16/9 so the three story cards stay the same height and the quotes align */
#page-blackjack-game-development .bj-vid img{
  width:100%;aspect-ratio:16/9;object-fit:cover;opacity:.86;
  transition:opacity .18s ease,transform .25s ease;
}
#page-blackjack-game-development .bj-story{height:100%;}
#page-blackjack-game-development .bj-story blockquote{flex:1 1 auto;}
#page-blackjack-game-development .bj-vid:hover img{opacity:1;transform:scale(1.03);}
#page-blackjack-game-development .bj-vid__play{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:58px;height:58px;border-radius:50%;background:var(--red);color:#fff;
  display:flex;align-items:center;justify-content:center;
  transition:background-color .18s ease,transform .18s ease;
}
#page-blackjack-game-development .bj-vid:hover .bj-vid__play{background:var(--red-deep);transform:translate(-50%,-50%) scale(1.08);}
#page-blackjack-game-development .bj-story iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:10px;display:block;}
#page-blackjack-game-development .bj-story blockquote p{font-size:16.5px;color:var(--body-dark);}
#page-blackjack-game-development .bj-story cite{
  font-style:normal;font-weight:700;font-size:16px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--red-soft);
}

/* ── contact band ───────────────────────────────────────────────────────── */
#page-blackjack-game-development .bj-contact{
  display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:clamp(26px,4vw,56px);align-items:center;
  background:var(--paper);border:2px solid var(--ink);border-radius:var(--r);
  padding:clamp(28px,3.6vw,48px);box-shadow:8px 8px 0 0 rgba(179,18,43,.12);
}
#page-blackjack-game-development .bj-contact h2{font-size:clamp(25px,2.8vw,38px);}
#page-blackjack-game-development .bj-contact__acts{display:flex;flex-direction:column;align-items:flex-start;gap:16px;}
#page-blackjack-game-development .bj-contact__note{font-size:16px;color:var(--body);}
#page-blackjack-game-development .bj-contact__note a{color:var(--red);font-weight:600;text-decoration:underline;}

/* ── area we serve ──────────────────────────────────────────────────────── */
#page-blackjack-game-development .bj-regions{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2vw,24px);
}
#page-blackjack-game-development .bj-region{
  background:var(--paper);border:1px solid var(--line-strong);border-radius:12px;
  padding:clamp(22px,2.4vw,28px);transition:border-color .18s ease,transform .18s ease;
}
#page-blackjack-game-development .bj-region:hover{border-color:var(--red);transform:translateY(-3px);}
#page-blackjack-game-development .bj-region h3{
  font-size:16px;letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:12px;
}
#page-blackjack-game-development .bj-region a{
  display:inline-block;font-size:19px;font-weight:800;color:var(--ink);letter-spacing:-.02em;
  transition:color .18s ease;
}
#page-blackjack-game-development .bj-region a:hover{color:var(--red);}
#page-blackjack-game-development .bj-region p{margin-top:10px;font-size:16px;color:var(--body);}

/* ── CTA modal ──────────────────────────────────────────────────────────── */
#page-blackjack-game-development .bj-modal{
  position:fixed;inset:0;z-index:9999;display:none;
  align-items:flex-start;justify-content:center;
  padding:clamp(16px,4vw,48px) 16px;background:rgba(12,10,9,.72);overflow-y:auto;
}
#page-blackjack-game-development .bj-modal.is-open{display:flex;}
#page-blackjack-game-development .bj-modal__box{
  position:relative;width:100%;max-width:620px;background:#fff;border-radius:16px;
  padding:46px 18px 18px;box-shadow:0 40px 90px -40px rgba(0,0,0,.85);
}
#page-blackjack-game-development .bj-modal__x{
  position:absolute;top:12px;right:12px;width:38px;height:38px;border-radius:50%;
  border:1px solid var(--line-strong);background:#fff;color:var(--ink);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background-color .18s ease,color .18s ease,border-color .18s ease;
}
#page-blackjack-game-development .bj-modal__x:hover{background:var(--red);color:#fff;border-color:var(--red);}
#page-blackjack-game-development .bj-modal iframe{
  width:100%;min-height:860px;border:0;display:block;border-radius:10px;
}

/* ══ responsive ═══════════════════════════════════════════════════════════ */
@media (max-width:1024px){
  #page-blackjack-game-development .bj-head{grid-template-columns:minmax(0,1fr);align-items:start;}
  #page-blackjack-game-development .bj-hand > .bj-play{flex-basis:calc(50% - clamp(16px,2vw,24px));}
  #page-blackjack-game-development .bj-intro,
  #page-blackjack-game-development .bj-hire,
  #page-blackjack-game-development .bj-essay,
  #page-blackjack-game-development .bj-contact{grid-template-columns:minmax(0,1fr);}
  #page-blackjack-game-development .bj-regions{grid-template-columns:repeat(2,minmax(0,1fr));}
  #page-blackjack-game-development .bj-stories{grid-template-columns:minmax(0,1fr);}
  #page-blackjack-game-development .bj-row{grid-template-columns:64px minmax(0,1fr);}
  #page-blackjack-game-development .bj-row p{grid-column:2;}
}
@media (max-width:760px){
  #page-blackjack-game-development .bj-hero__tag{letter-spacing:.1em;padding:9px 16px;}
  #page-blackjack-game-development .bj-hero__facts{grid-template-columns:minmax(0,1fr);}
  #page-blackjack-game-development .bj-hand > .bj-play{flex-basis:100%;min-width:0;}
  #page-blackjack-game-development .bj-regions{grid-template-columns:minmax(0,1fr);}
  #page-blackjack-game-development .bj-btn{width:100%;}
  #page-blackjack-game-development .bj-hire__acts{gap:16px;align-items:flex-start;flex-direction:column;}
  #page-blackjack-game-development .bj-modal iframe{min-height:920px;}
}
@media (max-width:420px){
  #page-blackjack-game-development .bj-row{grid-template-columns:minmax(0,1fr);}
  #page-blackjack-game-development .bj-row p{grid-column:1;}
  #page-blackjack-game-development .bj-modal__box{padding:44px 12px 12px;}
}

/* ══ reduced motion — the little motion that exists is user-initiated ═════ */
@media (prefers-reduced-motion:reduce){
  #page-blackjack-game-development *,
  #page-blackjack-game-development *::before,
  #page-blackjack-game-development *::after{
    transition-duration:.01ms !important;animation:none !important;
  }
}

/* ── inline links inside card / ledger copy (same treatment as .bj-copy) ── */
#page-blackjack-game-development .bj-play p a,
#page-blackjack-game-development .bj-row p a{
  color:var(--red);font-weight:700;
  border-bottom:2px solid rgba(179,18,43,.3);
  transition:border-color .18s ease,color .18s ease;
}
#page-blackjack-game-development .bj-play p a:hover{color:var(--red-deep);border-bottom-color:var(--red-deep);}
#page-blackjack-game-development .bj-row p a{color:var(--red-soft);border-bottom-color:rgba(240,121,141,.42);}
#page-blackjack-game-development .bj-row p a:hover{color:#fff;border-bottom-color:#fff;}