/* /bitcoin-slot-machine — AISHTMLNEWDESIGN-382
Page-owned styles. EVERY selector is scoped to #page-bitcoin-slot-machine or a
bsm- 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 — "INDIGO VAT".
The dyer's vat, not the casino floor. The slot and crypto registers here are
already full of reels, paylines, ledgers, brass cabinets and chains of
records, so this page takes a different craft: cloth being dipped. Undyed
linen grounds (#f6f3ec / #efe9dd) alternate with deep indigo vat bands; the
section transition is a DIP LINE — a 7px strip of woven vertical threads
along a band's top edge, the mark left where the cloth met the dye. The
section mark is a DYE SWATCH: a rectangle with its lower half dipped, its
upper half still undyed, beside the label. Madder red (#b23b2e) is the one
action colour and appears nowhere but buttons and in-copy links, so the only
warm thing on a cool page is the place the reader can act.
Why indigo: the record's own CMS assets — check.png (#45429d),
usa-check-icon.svg and script-round-icpon.svg (#3E4095), left-icon.svg
(#393185), location-icon.svg (#303094) — are all drawn in indigo. Keying the
palette to them puts every icon on a LIGHT cloth ground at ~7:1, with no
asset recoloured or hidden; the dark vat bands carry no CMS icon at all.
Bitcoin is a subject here, not a brand: no exchange or wallet mark, no
orange-coin borrowing, no affiliation, no claim the record does not make.
Contract: rule 24 (image-free full-bleed hero, static gradient, ~900px
column), 25 (one CTA/section, labels unique), 26 (zero @keyframes; motion
only on hover/:focus-visible/:active/details-open + reduced-motion reset),
29 (real decoded width/height on every ![]()
), 30 (no form control; the
modal is the only enquiry surface), 35 (nothing invented). */
/* ══ tokens ════════════════════════════════════════════════════════════════ */
#page-bitcoin-slot-machine{
/* the vat — dark indigo grounds */
--bsm-vat:#1b1f52;
--bsm-vat-2:#232864; /* raised surface on the vat */
--bsm-vat-3:#3a3f8c; /* hairline / mid-dip */
--bsm-vat-deep:#11143a; /* deepest dip, band edges */
/* undyed cloth — light grounds */
--bsm-cloth:#f6f3ec;
--bsm-cloth-2:#efe9dd;
--bsm-paper:#fffdf8;
--bsm-line:#ddd4c2;
--bsm-line-2:#cabfa8;
--bsm-line-vat:rgba(236,234,246,.20);
/* text */
--bsm-ink:#171a2e; /* 15.6:1 on cloth */
--bsm-ink-2:#3a4056; /* 8.9:1 on cloth */
--bsm-on-vat:#eceaf6; /* 13.2:1 on the vat */
--bsm-on-vat-2:#b9b9dc; /* 8.3:1 on the vat */
/* madder — the single action colour */
--bsm-madder:#b23b2e; /* button fill; #fff8f5 on it = 5.6:1 */
--bsm-madder-deep:#8d2b20; /* accent TEXT on cloth = 7.6:1 */
--bsm-madder-dark:#8f2a1f; /* button hover */
--bsm-madder-ink:#fff8f5;
--bsm-wrap:1200px;
--bsm-wrap-wide:1340px;
font-family:"Inter",system-ui,sans-serif;
font-size:16px;
line-height:1.6;
color:var(--bsm-ink);
background:var(--bsm-cloth);
-webkit-font-smoothing:antialiased;
}
/* Scoped border-box: the chrome sheets namespace their own reset and page.css
may not style bare elements, so the page declares this for itself. Without
it `width:100%` + 24px padding scrolls the document sideways. */
#page-bitcoin-slot-machine,
#page-bitcoin-slot-machine *,
#page-bitcoin-slot-machine *::before,
#page-bitcoin-slot-machine *::after{box-sizing:border-box;}
#page-bitcoin-slot-machine img{max-width:100%;}
/* ══ shells ════════════════════════════════════════════════════════════════ */
/* max-width is never set on .bsm-sec: a section that is its own wrapper
inherits margin-inline:auto and silently re-centres its column. */
#page-bitcoin-slot-machine .bsm-sec{
position:relative;
width:100%;
padding:clamp(56px,6.4vw,96px) 0;
}
#page-bitcoin-slot-machine .bsm-sec--cloth{background:var(--bsm-cloth);}
#page-bitcoin-slot-machine .bsm-sec--cloth2{background:var(--bsm-cloth-2);}
#page-bitcoin-slot-machine .bsm-sec--vat{background:var(--bsm-vat);}
#page-bitcoin-slot-machine .bsm-wrap{
width:100%;
max-width:var(--bsm-wrap);
margin-inline:auto;
padding-inline:24px;
}
/* The nine slot-type marks need a wider frame than the reading column, or each
tile lands at 55% of its decoded width — the "looks very small" complaint.
It carries no left-aligned prose, so it cannot move the copy-column edge. */
#page-bitcoin-slot-machine .bsm-wrap--gallery{max-width:var(--bsm-wrap-wide);}
/* ── the DIP LINE: woven threads across the top edge of a band ───────────── */
#page-bitcoin-slot-machine .bsm-dip::before{
content:"";
position:absolute;
top:0;left:0;right:0;
height:7px;
background:repeating-linear-gradient(90deg,
var(--bsm-vat-3) 0 2px, transparent 2px 7px);
opacity:.42;
}
#page-bitcoin-slot-machine .bsm-dip--dark::before{
background:repeating-linear-gradient(90deg,
var(--bsm-on-vat) 0 2px, transparent 2px 7px);
opacity:.24;
}
/* ══ section mark — the dye swatch ═════════════════════════════════════════ */
#page-bitcoin-slot-machine .bsm-mark{
display:inline-flex;
align-items:center;
gap:13px;
margin:0 0 18px;
font-size:16px;
font-weight:700;
letter-spacing:.16em;
text-transform:uppercase;
color:var(--bsm-ink-2);
}
#page-bitcoin-slot-machine .bsm-mark::before{
content:"";
flex:0 0 auto;
width:36px;height:19px;
border:1px solid var(--bsm-vat-3);
background:linear-gradient(to bottom,
var(--bsm-paper) 0 52%, var(--bsm-vat) 52% 100%);
}
#page-bitcoin-slot-machine .bsm-mark--light{color:var(--bsm-on-vat-2);}
#page-bitcoin-slot-machine .bsm-mark--light::before{
border-color:rgba(236,234,246,.45);
background:linear-gradient(to bottom,
var(--bsm-paper) 0 52%, var(--bsm-vat-deep) 52% 100%);
}
/* ══ headings and prose ════════════════════════════════════════════════════ */
#page-bitcoin-slot-machine .bsm-h2{
margin:0 0 22px;
font-size:clamp(29px,3.2vw,42px);
line-height:1.14;
font-weight:800;
letter-spacing:-.018em;
color:var(--bsm-ink);
max-width:22ch;
}
#page-bitcoin-slot-machine .bsm-h2--light{color:var(--bsm-on-vat);}
#page-bitcoin-slot-machine .bsm-h3{
margin:0 0 18px;
font-size:clamp(20px,1.8vw,25px);
line-height:1.26;
font-weight:700;
color:var(--bsm-ink);
}
#page-bitcoin-slot-machine .bsm-prose{
margin:0 0 34px;
max-width:86ch;
font-size:17px;
color:var(--bsm-ink-2);
}
#page-bitcoin-slot-machine .bsm-ilink{
color:var(--bsm-madder-deep);
font-weight:600;
border-bottom:1px solid rgba(141,43,32,.38);
transition:color .16s ease,border-color .16s ease;
}
#page-bitcoin-slot-machine .bsm-ilink:hover,
#page-bitcoin-slot-machine .bsm-ilink:focus-visible{
color:var(--bsm-madder-dark);
border-bottom-color:var(--bsm-madder-dark);
}
/* ══ buttons ═══════════════════════════════════════════════════════════════ */
#page-bitcoin-slot-machine .bsm-btn{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:54px;
padding:14px 34px;
border:1px solid transparent;
border-radius:2px;
font-family:inherit;
font-size:17px;
font-weight:700;
letter-spacing:.012em;
line-height:1.2;
text-align:center;
cursor:pointer;
transition:background-color .18s ease,color .18s ease,
border-color .18s ease,transform .12s ease;
}
/* Rule 39A — a painted background owns its foreground at (1,2,0), which no
generic descendant rule in this sheet can outrank. */
#page-bitcoin-slot-machine .bsm-btn.bsm-btn--act{
background:var(--bsm-madder);
color:var(--bsm-madder-ink);
border-color:var(--bsm-madder);
box-shadow:0 10px 26px -16px rgba(17,20,58,.85);
}
#page-bitcoin-slot-machine .bsm-btn.bsm-btn--act:hover{
background:var(--bsm-madder-dark);
border-color:var(--bsm-madder-dark);
}
#page-bitcoin-slot-machine .bsm-btn.bsm-btn--act:active{transform:translateY(1px);}
#page-bitcoin-slot-machine .bsm-btn.bsm-btn--ghost{
background:transparent;
color:var(--bsm-on-vat);
border-color:rgba(236,234,246,.46);
}
#page-bitcoin-slot-machine .bsm-btn.bsm-btn--ghost:hover{
background:var(--bsm-vat-2);
border-color:var(--bsm-on-vat);
}
#page-bitcoin-slot-machine .bsm-btn:focus-visible,
#page-bitcoin-slot-machine .bsm-vid:focus-visible,
#page-bitcoin-slot-machine .bsm-cloud__a:focus-visible,
#page-bitcoin-slot-machine .bsm-ilink:focus-visible,
#page-bitcoin-slot-machine .bsm-tel:focus-visible,
#page-bitcoin-slot-machine .bsm-langs a:focus-visible,
#page-bitcoin-slot-machine .bsm-crumb__home:focus-visible,
#page-bitcoin-slot-machine .bsm-faq summary:focus-visible,
#page-bitcoin-slot-machine .bsm-modal__x:focus-visible{
outline:3px solid var(--bsm-madder);
outline-offset:3px;
}
#page-bitcoin-slot-machine .bsm-cta-row{
margin:36px 0 0;
text-align:center;
}
#page-bitcoin-slot-machine .bsm-cta-row--start{text-align:left;}
/* ══ HERO — rule 24 ═══════════════════════════════════════════════════════
Full-bleed, image-free, one CTA, centred 900px column. A STATIC three-stop
gradient; every stop is dark, so the copy clears AA against the worst. */
#page-bitcoin-slot-machine .bsm-hero{
position:relative;
width:100%;
padding:clamp(66px,8vw,118px) 24px clamp(72px,8.4vw,122px);
background-color:var(--bsm-vat);
background-image:linear-gradient(157deg,
#11143a 0%, #2a3070 52%, #171a48 100%);
text-align:center;
}
/* the dip line, at the FOOT of the hero: the cloth came out of the vat here */
#page-bitcoin-slot-machine .bsm-hero::after{
content:"";
position:absolute;
left:0;right:0;bottom:0;
height:9px;
background:repeating-linear-gradient(90deg,
var(--bsm-on-vat) 0 2px, transparent 2px 7px);
opacity:.26;
}
#page-bitcoin-slot-machine .bsm-hero__inner{
max-width:900px;
margin-inline:auto;
}
#page-bitcoin-slot-machine .bsm-hero__inner p.bsm-hero__tag{
display:inline-block;
margin:0 0 26px;
padding:9px 20px;
background:var(--bsm-paper);
color:var(--bsm-vat);
border:1px solid rgba(255,255,255,.7);
font-size:16px;
font-weight:700;
letter-spacing:.15em;
text-transform:uppercase;
}
#page-bitcoin-slot-machine .bsm-hero h1{
margin:0 0 26px;
font-size:clamp(34px,4.7vw,58px);
line-height:1.07;
font-weight:800;
letter-spacing:-.022em;
color:#ffffff;
}
#page-bitcoin-slot-machine .bsm-hero__copy{
margin:0 auto 34px;
max-width:820px;
font-size:clamp(17px,1.3vw,19px);
line-height:1.66;
color:var(--bsm-on-vat);
}
#page-bitcoin-slot-machine .bsm-hero__act{margin:0;}
#page-bitcoin-slot-machine .bsm-hero__trust{
list-style:none;
margin:38px 0 0;
padding:0;
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:14px 30px;
}
#page-bitcoin-slot-machine .bsm-hero__trust li{
display:flex;
align-items:center;
gap:11px;
font-size:16px;
font-weight:600;
color:var(--bsm-on-vat-2);
}
/* a miniature dipped swatch, the hero's echo of the section mark */
#page-bitcoin-slot-machine .bsm-hero__trust li::before{
content:"";
flex:0 0 auto;
width:14px;height:14px;
border:1px solid rgba(236,234,246,.55);
background:linear-gradient(to bottom,
var(--bsm-paper) 0 50%, transparent 50% 100%);
}
/* ══ breadcrumb + language rail ════════════════════════════════════════════ */
#page-bitcoin-slot-machine .bsm-crumbbar{
width:100%;
background:var(--bsm-paper);
border-bottom:1px solid var(--bsm-line);
}
#page-bitcoin-slot-machine .bsm-crumbbar__row{
display:flex;
flex-wrap:wrap;
align-items:center;
justify-content:space-between;
gap:14px 26px;
padding-block:16px;
}
#page-bitcoin-slot-machine .bsm-crumb{
display:flex;
align-items:center;
gap:10px;
font-size:16px;
color:var(--bsm-ink-2);
}
#page-bitcoin-slot-machine .bsm-crumb__home{
display:inline-flex;
align-items:center;
gap:9px;
color:var(--bsm-madder-deep);
font-weight:600;
transition:color .16s ease;
}
#page-bitcoin-slot-machine .bsm-crumb__home:hover{color:var(--bsm-madder-dark);}
#page-bitcoin-slot-machine .bsm-crumb__home img{width:16px;height:16px;display:block;}
/* a decorative separator still has to be SEEN: at --bsm-line-2 it measured
1.79:1 on paper, which is invisible. #7a7361 is 4.6:1 and still recessive. */
#page-bitcoin-slot-machine .bsm-crumb__sep{color:#7a7361;}
#page-bitcoin-slot-machine .bsm-crumb__here{color:var(--bsm-ink);font-weight:600;}
#page-bitcoin-slot-machine .bsm-langs{
list-style:none;
display:flex;
flex-wrap:wrap;
align-items:center;
gap:8px 10px;
margin:0;padding:0;
}
#page-bitcoin-slot-machine .bsm-langs a{
display:inline-flex;
align-items:center;
gap:7px;
padding:6px 11px;
border:1px solid var(--bsm-line);
border-radius:2px;
font-size:16px;
font-weight:600;
color:var(--bsm-ink-2);
transition:border-color .16s ease,color .16s ease,background-color .16s ease;
}
#page-bitcoin-slot-machine .bsm-langs a:hover{
border-color:var(--bsm-vat-3);
color:var(--bsm-vat);
background:var(--bsm-cloth);
}
#page-bitcoin-slot-machine .bsm-langs img{
width:20px;height:20px;
border-radius:50%;
object-fit:contain; /* contain everywhere: never cover, on anything */
display:block;
}
/* ══ split bands — copy beside a product plate ═════════════════════════════ */
#page-bitcoin-slot-machine .bsm-lede,
#page-bitcoin-slot-machine .bsm-script,
#page-bitcoin-slot-machine .bsm-boost{
display:grid;
grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
gap:clamp(30px,4vw,60px);
align-items:start;
}
#page-bitcoin-slot-machine .bsm-lede__copy p,
#page-bitcoin-slot-machine .bsm-script__copy p{
margin:0 0 20px;
font-size:17px;
line-height:1.72;
color:var(--bsm-ink-2);
}
#page-bitcoin-slot-machine .bsm-lede__copy p:last-child,
#page-bitcoin-slot-machine .bsm-script__copy p:last-child{margin-bottom:0;}
/* the first paragraph of the lede carries the dip rule down its left edge */
#page-bitcoin-slot-machine .bsm-lede__copy p:first-child{
padding-left:22px;
border-left:3px solid var(--bsm-vat-3);
font-size:18px;
color:var(--bsm-ink);
}
/* product plates: a paper mount with a dipped foot. object-fit is CONTAIN
throughout — never cover on a screenshot, a mark or a logo. */
#page-bitcoin-slot-machine .bsm-plate{
margin:0;
padding:16px;
background:var(--bsm-paper);
border:1px solid var(--bsm-line);
border-bottom:6px solid var(--bsm-vat);
}
#page-bitcoin-slot-machine .bsm-plate img{
display:block;
width:100%;
height:auto;
object-fit:contain;
}
/* ══ band head — heading + one CTA on the same rule ════════════════════════ */
#page-bitcoin-slot-machine .bsm-band{
display:flex;
flex-wrap:wrap;
align-items:center;
justify-content:space-between;
gap:26px 44px;
padding:clamp(26px,3vw,40px) 0 0;
border-top:1px solid var(--bsm-line-vat);
}
#page-bitcoin-slot-machine .bsm-band--light{border-top-color:var(--bsm-line);}
#page-bitcoin-slot-machine .bsm-band > div{flex:1 1 480px;min-width:0;}
#page-bitcoin-slot-machine .bsm-band .bsm-h2{margin-bottom:14px;max-width:26ch;}
#page-bitcoin-slot-machine .bsm-band__sub{
margin:0;
font-size:18px;
color:var(--bsm-on-vat-2);
}
#page-bitcoin-slot-machine .bsm-band__sub--dark{color:var(--bsm-ink-2);}
#page-bitcoin-slot-machine .bsm-band__more{margin:18px 0 0;font-size:17px;}
#page-bitcoin-slot-machine .bsm-band__act{margin:0;flex:0 0 auto;}
/* ══ OUR APP'S SCREENSHOTS ═════════════════════════════════════════════════
Four captures of one build, all 16:9 within 0.03%. The cell takes the ART'S
OWN ratio (height:auto — no square, no crop), two across so the grid tiles
exactly; each renders 531px wide at 1440, 76% of the decoded asset. */
#page-bitcoin-slot-machine .bsm-shots{
list-style:none;
margin:34px 0 0;
padding:0;
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:clamp(20px,2.3vw,30px);
}
#page-bitcoin-slot-machine .bsm-shots li{
padding:14px;
background:var(--bsm-paper);
border:1px solid var(--bsm-line);
border-bottom:5px solid var(--bsm-vat);
transition:border-bottom-color .18s ease,box-shadow .18s ease;
}
#page-bitcoin-slot-machine .bsm-shots li:hover{
border-bottom-color:var(--bsm-madder);
box-shadow:0 16px 34px -26px rgba(17,20,58,.8);
}
#page-bitcoin-slot-machine .bsm-shots img{
display:block;
width:100%;
height:auto;
object-fit:contain;
}
/* ══ slot types — nine 669x375 marks, 3x3, tiles exactly, 414px each ══════
No object-fit:cover: cropping a type mark was a reported defect. Per-cell
borders, never the gap:1px + coloured-container divider trick. */
#page-bitcoin-slot-machine .bsm-types{
list-style:none;
margin:34px 0 0;
padding:0;
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:22px;
}
#page-bitcoin-slot-machine .bsm-types li{
background:var(--bsm-vat-2);
border:1px solid var(--bsm-line-vat);
border-bottom:4px solid var(--bsm-vat-3);
transition:border-bottom-color .18s ease,transform .16s ease;
}
#page-bitcoin-slot-machine .bsm-types li:hover{
border-bottom-color:var(--bsm-madder);
transform:translateY(-2px);
}
#page-bitcoin-slot-machine .bsm-types img{
display:block;
width:100%;
height:auto;
object-fit:contain;
}
/* ══ admin panel — eleven ruled spec rows ══════════════════════════════════ */
#page-bitcoin-slot-machine .bsm-spec{
list-style:none;
margin:32px 0 0;
padding:0;
border-bottom:1px solid var(--bsm-line);
}
#page-bitcoin-slot-machine .bsm-spec__row{
display:grid;
grid-template-columns:minmax(0,300px) minmax(0,1fr);
gap:10px 36px;
padding:22px 0;
border-top:1px solid var(--bsm-line);
}
#page-bitcoin-slot-machine .bsm-spec__t{
margin:0;
font-size:20px;
line-height:1.3;
font-weight:700;
color:var(--bsm-ink);
}
#page-bitcoin-slot-machine .bsm-spec__t::before{
content:"";
display:inline-block;
width:13px;height:13px;
margin-right:11px;
border:1px solid var(--bsm-vat-3);
background:linear-gradient(to bottom,
var(--bsm-paper) 0 50%, var(--bsm-vat) 50% 100%);
vertical-align:1px;
}
#page-bitcoin-slot-machine .bsm-spec__d{
margin:0;
font-size:17px;
color:var(--bsm-ink-2);
}
/* ══ player features — eleven items, three-column FLOW ════════════════════
Not a grid: eleven cells cannot tile, a flow fills 4/4/3 with no orphan. */
#page-bitcoin-slot-machine .bsm-flow{
margin-top:32px;
columns:3;
column-gap:44px;
}
#page-bitcoin-slot-machine .bsm-flow__item{
break-inside:avoid;
page-break-inside:avoid;
margin:0 0 28px;
padding:0 0 26px;
border-bottom:1px solid var(--bsm-line);
}
#page-bitcoin-slot-machine .bsm-flow__item h3{
margin:0 0 10px;
font-size:19px;
line-height:1.32;
font-weight:700;
color:var(--bsm-vat);
}
#page-bitcoin-slot-machine .bsm-flow__item p{
margin:0;
font-size:17px;
color:var(--bsm-ink-2);
}
/* ══ boost your business — checked offerings beside a plate ════════════════ */
#page-bitcoin-slot-machine .bsm-offers{
list-style:none;
margin:8px 0 0;
padding:0;
}
#page-bitcoin-slot-machine .bsm-offers li{
display:flex;
align-items:flex-start;
gap:14px;
padding:14px 0;
border-bottom:1px solid var(--bsm-line);
font-size:17px;
}
/* the CMS check is indigo (#45429d), seated on the LIGHT cloth ground at
~7:1 — never recoloured, never dropped onto a dark band. */
#page-bitcoin-slot-machine .bsm-offers img{
flex:0 0 auto;
width:22px;height:22px;
margin-top:3px;
display:block;
}
#page-bitcoin-slot-machine .bsm-plate--tall{align-self:stretch;}
/* ══ main features — fourteen entries, two across, seven down ══════════════ */
#page-bitcoin-slot-machine .bsm-grid14{
list-style:none;
margin:32px 0 0;
padding:0;
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
border-bottom:1px solid var(--bsm-line-vat);
}
#page-bitcoin-slot-machine .bsm-grid14 li{
padding:24px 30px 24px 0;
border-top:1px solid var(--bsm-line-vat);
}
#page-bitcoin-slot-machine .bsm-grid14 li:nth-child(2n){
padding-left:30px;padding-right:0;
border-left:1px solid var(--bsm-line-vat);
}
#page-bitcoin-slot-machine .bsm-grid14 h3{
margin:0 0 10px;
font-size:19px;
line-height:1.32;
font-weight:700;
color:var(--bsm-on-vat);
}
#page-bitcoin-slot-machine .bsm-grid14 h3::before{
content:"";
display:inline-block;
width:12px;height:12px;
margin-right:11px;
border:1px solid rgba(236,234,246,.5);
background:linear-gradient(to bottom,
var(--bsm-paper) 0 50%, var(--bsm-vat-deep) 50% 100%);
vertical-align:1px;
}
#page-bitcoin-slot-machine .bsm-grid14 p{
margin:0;
font-size:17px;
color:var(--bsm-on-vat-2);
}
/* ══ the script — benefits checklist ═══════════════════════════════════════ */
#page-bitcoin-slot-machine .bsm-benefits{
margin-top:clamp(36px,4vw,56px);
padding-top:clamp(30px,3.4vw,44px);
border-top:1px solid var(--bsm-line);
}
#page-bitcoin-slot-machine .bsm-checks{
list-style:none;
margin:0;
padding:0;
columns:3;
column-gap:40px;
}
#page-bitcoin-slot-machine .bsm-checks li{
break-inside:avoid;
page-break-inside:avoid;
display:flex;
align-items:flex-start;
gap:13px;
margin:0 0 14px;
font-size:17px;
color:var(--bsm-ink-2);
}
#page-bitcoin-slot-machine .bsm-checks img{
flex:0 0 auto;
width:21px;height:21px;
margin-top:3px;
display:block;
}
#page-bitcoin-slot-machine .bsm-benefits__tail{
margin:30px 0 0;
padding-top:26px;
border-top:1px solid var(--bsm-line);
max-width:92ch;
font-size:17px;
color:var(--bsm-ink-2);
}
/* ══ why AIS — capabilities and the two closing notes ══════════════════════ */
#page-bitcoin-slot-machine .bsm-caps{
padding:clamp(26px,3vw,38px);
background:var(--bsm-paper);
border:1px solid var(--bsm-line);
border-left:5px solid var(--bsm-vat);
}
#page-bitcoin-slot-machine .bsm-rings{
list-style:none;
margin:0;
padding:0;
columns:2;
column-gap:48px;
}
#page-bitcoin-slot-machine .bsm-rings li{
break-inside:avoid;
page-break-inside:avoid;
display:flex;
align-items:flex-start;
gap:14px;
margin:0 0 14px;
font-size:17px;
color:var(--bsm-ink-2);
}
#page-bitcoin-slot-machine .bsm-rings img{
flex:0 0 auto;
width:12px;height:12px;
margin-top:9px;
display:block;
}
#page-bitcoin-slot-machine .bsm-notes{
margin-top:26px;
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:22px;
}
#page-bitcoin-slot-machine .bsm-notes article{
padding:28px 30px;
background:var(--bsm-cloth-2);
border:1px solid var(--bsm-line);
border-bottom:5px solid var(--bsm-vat-3);
}
#page-bitcoin-slot-machine .bsm-notes .bsm-h3{margin-bottom:12px;font-size:21px;}
#page-bitcoin-slot-machine .bsm-notes p{
margin:0;
font-size:17px;
color:var(--bsm-ink-2);
}
/* ══ discover more — eighteen links, three across, six down ════════════════ */
#page-bitcoin-slot-machine .bsm-cloud{
list-style:none;
margin:32px 0 0;
padding:0;
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
border-bottom:1px solid var(--bsm-line-vat);
}
#page-bitcoin-slot-machine .bsm-cloud li{
border-top:1px solid var(--bsm-line-vat);
display:flex;
}
#page-bitcoin-slot-machine .bsm-cloud li:not(:nth-child(3n+1)){
border-left:1px solid var(--bsm-line-vat);
}
#page-bitcoin-slot-machine .bsm-cloud__a{
display:flex;
align-items:center;
gap:12px;
width:100%;
padding:20px 22px;
font-size:17px;
font-weight:600;
color:var(--bsm-on-vat);
transition:background-color .16s ease,color .16s ease;
}
#page-bitcoin-slot-machine .bsm-cloud__a::before{
content:"";
flex:0 0 auto;
width:11px;height:11px;
border:1px solid rgba(236,234,246,.5);
background:linear-gradient(to bottom,
var(--bsm-paper) 0 50%, transparent 50% 100%);
}
#page-bitcoin-slot-machine .bsm-cloud__a:hover{
background:var(--bsm-vat-2);
color:#ffffff;
}
/* ══ FAQ ═══════════════════════════════════════════════════════════════════ */
#page-bitcoin-slot-machine .bsm-faq{
margin-top:32px;
border-top:1px solid var(--bsm-line);
}
#page-bitcoin-slot-machine .bsm-faq details{border-bottom:1px solid var(--bsm-line);}
#page-bitcoin-slot-machine .bsm-faq summary{
display:flex;
align-items:center;
justify-content:space-between;
gap:24px;
padding:24px 4px;
cursor:pointer;
list-style:none;
}
#page-bitcoin-slot-machine .bsm-faq summary::-webkit-details-marker{display:none;}
#page-bitcoin-slot-machine .bsm-faq__q{
margin:0;
font-size:20px;
line-height:1.34;
font-weight:700;
color:var(--bsm-ink);
}
#page-bitcoin-slot-machine .bsm-faq summary:hover .bsm-faq__q{color:var(--bsm-madder-deep);}
/* The toggle is a dye swatch that DIPS FURTHER as the panel opens: at rest the
gradient fills the box (bottom half dyed); open, it is scaled to 200% height
and pinned to the bottom edge, so only the dyed half is in frame. */
#page-bitcoin-slot-machine .bsm-faq__i{
flex:0 0 auto;
width:30px;height:30px;
border:1px solid var(--bsm-vat-3);
background-color:var(--bsm-paper);
background-image:linear-gradient(to bottom,
transparent 0 50%, var(--bsm-vat) 50% 100%);
background-repeat:no-repeat;
background-position:0 100%;
background-size:100% 100%;
transition:background-size .22s ease,border-color .22s ease;
}
#page-bitcoin-slot-machine .bsm-faq details[open] .bsm-faq__i{
background-size:100% 200%;
border-color:var(--bsm-madder);
}
#page-bitcoin-slot-machine .bsm-faq__a{padding:0 4px 26px;}
#page-bitcoin-slot-machine .bsm-faq__a ul{margin:0;padding:0;list-style:none;}
#page-bitcoin-slot-machine .bsm-faq__a li{
padding-left:22px;
border-left:3px solid var(--bsm-vat-3);
font-size:17px;
color:var(--bsm-ink-2);
}
/* ══ customer success stories ══════════════════════════════════════════════ */
#page-bitcoin-slot-machine .bsm-stories{
list-style:none;
margin:34px 0 0;
padding:0;
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:26px;
}
#page-bitcoin-slot-machine .bsm-story{
display:flex;
flex-direction:column;
background:var(--bsm-vat-2);
border:1px solid var(--bsm-line-vat);
border-bottom:5px solid var(--bsm-vat-3);
}
#page-bitcoin-slot-machine .bsm-vid{
position:relative;
display:block;
width:100%;
padding:0;
border:0;
background:var(--bsm-vat-deep);
cursor:pointer;
transition:filter .18s ease;
}
#page-bitcoin-slot-machine .bsm-vid img{
display:block;
width:100%;
height:auto;
object-fit:contain;
}
#page-bitcoin-slot-machine .bsm-vid__play{
position:absolute;
left:50%;top:50%;
transform:translate(-50%,-50%);
width:62px;height:62px;
border-radius:50%;
background:var(--bsm-madder);
box-shadow:0 10px 26px -10px rgba(17,20,58,.9);
transition:background-color .18s ease,transform .16s ease;
}
#page-bitcoin-slot-machine .bsm-vid__play::after{
content:"";
position:absolute;
left:54%;top:50%;
transform:translate(-50%,-50%);
border-style:solid;
border-width:11px 0 11px 18px;
border-color:transparent transparent transparent var(--bsm-madder-ink);
}
#page-bitcoin-slot-machine .bsm-vid:hover .bsm-vid__play{
background:var(--bsm-madder-dark);
transform:translate(-50%,-50%) scale(1.06);
}
#page-bitcoin-slot-machine .bsm-story__frame{
display:block;
width:100%;
aspect-ratio:4/3;
border:0;
}
#page-bitcoin-slot-machine .bsm-story blockquote{
margin:0;
padding:24px 26px 28px;
}
#page-bitcoin-slot-machine .bsm-story blockquote p{
margin:0;
font-size:17px;
line-height:1.66;
color:var(--bsm-on-vat-2);
}
/* ══ Area We Serve — filed under FOOTER in the record, authored in ,
because the shared footer is sitewide. Four regions tile exactly. ═══════ */
#page-bitcoin-slot-machine .bsm-regions{
list-style:none;
margin:32px 0 0;
padding:0;
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:22px;
}
#page-bitcoin-slot-machine .bsm-region{
padding:28px 26px;
background:var(--bsm-paper);
border:1px solid var(--bsm-line);
border-top:5px solid var(--bsm-vat);
}
#page-bitcoin-slot-machine .bsm-region__h{
display:flex;
align-items:center;
gap:11px;
margin:0 0 16px;
font-size:17px;
font-weight:800;
letter-spacing:.1em;
color:var(--bsm-vat);
}
#page-bitcoin-slot-machine .bsm-region__h img{
flex:0 0 auto;
width:14px;height:20px;
display:block;
}
#page-bitcoin-slot-machine .bsm-region__tel{margin:0 0 12px;font-size:17px;}
/* the phone link must beat the page baseline `#page-... a{color:inherit}`,
which is (1,0,1); this is (1,2,0) and wins on class count. */
#page-bitcoin-slot-machine .bsm-region__tel .bsm-tel{
font-weight:700;
color:var(--bsm-madder-deep);
transition:color .16s ease;
}
#page-bitcoin-slot-machine .bsm-region__tel .bsm-tel:hover{color:var(--bsm-madder-dark);}
#page-bitcoin-slot-machine .bsm-region address{
font-style:normal;
font-size:16px;
line-height:1.62;
color:var(--bsm-ink-2);
}
/* ══ CTA modal — the page's only enquiry surface (rule 30) ═════════════════ */
#page-bitcoin-slot-machine .bsm-modal{
position:fixed;
inset:0;
z-index:9999;
display:none;
align-items:flex-start;
justify-content:center;
padding: 100px clamp(16px,4vw,48px) clamp(16px,4vw,48px) clamp(16px,4vw,48px);
overflow-y:auto;
background:rgba(17,20,58,.86);
}
#page-bitcoin-slot-machine .bsm-modal.is-open{display:flex;}
#page-bitcoin-slot-machine .bsm-modal__box{
position:relative;
width:100%;
max-width:620px;
padding:58px 18px 18px;
background:#ffffff;
border-radius:4px;
box-shadow:0 40px 90px -30px rgba(0,0,0,.72);
}
#page-bitcoin-slot-machine .bsm-modal__x{
position:absolute;
top:14px;right:14px;
width:44px;height:44px;
display:inline-flex;
align-items:center;
justify-content:center;
border:1px solid var(--bsm-line);
border-radius:50%;
background:var(--bsm-cloth);
color:var(--bsm-vat);
cursor:pointer;
transition:background-color .18s ease,color .18s ease,border-color .18s ease;
}
#page-bitcoin-slot-machine .bsm-modal__x:hover{
background:var(--bsm-madder);
color:var(--bsm-madder-ink);
border-color:var(--bsm-madder);
}
#page-bitcoin-slot-machine .bsm-modal iframe{
display:block;
width:100%;
min-height:880px;
border:0;
border-radius:3px;
}
/* ══ responsive ════════════════════════════════════════════════════════════ */
@media (max-width:1180px){
#page-bitcoin-slot-machine .bsm-spec__row{grid-template-columns:minmax(0,250px) minmax(0,1fr);}
#page-bitcoin-slot-machine .bsm-flow{column-gap:34px;}
#page-bitcoin-slot-machine .bsm-checks{column-gap:30px;}
}
@media (max-width:1024px){
#page-bitcoin-slot-machine .bsm-flow{columns:2;}
#page-bitcoin-slot-machine .bsm-checks{columns:2;}
#page-bitcoin-slot-machine .bsm-types{grid-template-columns:repeat(2,minmax(0,1fr));}
#page-bitcoin-slot-machine .bsm-cloud{grid-template-columns:repeat(2,minmax(0,1fr));}
#page-bitcoin-slot-machine .bsm-cloud li:not(:nth-child(3n+1)){border-left:0;}
#page-bitcoin-slot-machine .bsm-cloud li:nth-child(2n){
border-left:1px solid var(--bsm-line-vat);
}
#page-bitcoin-slot-machine .bsm-regions{grid-template-columns:repeat(2,minmax(0,1fr));}
#page-bitcoin-slot-machine .bsm-stories{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:900px){
#page-bitcoin-slot-machine .bsm-lede,
#page-bitcoin-slot-machine .bsm-script,
#page-bitcoin-slot-machine .bsm-boost{grid-template-columns:minmax(0,1fr);}
#page-bitcoin-slot-machine .bsm-plate--tall{align-self:start;}
#page-bitcoin-slot-machine .bsm-notes{grid-template-columns:minmax(0,1fr);}
#page-bitcoin-slot-machine .bsm-grid14{grid-template-columns:minmax(0,1fr);}
#page-bitcoin-slot-machine .bsm-grid14 li,
#page-bitcoin-slot-machine .bsm-grid14 li:nth-child(2n){
padding:22px 0;border-left:0;
}
#page-bitcoin-slot-machine .bsm-spec__row{grid-template-columns:minmax(0,1fr);gap:10px;}
#page-bitcoin-slot-machine .bsm-h2{max-width:none;}
/* a flex band head must claim the whole row here, or the heading and the CTA
fight over a 300px column and the heading wraps to four lines */
#page-bitcoin-slot-machine .bsm-band > div{flex:1 0 100%;}
#page-bitcoin-slot-machine .bsm-band__act{flex:1 0 100%;}
}
@media (max-width:760px){
#page-bitcoin-slot-machine .bsm-shots{grid-template-columns:minmax(0,1fr);}
#page-bitcoin-slot-machine .bsm-stories{grid-template-columns:minmax(0,1fr);}
#page-bitcoin-slot-machine .bsm-flow,
#page-bitcoin-slot-machine .bsm-checks,
#page-bitcoin-slot-machine .bsm-rings{columns:1;}
#page-bitcoin-slot-machine .bsm-crumbbar__row{justify-content:flex-start;}
}
@media (max-width:600px){
#page-bitcoin-slot-machine .bsm-types{grid-template-columns:minmax(0,1fr);}
#page-bitcoin-slot-machine .bsm-cloud{grid-template-columns:minmax(0,1fr);}
#page-bitcoin-slot-machine .bsm-cloud li:nth-child(2n){border-left:0;}
#page-bitcoin-slot-machine .bsm-regions{grid-template-columns:minmax(0,1fr);}
#page-bitcoin-slot-machine .bsm-btn{width:100%;}
#page-bitcoin-slot-machine .bsm-cta-row{text-align:left;}
#page-bitcoin-slot-machine .bsm-hero__trust{
justify-content:flex-start;
text-align:left;
gap:12px 22px;
}
#page-bitcoin-slot-machine .bsm-caps{padding:24px 20px;border-left-width:4px;}
#page-bitcoin-slot-machine .bsm-modal__box{padding:56px 12px 12px;}
#page-bitcoin-slot-machine .bsm-modal iframe{min-height:920px;}
}
@media (max-width:420px){
#page-bitcoin-slot-machine .bsm-mark{gap:10px;letter-spacing:.12em;}
#page-bitcoin-slot-machine .bsm-mark::before{width:28px;height:16px;}
#page-bitcoin-slot-machine .bsm-region{padding:24px 20px;}
#page-bitcoin-slot-machine .bsm-faq summary{gap:14px;}
}
/* rule 26 — this sheet declares no @keyframes at all; the reset below covers
the finite hover / focus / details-open transitions that remain. */
@media (prefers-reduced-motion:reduce){
#page-bitcoin-slot-machine *,
#page-bitcoin-slot-machine *::before,
#page-bitcoin-slot-machine *::after{
animation:none!important;
transition-duration:.01ms!important;
scroll-behavior:auto!important;
}
}