/* ══════════════════════════════════════════════════════════════════════════
   /blackjack-software-script — page-isolated stylesheet
   AISHTMLNEWDESIGN-326

   Visual direction: "THE COUNT ROOM" — this page does not sell a night on the
   casino floor, it sells a SHIPPABLE SCRIPT to an operator who cares about
   fraud prevention, analytics, compliance and time-to-launch. So the register
   is the secure count room behind the floor, not the floor: plum-black ink,
   a chalk manifest as the reading surface, and a single ORCHID signal that
   owns every action. The composition motif is the DEALER'S SHOE — content is
   dealt as stacked horizontal strips with a numbered edge rule, never as a
   card grid, and hand-totals are set in tabular numerals.

   Deliberately distinct from its neighbours in this repo:
     · /blackjack-game-development  — "Ivory Table"   (ink / bone / crimson)
     · /blackjack-software-canada   — "Dealer's Felt" (felt green / brass)
     · /slot-machine-programming    — "Brass & Baize" (baize green / brass)
     · /bitcoin-roulette-script     — "Porcelain & Cobalt"
   No other page in frontend/public/css uses a violet signal.

   Every rule is scoped to #page-blackjack-software-script, so this file can
   never touch the shared header/footer (owned by /assets/css/layout.css).
   The document reset (html,body{margin:0}) is owned by layout.css and is
   deliberately NOT restated here — see frontend-design §33.

   Design contract (.claude/skills/frontend-design/SKILL.md):
     · rule  1 — Inter is the primary family
     · rule  2 — nothing below 16px
     · rule 23 — no muted slate body copy on light backgrounds (#2a2436 floor)
     · rule 24 — image-free full-bleed hero, centred ~900px 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
   ══════════════════════════════════════════════════════════════════════════ */

#page-blackjack-software-script{
  /* ── palette ─────────────────────────────────────────────────────────── */
  --ink:#171226;          /* count-room dark        */
  --ink-2:#211a35;        /* raised ink surface     */
  --ink-3:#382e55;        /* ink hairline           */
  --chalk:#f6f4ef;        /* manifest paper         */
  --chalk-2:#ece7dc;      /* deeper manifest        */
  --paper:#ffffff;
  --line:#e2ddd2;
  --line-strong:#c7c0af;
  --body:#2a2436;         /* AA on white + chalk    */
  --body-dark:#ded9ec;    /* AA on ink              */
  --strong:#171226;
  --sig:#6532cf;          /* the one action colour  */
  --sig-deep:#4d21a8;
  --sig-soft:#bda3f7;     /* signal on ink          */
  --sig-tint:#f2ecfe;
  --steel:#6d6683;        /* non-interactive chips  */

  /* FAQ index column. ONE token drives both the summary grid and the answer
     grid: "Q1" and "Ans." are different widths, so if each grid sized its own
     `auto` column they would align the labels but NOT the copy beside them. */
  --faq-col:46px;

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

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

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

/* Focus is the one state that must never be styled away. */
#page-blackjack-software-script a:focus-visible,
#page-blackjack-software-script button:focus-visible,
#page-blackjack-software-script summary:focus-visible{
  outline:3px solid var(--sig);outline-offset:3px;border-radius:6px;
}

/* ── layout primitives ──────────────────────────────────────────────────── */
#page-blackjack-software-script .bs-wrap{
  width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut);
}
#page-blackjack-software-script .bs-sec{padding-block:var(--sec);position:relative;}
#page-blackjack-software-script .bs-sec--chalk{background:var(--chalk);}
#page-blackjack-software-script .bs-sec--paper{background:var(--paper);}
#page-blackjack-software-script .bs-sec--ink{background:var(--ink);color:var(--body-dark);}
#page-blackjack-software-script .bs-sec--ink h2,
#page-blackjack-software-script .bs-sec--ink h3,
#page-blackjack-software-script .bs-sec--ink h4,
#page-blackjack-software-script .bs-sec--ink h5{color:#fff;}

/* The shoe: a static, painted stack of deck edges. Purely decorative depth,
   no image and no motion — a repeating-linear-gradient is a paint, not an
   animation (rule 26). */
#page-blackjack-software-script .bs-shoe{
  background-image:
    repeating-linear-gradient(90deg,
      rgba(189,163,247,.10) 0 1px, transparent 1px 34px),
    linear-gradient(180deg,#1c1630 0%,#171226 62%,#140f21 100%);
}

#page-blackjack-software-script .bs-eyebrow{
  font-size:16px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--sig);margin-bottom:12px;
}
#page-blackjack-software-script .bs-sec--ink .bs-eyebrow{color:var(--sig-soft);}

#page-blackjack-software-script .bs-h2{
  font-size:clamp(28px,3.5vw,44px);max-width:22ch;
}
#page-blackjack-software-script .bs-h2--wide{max-width:34ch;}
#page-blackjack-software-script h2 em,
#page-blackjack-software-script h3 em{font-style:normal;color:var(--sig);}
#page-blackjack-software-script .bs-sec--ink h2 em,
#page-blackjack-software-script .bs-sec--ink h3 em{color:var(--sig-soft);}

#page-blackjack-software-script .bs-head{
  display:grid;grid-template-columns:minmax(0,1fr);gap:18px;margin-bottom:clamp(30px,4vw,52px);
}
#page-blackjack-software-script .bs-head--center{
  justify-items:center;text-align:center;
}
#page-blackjack-software-script .bs-head--center .bs-h2{max-width:26ch;}

#page-blackjack-software-script .bs-lede{
  font-size:clamp(17px,1.5vw,20px);line-height:1.6;
}
#page-blackjack-software-script .bs-copy p{margin-bottom:16px;}
#page-blackjack-software-script .bs-copy p:last-child{margin-bottom:0;}
#page-blackjack-software-script .bs-copy a,
#page-blackjack-software-script .bs-lede a{
  color:var(--sig);font-weight:700;
  border-bottom:2px solid rgba(101,50,207,.28);
  transition:border-color .18s ease,color .18s ease;
}
#page-blackjack-software-script .bs-copy a:hover,
#page-blackjack-software-script .bs-lede a:hover{
  color:var(--sig-deep);border-bottom-color:var(--sig-deep);
}
#page-blackjack-software-script .bs-sec--ink .bs-copy a{
  color:var(--sig-soft);border-bottom-color:rgba(189,163,247,.42);
}
#page-blackjack-software-script .bs-sec--ink .bs-copy a:hover{
  color:#fff;border-bottom-color:#fff;
}

/* ── buttons ────────────────────────────────────────────────────────────── */
#page-blackjack-software-script .bs-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:inherit;font-size:17px;font-weight:700;line-height:1.2;
  padding:17px 30px;border-radius:999px;border:2px solid transparent;
  cursor:pointer;text-align:center;
  transition:transform .16s ease,background-color .16s ease,color .16s ease,
             border-color .16s ease,box-shadow .16s ease;
}
#page-blackjack-software-script .bs-btn--sig{
  background:var(--sig);color:#fff;box-shadow:0 10px 24px rgba(101,50,207,.28);
}
#page-blackjack-software-script .bs-btn--sig:hover{
  background:var(--sig-deep);transform:translateY(-2px);
  box-shadow:0 14px 30px rgba(77,33,168,.34);
}
#page-blackjack-software-script .bs-btn--sig:active{transform:translateY(0);}
#page-blackjack-software-script .bs-btn--chalk{
  background:var(--chalk);color:var(--ink);
}
#page-blackjack-software-script .bs-btn--chalk:hover{
  background:#fff;transform:translateY(-2px);
}
#page-blackjack-software-script .bs-btn--chalk:active{transform:translateY(0);}
#page-blackjack-software-script .bs-btn--ink{
  background:var(--ink);color:#fff;
}
#page-blackjack-software-script .bs-btn--ink:hover{
  background:var(--ink-2);transform:translateY(-2px);
}
#page-blackjack-software-script .bs-btn--ink:active{transform:translateY(0);}
#page-blackjack-software-script .bs-btn--outline{
  background:transparent;color:var(--sig-deep);border-color:var(--line-strong);
}
#page-blackjack-software-script .bs-btn--outline:hover{
  border-color:var(--sig);background:var(--sig-tint);transform:translateY(-2px);
}
#page-blackjack-software-script .bs-btn--outline:active{transform:translateY(0);}

#page-blackjack-software-script .bs-act{margin-top:clamp(28px,3.5vw,44px);}
#page-blackjack-software-script .bs-act--center{text-align:center;}

#page-blackjack-software-script .bs-textlink{
  font-size:17px;font-weight:700;color:var(--sig);
  border-bottom:2px solid rgba(101,50,207,.3);
  transition:border-color .18s ease,color .18s ease;
}
#page-blackjack-software-script .bs-textlink:hover{
  color:var(--sig-deep);border-bottom-color:var(--sig-deep);
}

/* ══ HERO — rule 24: full-bleed, image-free, static gradient, centred
   ~900px column, exactly one CTA. ══════════════════════════════════════ */
#page-blackjack-software-script .bs-hero{
  width:100%;
  padding:clamp(92px,11.5vw,168px) var(--gut) clamp(76px,9vw,124px);
  background-image:
    repeating-linear-gradient(115deg,
      rgba(189,163,247,.055) 0 2px, transparent 2px 26px),
    radial-gradient(120% 90% at 50% -10%, #2e2350 0%, rgba(46,35,80,0) 62%),
    linear-gradient(180deg,#1d1633 0%,#171226 58%,#120e1f 100%);
  color:var(--body-dark);
  text-align:center;
}
#page-blackjack-software-script .bs-hero__inner{
  max-width:900px;margin-inline:auto;
}
#page-blackjack-software-script .bs-hero__tag{
  display:inline-block;
  font-size:16px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--sig-soft);
  border:1px solid rgba(189,163,247,.38);border-radius:999px;
  padding:8px 20px;margin-bottom:26px;
}
#page-blackjack-software-script .bs-hero h1{
  color:#fff;font-size:clamp(38px,5.5vw,72px);letter-spacing:-.03em;line-height:1.06;
}
#page-blackjack-software-script .bs-hero h1 em{
  font-style:normal;color:var(--sig-soft);
}
#page-blackjack-software-script .bs-hero__copy{
  margin:26px auto 0;max-width:74ch;
  font-size:clamp(17px,1.55vw,20px);line-height:1.66;color:var(--body-dark);
}
#page-blackjack-software-script .bs-hero .bs-btn{margin-top:34px;}
#page-blackjack-software-script .bs-hero__facts{
  margin-top:clamp(40px,5vw,64px);
  display:grid;gap:1px;background:rgba(189,163,247,.2);
  border:1px solid rgba(189,163,247,.2);border-radius:var(--r);overflow:hidden;
  grid-template-columns:repeat(3,minmax(0,1fr));text-align:left;
}
#page-blackjack-software-script .bs-hero__facts>div{
  background:rgba(255,255,255,.03);padding:22px 24px;
  display:flex;flex-direction:column;gap:7px;
}
#page-blackjack-software-script .bs-hero__facts b{
  color:#fff;font-size:17px;font-weight:800;letter-spacing:-.01em;
}
#page-blackjack-software-script .bs-hero__facts span{
  font-size:16px;line-height:1.5;color:var(--body-dark);
}

/* ── breadcrumb bar ─────────────────────────────────────────────────────── */
#page-blackjack-software-script .bs-crumbbar{
  background:var(--chalk);border-bottom:1px solid var(--line);
}
#page-blackjack-software-script .bs-crumb{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding-block:16px;font-size:16px;color:var(--body);
}
#page-blackjack-software-script .bs-crumb a{
  color:var(--sig);font-weight:600;
  transition:color .18s ease;
}
#page-blackjack-software-script .bs-crumb a:hover{color:var(--sig-deep);}
#page-blackjack-software-script .bs-crumb img{width:16px;height:16px;}
#page-blackjack-software-script .bs-crumb [aria-current]{font-weight:700;color:var(--strong);}

/* ── two-column editorial block ─────────────────────────────────────────── */
#page-blackjack-software-script .bs-split{
  display:grid;gap:clamp(28px,4vw,64px);align-items:start;
  grid-template-columns:minmax(0,1fr);
}
@media(min-width:900px){
  #page-blackjack-software-script .bs-split{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);}
  #page-blackjack-software-script .bs-split--flip{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);}
}

/* The market figure — a plaque of tabular numerals, set as type rather than
   as an image, so it needs no asset and never ships a broken URL. */
#page-blackjack-software-script .bs-plaque{
  border:1px solid var(--line);border-left:5px solid var(--sig);
  border-radius:var(--r);background:var(--chalk);
  padding:clamp(24px,3vw,34px);
}
#page-blackjack-software-script .bs-sec--ink .bs-plaque{
  background:var(--ink-2);border-color:var(--ink-3);border-left-color:var(--sig-soft);
}
#page-blackjack-software-script .bs-plaque__n{
  display:block;font-size:clamp(40px,5vw,60px);font-weight:800;
  letter-spacing:-.04em;line-height:1;color:var(--sig);
}
#page-blackjack-software-script .bs-sec--ink .bs-plaque__n{color:var(--sig-soft);}
#page-blackjack-software-script .bs-plaque__l{
  display:block;margin-top:12px;font-size:16px;line-height:1.5;color:var(--body);
}
#page-blackjack-software-script .bs-sec--ink .bs-plaque__l{color:var(--body-dark);}
#page-blackjack-software-script .bs-plaque+.bs-plaque{margin-top:16px;}

/* ══ Band — a full-width statement with exactly one CTA. ═══════════════ */
#page-blackjack-software-script .bs-band{
  background:var(--ink);color:var(--body-dark);
  padding-block:clamp(54px,6.5vw,88px);
}
#page-blackjack-software-script .bs-band__inner{
  max-width:860px;margin-inline:auto;text-align:center;
}
#page-blackjack-software-script .bs-band h2{
  color:#fff;font-size:clamp(26px,3.2vw,40px);
}
#page-blackjack-software-script .bs-band p{
  margin-top:16px;font-size:clamp(17px,1.5vw,19px);color:var(--body-dark);
}

/* ══ The shoe — features dealt as stacked strips, numbered on the edge.
   Deliberately NOT a card grid. ═════════════════════════════════════════ */
#page-blackjack-software-script .bs-strips{
  border-top:1px solid var(--line);
}
#page-blackjack-software-script .bs-sec--ink .bs-strips{border-top-color:var(--ink-3);}
#page-blackjack-software-script .bs-strip{
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(16px,2.5vw,30px);
  align-items:center;
  padding:20px 4px;border-bottom:1px solid var(--line);
  transition:background-color .18s ease,padding-left .18s ease;
}
#page-blackjack-software-script .bs-sec--ink .bs-strip{border-bottom-color:var(--ink-3);}
#page-blackjack-software-script .bs-strip:hover{background:var(--sig-tint);padding-left:14px;}
#page-blackjack-software-script .bs-sec--ink .bs-strip:hover{background:rgba(189,163,247,.09);}
#page-blackjack-software-script .bs-strip__n{
  font-size:16px;font-weight:800;letter-spacing:.06em;color:var(--steel);
  min-width:3ch;
}
#page-blackjack-software-script .bs-sec--ink .bs-strip__n{color:var(--sig-soft);}
#page-blackjack-software-script .bs-strip h3{
  font-size:clamp(18px,1.8vw,21px);font-weight:700;letter-spacing:-.015em;
}
@media(min-width:760px){
  #page-blackjack-software-script .bs-strips--two{
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:clamp(28px,4vw,56px);border-top:0;
  }
  #page-blackjack-software-script .bs-strips--two .bs-strip{border-top:1px solid var(--line);border-bottom:0;}
  #page-blackjack-software-script .bs-sec--ink .bs-strips--two .bs-strip{border-top-color:var(--ink-3);}
}

/* ══ Benefit ledger — a two-column definition list of plain statements.
   Each is a sentence from the source, so it is set as a sentence, not
   compressed into a fake three-word feature title. ══════════════════════ */
#page-blackjack-software-script .bs-ledger{
  display:grid;gap:0;grid-template-columns:minmax(0,1fr);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
}
@media(min-width:820px){
  #page-blackjack-software-script .bs-ledger{grid-template-columns:repeat(2,minmax(0,1fr));}
}
#page-blackjack-software-script .bs-ledger li{
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:baseline;
  padding:20px 24px;background:var(--paper);
  border-bottom:1px solid var(--line);
  transition:background-color .18s ease;
}
#page-blackjack-software-script .bs-ledger li:hover{background:var(--sig-tint);}
@media(min-width:820px){
  #page-blackjack-software-script .bs-ledger li:nth-child(odd){border-right:1px solid var(--line);}
}
#page-blackjack-software-script .bs-ledger li span:first-child{
  font-size:16px;font-weight:800;color:var(--sig);letter-spacing:.05em;
}
#page-blackjack-software-script .bs-ledger li span:last-child{
  font-size:17px;line-height:1.55;color:var(--body);
}

/* ══ Process — a numbered ledger on ink. ═══════════════════════════════ */
#page-blackjack-software-script .bs-steps{
  counter-reset:bs-step;
  display:grid;gap:0;
  border-top:1px solid var(--ink-3);
}
#page-blackjack-software-script .bs-step{
  display:grid;grid-template-columns:auto minmax(0,1fr);
  gap:clamp(18px,3vw,40px);align-items:start;
  padding:clamp(22px,2.6vw,30px) 4px;
  border-bottom:1px solid var(--ink-3);
  transition:background-color .18s ease;
}
#page-blackjack-software-script .bs-step:hover{background:rgba(189,163,247,.07);}
#page-blackjack-software-script .bs-step::before{
  counter-increment:bs-step;content:"0" counter(bs-step);
  font-size:clamp(22px,2.6vw,30px);font-weight:800;letter-spacing:-.02em;
  color:var(--sig-soft);line-height:1.1;min-width:2.6ch;
}
#page-blackjack-software-script .bs-step p{
  font-size:clamp(17px,1.45vw,19px);line-height:1.62;color:var(--body-dark);
}

/* ══ Hire panel — the one section that carries the source's product shot. ══ */
#page-blackjack-software-script .bs-hire{
  display:grid;gap:clamp(26px,4vw,56px);align-items:center;
  grid-template-columns:minmax(0,1fr);
}
@media(min-width:900px){
  #page-blackjack-software-script .bs-hire{grid-template-columns:minmax(0,1fr) minmax(0,.85fr);}
}
#page-blackjack-software-script .bs-frame{
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  background:var(--chalk);
}
#page-blackjack-software-script .bs-frame img{width:100%;}
#page-blackjack-software-script .bs-frame figcaption{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:14px 18px;border-top:1px solid var(--line);
  font-size:16px;font-weight:600;color:var(--body);
}
#page-blackjack-software-script .bs-frame figcaption span:last-child{
  color:var(--sig);font-weight:800;letter-spacing:.08em;
}

/* ══ FAQ ═══════════════════════════════════════════════════════════════ */
#page-blackjack-software-script .bs-faqs{
  border-top:1px solid var(--line-strong);
}
#page-blackjack-software-script .bs-faq{
  border-bottom:1px solid var(--line-strong);
}
#page-blackjack-software-script .bs-faq summary{
  display:grid;grid-template-columns:var(--faq-col) minmax(0,1fr) auto;gap:16px;align-items:center;
  padding:22px 4px;cursor:pointer;list-style:none;
  transition:color .18s ease;
}
#page-blackjack-software-script .bs-faq summary::-webkit-details-marker{display:none;}
#page-blackjack-software-script .bs-faq summary:hover h3{color:var(--sig-deep);}
#page-blackjack-software-script .bs-faq__n{
  font-size:16px;font-weight:800;color:var(--sig);letter-spacing:.06em;
}
#page-blackjack-software-script .bs-faq summary h3{
  font-size:clamp(17px,1.7vw,20px);font-weight:700;letter-spacing:-.015em;
  transition:color .18s ease;
}
#page-blackjack-software-script .bs-faq__pm{
  position:relative;width:20px;height:20px;flex:none;
}
#page-blackjack-software-script .bs-faq__pm::before,
#page-blackjack-software-script .bs-faq__pm::after{
  content:"";position:absolute;left:50%;top:50%;background:var(--sig);
  transform:translate(-50%,-50%);transition:opacity .18s ease;
}
#page-blackjack-software-script .bs-faq__pm::before{width:16px;height:2.5px;}
#page-blackjack-software-script .bs-faq__pm::after{width:2.5px;height:16px;}
#page-blackjack-software-script .bs-faq[open] .bs-faq__pm::after{opacity:0;}
/* The answer block mirrors the summary's grid EXACTLY — same `auto` first
   column, same 3ch min-width, same 16px gap — so "Ans." sits in the same
   column as "Q1" and their left edges line up, and the answer copy lines up
   with the question copy. Indenting with padding (the previous approach)
   could only align the copy, never the label. */
#page-blackjack-software-script .bs-faq__a{
  display:grid;grid-template-columns:var(--faq-col) minmax(0,1fr);gap:16px;align-items:baseline;
  padding:0 4px 24px;
}
#page-blackjack-software-script .bs-faq__ans{
  font-size:16px;font-weight:800;color:var(--sig);letter-spacing:.06em;
}
#page-blackjack-software-script .bs-faq__a p{
  font-size:17px;line-height:1.65;color:var(--body);max-width:82ch;
}

/* ══ Customer stories ══════════════════════════════════════════════════ */
#page-blackjack-software-script .bs-stories{
  display:grid;gap:clamp(20px,2.6vw,30px);
  grid-template-columns:minmax(0,1fr);
}
@media(min-width:760px){
  #page-blackjack-software-script .bs-stories{grid-template-columns:repeat(3,minmax(0,1fr));}
}
#page-blackjack-software-script .bs-story{
  background:var(--ink-2);border:1px solid var(--ink-3);border-radius:var(--r);
  padding:0 0 24px;overflow:hidden;display:flex;flex-direction:column;gap:16px;
}
#page-blackjack-software-script .bs-vid{
  position:relative;display:block;width:100%;padding:0;border:0;font-size:16px;
  background:#0f0b1a;cursor:pointer;line-height:0;
}
#page-blackjack-software-script .bs-vid img{width:100%;transition:opacity .2s ease;}
#page-blackjack-software-script .bs-vid:hover img{opacity:.82;}
#page-blackjack-software-script .bs-vid iframe{
  display:block;width:100%;aspect-ratio:3/2;border:0;
}
#page-blackjack-software-script .bs-vid__play{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:60px;height:60px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--sig);color:#fff;padding-left:4px;
  box-shadow:0 8px 22px rgba(0,0,0,.4);
  transition:background-color .18s ease,transform .18s ease;
}
#page-blackjack-software-script .bs-vid:hover .bs-vid__play{
  background:var(--sig-deep);transform:translate(-50%,-50%) scale(1.07);
}
#page-blackjack-software-script .bs-story blockquote{padding-inline:24px;}
#page-blackjack-software-script .bs-story blockquote p{
  font-size:17px;line-height:1.6;color:var(--body-dark);
}
#page-blackjack-software-script .bs-story cite{
  padding-inline:24px;font-style:normal;font-weight:800;color:#fff;font-size:16px;
  letter-spacing:.02em;margin-top:auto;
}

/* ══ Contact band ══════════════════════════════════════════════════════ */
#page-blackjack-software-script .bs-contact{
  display:grid;gap:clamp(26px,4vw,56px);align-items:center;
  grid-template-columns:minmax(0,1fr);
}
@media(min-width:900px){
  #page-blackjack-software-script .bs-contact{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);}
}
#page-blackjack-software-script .bs-contact h2{font-size:clamp(26px,3vw,38px);}
#page-blackjack-software-script .bs-contact__acts{
  display:flex;flex-direction:column;align-items:flex-start;gap:18px;
}
#page-blackjack-software-script .bs-contact__note{
  font-size:16px;line-height:1.55;color:var(--body);
}
#page-blackjack-software-script .bs-contact__note a{
  color:var(--sig);font-weight:700;border-bottom:2px solid rgba(101,50,207,.3);
}
#page-blackjack-software-script .bs-contact__note a:hover{color:var(--sig-deep);}

/* ══ Regions ═══════════════════════════════════════════════════════════ */
#page-blackjack-software-script .bs-regions{
  display:grid;gap:clamp(18px,2.4vw,26px);
  grid-template-columns:minmax(0,1fr);
}
@media(min-width:640px){
  #page-blackjack-software-script .bs-regions{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(min-width:1040px){
  #page-blackjack-software-script .bs-regions{grid-template-columns:repeat(4,minmax(0,1fr));}
}
#page-blackjack-software-script .bs-region{
  background:var(--paper);border:1px solid var(--line);border-top:4px solid var(--sig);
  border-radius:var(--r);padding:26px 24px;
  display:flex;flex-direction:column;gap:10px;
  transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
#page-blackjack-software-script .bs-region:hover{
  transform:translateY(-3px);box-shadow:0 14px 30px rgba(23,18,38,.10);
  border-color:var(--line-strong);border-top-color:var(--sig-deep);
}
#page-blackjack-software-script .bs-region h3{
  font-size:16px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:var(--steel);
}
#page-blackjack-software-script .bs-region a{
  font-size:19px;font-weight:800;color:var(--sig);letter-spacing:-.01em;
  transition:color .18s ease;
}
#page-blackjack-software-script .bs-region a:hover{color:var(--sig-deep);}
#page-blackjack-software-script .bs-region p{font-size:16px;line-height:1.55;color:var(--body);}

/* ══ CTA modal ═════════════════════════════════════════════════════════ */
#page-blackjack-software-script .bs-modal{
  display:none;position:fixed;inset:0;z-index:9999;
  background:rgba(15,11,26,.72);
  padding:20px;overflow-y:auto;
}
#page-blackjack-software-script .bs-modal.is-open{display:flex;align-items:flex-start;justify-content:center;}
#page-blackjack-software-script .bs-modal__box{
  position:relative;width:100%;max-width:640px;margin:auto;
  background:var(--paper);border-radius:18px;overflow:hidden;
  box-shadow:0 30px 70px rgba(0,0,0,.45);
}
#page-blackjack-software-script .bs-modal__x{
  position:absolute;top:14px;right:14px;z-index:2;
  width:38px;height:38px;border-radius:50%;border:0;cursor:pointer;font-size:16px;
  display:flex;align-items:center;justify-content:center;
  background:var(--chalk-2);color:var(--ink);
  transition:background-color .18s ease,color .18s ease;
}
#page-blackjack-software-script .bs-modal__x:hover{background:var(--sig);color:#fff;}
/* rule 20 — the GHL widget is a TWO-SLIDE survey and the slides are different
   heights (slide 2 carries six more questions), so no single fixed height is
   correct: the old 920px wasted ~145px under slide 1, and the old 1040px
   mobile floor CLIPPED slide 2's SUBMIT bar by up to 104px.
   The widget on its own NEVER posts its height — it emits only
   ["iframeLoaded"] — so the postMessage listener in the page script never
   fired. Loading GHL's own form_embed.js (lazily, on first modal open, so it
   costs nothing at page load) starts their iFrameResizer, which sets an
   inline height per slide.
   On spacing: the widget is SYMMETRIC by design — 90px above the "Get in
   Touch" heading and a matching 90px below its footer. Keep that 90px; it is
   the intended breathing room, not slack. What the old fixed floors added on
   TOP of it was the ugliness (145px of bottom gap on desktop, ~257px on
   mobile, against a 90px top). The resizer overshoots the widget's own
   scrollHeight by exactly 5px, so the negative margin cancels ONLY that 5px
   and .bs-modal__box's existing overflow:hidden clips it — leaving bottom
   space equal to the top inset on both slides, with no JS of our own.
   Do NOT raise this to -95px: that trims the widget's own padding too and
   the SUBMIT bar ends up flush against the modal's rounded edge.
   Measured 2026-08-27 — content bottom / resizer height:
     iframe 640px: slide 1 775/870, slide 2 841/936
     iframe 280px: slide 2 1192/1282  <- worst case, sets the fallback floor
   Before the resizer initialises (or if the script is blocked) the iframe
   keeps a floor tall enough for the worst slide and NO negative margin, so a
   failed script degrades to "a little roomy" and never to a clipped SUBMIT. */
#page-blackjack-software-script .bs-modal iframe{
  display:block;width:100%;border:0;margin-bottom:-5px;
}
#page-blackjack-software-script .bs-modal iframe:not([data-iframe-resizer-initialized]){
  min-height:1290px;margin-bottom:0;
}

/* ══ responsive ════════════════════════════════════════════════════════ */
@media(max-width:900px){
  #page-blackjack-software-script .bs-hero__facts{grid-template-columns:minmax(0,1fr);}
}
@media(max-width:560px){
  #page-blackjack-software-script .bs-btn{width:100%;}
  #page-blackjack-software-script .bs-contact__acts{align-items:stretch;}
  #page-blackjack-software-script .bs-contact__acts .bs-textlink{text-align:center;}
  /* keep the Ans./Qn column at narrow widths — the grid owns the alignment,
     so no padding override is needed or wanted here */
  #page-blackjack-software-script .bs-faq summary,
  #page-blackjack-software-script .bs-faq__a{gap:12px;}
}

/* Users who ask the OS for less motion get none. Every transition above is
   already user-initiated and finite; this simply removes the travel. */
@media(prefers-reduced-motion:reduce){
  #page-blackjack-software-script *{transition:none !important;}
  #page-blackjack-software-script .bs-btn:hover,
  #page-blackjack-software-script .bs-region:hover{transform:none;}
}