/* PSG888 casino, the long-scroll landing. Warm bone ground, oxblood headings, gold rules,
   one editorial column with full-bleed bands. Static stylesheet: the build does NOT
   regenerate this file.

   House style for this sheet:
     - The gaps and insets, the line heights, the letter-spacings, the font weights and the
       shadows used more than once are named once in :root as --q-* and called by name
       everywhere else;
     - box properties are written in logical names (block-start, inline-end) so a modifier
       resets the one edge it means to;
     - every border is split into width, style and colour;
     - gap is row-gap plus column-gap;
     - overflow is overflow-x plus overflow-y;
     - a transition is spelled out as property, duration, timing and delay;
     - an animation names all eight of its parts. */

:root {
  --bg: #121315;
  --card: #1b1d21;
  --sink: #24262b;
  --line: #2b2f36;
  --line2: #3a3f48;
  --ink: #f2f4f7;
  --ink2: #c8ced8;
  --mut: #9aa3af;
  --wine: #1e9bf0;
  --wine-d: #0d7cc7;
  --gold: #f5c518;
  --gold-d: #c99c0c;
  --gold-l: #ffd84d;
  --ok: #34c759;
  --r: 4px;
  --r-lg: 8px;
  --w: 1120px;
  --read: 760px;

  /* named values used more than once */
  --q-sp1: .4em;
  --q-sp2: 1.15em;
  --q-sp3: 1.5em;
  --q-sp4: 2px;
  --q-sp5: 4px;
  --q-sp6: 5px;
  --q-sp7: 6px;
  --q-sp8: 8px;
  --q-sp9: 9px;
  --q-sp10: 10px;
  --q-sp11: 11px;
  --q-sp12: 12px;
  --q-sp13: 13px;
  --q-sp14: 14px;
  --q-sp15: 15px;
  --q-sp16: 16px;
  --q-sp17: 18px;
  --q-sp18: 20px;
  --q-sp19: 22px;
  --q-sp20: 24px;
  --q-sp21: 26px;
  --q-sp22: 30px;
  --q-sp23: 34px;
  --q-sp24: 40px;
  --q-sp25: 44px;
  --q-tr1: .07em;
  --q-tr2: .12em;
  --q-wt1: 800;
  --q-wt2: 900;
  --q-wt3: 700;
}

* {box-sizing: border-box;}

html {overflow-x: clip; -webkit-text-size-adjust: 100%;}

body {
  margin-block: 0;
  margin-inline: 0;
  background: var(--bg);
  color: var(--ink);
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  font-stretch: normal;
  font-size: 1.0625rem;
  line-height: 1.72;
  font-family: "Inter", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", sans-serif;
}

img {max-width: 100%; height: auto; display: block; min-width: 0;}
a {color: var(--wine); text-decoration-line: underline; text-decoration-style: solid; text-decoration-color: currentcolor; text-decoration-thickness: auto; text-underline-offset: 0.125rem;}
a:hover {color: var(--wine-d);}
h1, h2, h3, h4 {margin-block-start: 0; margin-inline-end: 0; margin-block-end: .46em; margin-inline-start: 0; line-height: 1.12; font-weight: 850; letter-spacing: -.022em; color: var(--ink);}
h1 {font-size: clamp(2.0625rem, 6.6vw, 3.75rem);}
h2 {font-size: clamp(1.5rem, 3.4vw, 2.125rem);}
h3 {font-size: clamp(1.125rem, 2.2vw, 1.375rem);}
p {margin-block-start: 0; margin-inline-end: 0; margin-block-end: var(--q-sp2); margin-inline-start: 0;}
ul, ol {margin-block-start: 0; margin-inline-end: 0; margin-block-end: var(--q-sp2); margin-inline-start: 0; padding-inline-start: 1.2em;}
li {margin-block-start: 0; margin-inline-end: 0; margin-block-end: .5em; margin-inline-start: 0;}
:focus-visible {outline: 0.1875rem solid var(--wine); outline-offset: 0.125rem; border-radius: 0.1875rem;}
table {border-collapse: collapse;}

/* ---------------------------------------------------------------- buttons */
.pc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  row-gap: var(--q-sp1);
  column-gap: var(--q-sp1);
  min-width: 0;
  min-height: 2.875rem;
  padding-block: var(--q-sp11);
  padding-inline: var(--q-sp19);
  border-width: 0.125rem;
  border-style: solid;
  border-color: transparent;
  border-radius: var(--r);
  font-weight: var(--q-wt1);
  font-size: 0.9375rem;
  text-decoration-line: none;
  text-decoration-style: solid;
  text-decoration-color: currentcolor;
  text-decoration-thickness: auto;
  cursor: pointer;
  text-align: center;
}
.pc-btn:hover {text-decoration-line: none; text-decoration-style: solid; text-decoration-color: currentcolor; text-decoration-thickness: auto;}
.pc-btn.p {background: var(--wine); color: #fff4d8;}
.pc-btn.p:hover {background: var(--wine-d); color: #fff4d8;}
.pc-btn.o {background: transparent; border-color: var(--ink); color: var(--ink);}
.pc-btn.o:hover {background: var(--ink); color: var(--bg);}
.pc-btn.g {background: var(--gold); color: #241c00;}
.pc-btn.g:hover {background: var(--gold-d); color: #241c00;}
.pc-btn.lg {min-height: 3.375rem; padding-block: var(--q-sp15); padding-inline: var(--q-sp22); font-size: 1.03125rem;}

/* ---------------------------------------------------------------- header */
.pc-offer {
  display: flex;
  align-items: center;
  justify-content: center;
  row-gap: var(--q-sp14);
  column-gap: var(--q-sp14);
  flex-wrap: wrap;
  padding-block: var(--q-sp8);
  padding-inline: var(--q-sp16);
  background: var(--wine);
  color: #ffe9c9;
  font-size: 0.84375rem;
  font-weight: 600;
}
.pc-offer .pc-btn {min-height: 2.125rem; padding-block: var(--q-sp6); padding-inline: var(--q-sp14); font-size: 0.78125rem; border-radius: 62.4375rem;}

.pc-head {position: sticky; inset-block-start: 0; z-index: 30; background: var(--bg); border-block-end-width: 0.0625rem; border-block-end-style: solid; border-block-end-color: var(--line);}
.pc-head .bar {display: flex; align-items: center; row-gap: var(--q-sp14); column-gap: var(--q-sp14); max-width: var(--w); margin-block: 0; margin-inline: auto; padding-block: var(--q-sp12); padding-inline: var(--q-sp18);}
.pc-logo {display: flex; align-items: center; row-gap: var(--q-sp10); column-gap: var(--q-sp10); min-width: 0; text-decoration-line: none; text-decoration-style: solid; text-decoration-color: currentcolor; text-decoration-thickness: auto;}
.pc-logo svg {width: 2.25rem; height: 2.25rem; flex-grow: 0; flex-shrink: 0; flex-basis: auto;}
.pc-logo .wm {display: flex; flex-direction: column; line-height: 1.04; min-width: 0;}
.pc-logo .wm b {font-size: 1.3125rem; font-weight: var(--q-wt2); letter-spacing: -.02em; color: var(--wine); white-space: nowrap;}
.pc-logo .wm small {font-size: 0.5625rem; letter-spacing: .14em; color: var(--mut); white-space: nowrap;}
.pc-burger {display: none; min-width: 2.875rem; min-height: 2.875rem; background: transparent; border-width: 0.0625rem; border-style: solid; border-color: var(--line2); border-radius: var(--r); color: var(--ink); font-size: 1.125rem; cursor: pointer;}
.pc-nav {display: flex; row-gap: var(--q-sp5); column-gap: var(--q-sp5); margin-inline-start: auto; min-width: 0; flex-wrap: wrap; justify-content: flex-end;}
.pc-nav a {padding-block: var(--q-sp8); padding-inline: var(--q-sp11); font-size: 0.875rem; font-weight: 650; color: var(--ink2); text-decoration-line: none; text-decoration-style: solid; text-decoration-color: currentcolor; text-decoration-thickness: auto; border-radius: var(--r); white-space: nowrap;}
.pc-nav a:hover {background: var(--sink); color: var(--ink);}
.pc-lang {display: flex; row-gap: var(--q-sp4); column-gap: var(--q-sp4);}
.pc-lang a {padding-block: var(--q-sp7); padding-inline: var(--q-sp9); font-size: 0.75rem; font-weight: var(--q-wt3); color: var(--mut); text-decoration-line: none; text-decoration-style: solid; text-decoration-color: currentcolor; text-decoration-thickness: auto; border-radius: var(--r); white-space: nowrap;}
.pc-lang a.on {background: var(--ink); color: var(--bg);}
.pc-head .pc-btn {flex-grow: 0; flex-shrink: 0; flex-basis: auto;}

/* ---------------------------------------------------------------- hero */
.pc-hero {
  max-width: var(--read);
  margin-block: 0;
  margin-inline: auto;
  padding-block-start: 3.375rem;
  padding-inline-end: var(--q-sp18);
  padding-block-end: var(--q-sp18);
  padding-inline-start: var(--q-sp18);
  text-align: center;
}
.eb {
  display: inline-block;
  margin-block-end: var(--q-sp17);
  font-size: 0.75rem;
  font-weight: var(--q-wt1);
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--mut);
}
.pc-hero h1 {margin-block-end: var(--q-sp21);}
.pc-hero h1::after {content: ""; display: block; width: 5.375rem; height: 0.3125rem; margin-block-start: var(--q-sp21); margin-inline-end: auto; margin-block-end: 0; margin-inline-start: auto; background: var(--gold);}
.lead {font-size: 1.1875rem; line-height: 1.62; color: var(--ink2); margin-block-end: var(--q-sp21);}
.act {display: flex; flex-wrap: wrap; row-gap: var(--q-sp12); column-gap: var(--q-sp12); justify-content: center; margin-block-end: var(--q-sp20);}
.pc-hero > img {max-width: var(--w); margin-block-start: var(--q-sp22); margin-inline-end: auto; margin-block-end: 0; margin-inline-start: auto; border-radius: var(--r-lg); border-width: 0.0625rem; border-style: solid; border-color: var(--line); width: 100%;}

.pc-paychips {display: flex; flex-wrap: wrap; row-gap: var(--q-sp9); column-gap: var(--q-sp9); justify-content: center; margin-block-end: var(--q-sp16);}
.pc-paychips span, .pc-studios .logos span, .pc-foot .pay span, .pc-foot .trust span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  padding-block: var(--q-sp8);
  padding-inline: var(--q-sp13);
  /* White, not the dark panel: vendor marks are dark-ink artwork and were almost
     invisible against the charcoal body. One treatment for every mark sitewide. */
  background: #ffffff;
  border-width: 0.0625rem;
  border-style: solid;
  border-color: rgba(0, 0, 0, .14);
  border-radius: var(--r);
}
.pc-paychips img {max-height: 1.375rem; width: auto; min-width: 0;}
.pc-studios .logos img {max-height: 1.5625rem; width: auto; min-width: 0;}
.pc-foot .pay img, .pc-foot .trust img {max-height: 1.25rem; width: auto; min-width: 0;}

.pc-badges {display: flex; flex-wrap: wrap; row-gap: var(--q-sp8); column-gap: var(--q-sp8); justify-content: center;}
.pc-badges span {
  padding-block: var(--q-sp6);
  padding-inline: var(--q-sp12);
  border-radius: 62.4375rem;
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line2);
  font-size: 0.71875rem;
  font-weight: var(--q-wt1);
  letter-spacing: var(--q-tr1);
  text-transform: uppercase;
  color: var(--mut);
}

/* ---------------------------------------------------------------- kpis */
.pc-kpis {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  row-gap: 0;
  column-gap: 0;
  max-width: var(--w);
  margin-block: 2.375rem;
  margin-inline: auto;
  padding-block: 0;
  padding-inline: var(--q-sp18);
  border-block-start-width: 0.125rem;
  border-block-start-style: solid;
  border-block-start-color: var(--ink);
  border-block-end-width: 0.0625rem;
  border-block-end-style: solid;
  border-block-end-color: var(--line);
}
.pc-kpis div {padding-block: var(--q-sp19); padding-inline: var(--q-sp14); border-inline-end-width: 0.0625rem; border-inline-end-style: solid; border-inline-end-color: var(--line); min-width: 0;}
.pc-kpis div:last-child {border-inline-end-width: 0; border-inline-end-style: none; border-inline-end-color: currentcolor;}
.pc-kpis b {display: block; font-size: 1.875rem; font-weight: var(--q-wt2); color: var(--wine); font-variant-numeric: tabular-nums; letter-spacing: -.03em;}
.pc-kpis span {display: block; margin-block-start: var(--q-sp6); font-size: 0.8125rem; color: var(--mut);}

/* ---------------------------------------------------------------- category cards */
.pc-cats {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  row-gap: var(--q-sp17);
  column-gap: var(--q-sp17);
  max-width: var(--w);
  margin-block-start: 0;
  margin-inline-end: auto;
  margin-block-end: var(--q-sp25);
  margin-inline-start: auto;
  padding-block: 0;
  padding-inline: var(--q-sp18);
}
.pc-cat {
  display: block;
  background: var(--card);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
  border-radius: var(--r-lg);
  overflow-x: hidden;
  overflow-y: hidden;
  text-decoration-line: none;
  text-decoration-style: solid;
  text-decoration-color: currentcolor;
  text-decoration-thickness: auto;
  min-width: 0;
}
.pc-cat:hover {border-color: var(--gold);}
.pc-cat img {width: 100%; aspect-ratio: 4 / 3; object-fit: cover;}
.pc-cat b {display: block; padding-block-start: var(--q-sp15); padding-inline-end: var(--q-sp16); padding-block-end: 0; padding-inline-start: var(--q-sp16); font-size: 1.1875rem; color: var(--wine);}
.pc-cat span {display: block; padding-block-start: var(--q-sp7); padding-inline-end: var(--q-sp16); padding-block-end: var(--q-sp17); padding-inline-start: var(--q-sp16); font-size: 0.90625rem; color: var(--ink2);}

/* ---------------------------------------------------------------- studios */
.pc-studios {
  max-width: var(--w);
  margin-block-start: 0;
  margin-inline-end: auto;
  margin-block-end: var(--q-sp25);
  margin-inline-start: auto;
  padding-block: var(--q-sp22);
  padding-inline: var(--q-sp18);
  background: var(--sink);
  border-block-start-width: 0.0625rem;
  border-block-start-style: solid;
  border-block-start-color: var(--line);
  border-block-end-width: 0.0625rem;
  border-block-end-style: solid;
  border-block-end-color: var(--line);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  row-gap: var(--q-sp23);
  column-gap: var(--q-sp23);
}
.pc-studios h3 {font-size: 0.9375rem; text-transform: uppercase; letter-spacing: var(--q-tr2); color: var(--mut); margin-block-end: var(--q-sp14);}
.pc-studios .chips {display: flex; flex-wrap: wrap; row-gap: var(--q-sp8); column-gap: var(--q-sp8);}
.pc-studios .chip {
  padding-block: var(--q-sp8);
  padding-inline: var(--q-sp14);
  background: var(--card);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
  border-radius: 62.4375rem;
  font-size: 0.84375rem;
  font-weight: var(--q-wt3);
}
.pc-studios .logos {display: flex; flex-wrap: wrap; row-gap: var(--q-sp9); column-gap: var(--q-sp9);}

/* ---------------------------------------------------------------- band */
.pc-band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  row-gap: var(--q-sp18);
  column-gap: var(--q-sp18);
  max-width: var(--w);
  margin-block-start: 0;
  margin-inline-end: auto;
  margin-block-end: var(--q-sp25);
  margin-inline-start: auto;
  padding-block: var(--q-sp21);
  padding-inline: 1.75rem;
  background: var(--wine);
  border-radius: var(--r-lg);
  color: #ffe9c9;
}
.pc-band b {font-size: 1.1875rem; min-width: 0;}

/* ---------------------------------------------------------------- reading column */
.pc-wrap {
  display: grid;
  grid-template-columns: 14.375rem minmax(0, 1fr);
  row-gap: var(--q-sp25);
  column-gap: var(--q-sp25);
  align-items: start;
  max-width: var(--w);
  margin-block-start: 0;
  margin-inline-end: auto;
  margin-block-end: var(--q-sp25);
  margin-inline-start: auto;
  padding-block: 0;
  padding-inline: var(--q-sp18);
}
.pc-col {min-width: 0; max-width: var(--read);}
.pc-col h2 {margin-block-start: var(--q-sp3);}
.pc-col h2:first-child {margin-block-start: 0;}

.pc-jump {position: sticky; inset-block-start: 5.75rem; min-width: 0;}
.pc-jump h2 {font-size: 0.8125rem; text-transform: uppercase; letter-spacing: .13em; color: var(--mut); margin-block-end: var(--q-sp12);}
.pc-jump ol {list-style-type: none; list-style-position: outside; list-style-image: none; margin-block: 0; margin-inline: 0; padding-block: 0; padding-inline: 0; counter-reset: j;}
.pc-jump li {margin-block: 0; margin-inline: 0; border-block-start-width: 0.0625rem; border-block-start-style: solid; border-block-start-color: var(--line);}
.pc-jump a {display: flex; row-gap: var(--q-sp10); column-gap: var(--q-sp10); padding-block: var(--q-sp10); padding-inline: var(--q-sp4); font-size: 0.84375rem; color: var(--ink2); text-decoration-line: none; text-decoration-style: solid; text-decoration-color: currentcolor; text-decoration-thickness: auto; min-height: 2.75rem; align-items: center;}
.pc-jump a:hover {color: var(--wine);}
.pc-jump i {font-style: normal; font-weight: var(--q-wt1); color: var(--gold-d); font-variant-numeric: tabular-nums;}

.pc-steps {counter-reset: s; list-style-type: none; list-style-position: outside; list-style-image: none; padding-block: 0; padding-inline: 0; margin-block-start: 0; margin-inline-end: 0; margin-block-end: var(--q-sp22); margin-inline-start: 0;}
.pc-steps li {counter-increment: s; position: relative; margin-block-start: 0; margin-inline-end: 0; margin-block-end: var(--q-sp12); margin-inline-start: 0; padding-block-start: 0; padding-inline-end: 0; padding-block-end: 0; padding-inline-start: 3.25rem;}
.pc-steps li::before {
  content: counter(s);
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: -0.125rem;
  width: 2.125rem;
  height: 2.125rem;
  display: grid;
  align-items: center;
  justify-items: center;
  border-radius: 50%;
  border-width: 0.125rem;
  border-style: solid;
  border-color: var(--gold);
  color: var(--wine);
  font-weight: var(--q-wt2);
  font-size: 0.875rem;
}

.pc-tw {overflow-x: auto; margin-block-start: var(--q-sp19); margin-inline-end: 0; margin-block-end: var(--q-sp22); margin-inline-start: 0;}
.pc-tbl {width: 100%; font-size: 0.9375rem; background: var(--card);}
.pc-tbl th {
  text-align: left;
  padding-block: var(--q-sp12);
  padding-inline: var(--q-sp14);
  background: var(--ink);
  color: var(--bg);
  font-size: 0.75rem;
  font-weight: var(--q-wt1);
  letter-spacing: var(--q-tr1);
  text-transform: uppercase;
  white-space: nowrap;
}
.pc-tbl td {padding-block: var(--q-sp12); padding-inline: var(--q-sp14); border-block-end-width: 0.0625rem; border-block-end-style: solid; border-block-end-color: var(--line);}

.pc-faq {margin-block-start: var(--q-sp7); margin-inline-end: 0; margin-block-end: var(--q-sp22); margin-inline-start: 0;}
.pc-faq details {border-block-end-width: 0.0625rem; border-block-end-style: solid; border-block-end-color: var(--line);}
.pc-faq summary {padding-block-start: var(--q-sp16); padding-inline-end: var(--q-sp22); padding-block-end: var(--q-sp16); padding-inline-start: 0; cursor: pointer; font-weight: 750; font-size: 1.0625rem; position: relative; min-height: 2.75rem;}
.pc-faq summary::-webkit-details-marker {display: none;}
.pc-faq summary::after {content: "+"; position: absolute; inset-inline-end: 0.125rem; inset-block-start: 0.875rem; color: var(--gold-d); font-weight: var(--q-wt2); font-size: 1.375rem;}
.pc-faq details[open] summary::after {content: "\2212";}
.pc-faq p {margin-block: 0; margin-inline: 0; padding-block-start: 0; padding-inline-end: 0; padding-block-end: var(--q-sp17); padding-inline-start: 0; color: var(--ink2);}

/* ---------------------------------------------------------------- payment cards */
.pc-pays {display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); row-gap: var(--q-sp14); column-gap: var(--q-sp14); max-width: var(--w); margin-block-start: 0; margin-inline-end: auto; margin-block-end: var(--q-sp25); margin-inline-start: auto; padding-block: 0; padding-inline: var(--q-sp18);}
.pc-pc {padding-block: var(--q-sp17); padding-inline: var(--q-sp17); background: var(--card); border-width: 0.0625rem; border-style: solid; border-color: var(--line); border-radius: var(--r-lg); min-width: 0;}
.pc-pc img {max-height: 1.5rem; width: auto; min-width: 0; margin-block-end: var(--q-sp12);}
.pc-pc b {display: block; font-size: 1rem;}
.pc-pc .n {display: block; margin-block-start: 0.1875rem; margin-inline-end: 0; margin-block-end: var(--q-sp9); margin-inline-start: 0; font-size: 0.75rem; font-weight: var(--q-wt1); color: var(--ok); letter-spacing: .04em;}
.pc-pc p {margin-block: 0; margin-inline: 0; font-size: 0.84375rem; color: var(--ink2); line-height: 1.6;}

/* ---------------------------------------------------------------- rtp table */
.pc-rtp {max-width: var(--w); margin-block-start: 0; margin-inline-end: auto; margin-block-end: var(--q-sp25); margin-inline-start: auto; padding-block: 0; padding-inline: var(--q-sp18);}
.pc-rtp h2 {margin-block-end: var(--q-sp17);}
.pc-rtp table {width: 100%; font-size: 0.9375rem; background: var(--card); border-width: 0.0625rem; border-style: solid; border-color: var(--line);}
.pc-rtp th {text-align: left; padding-block: var(--q-sp11); padding-inline: var(--q-sp14); font-size: 0.75rem; text-transform: uppercase; letter-spacing: var(--q-tr1); color: var(--mut); border-block-end-width: 0.0625rem; border-block-end-style: solid; border-block-end-color: var(--line);}
.pc-rtp td {padding-block: var(--q-sp11); padding-inline: var(--q-sp14); border-block-end-width: 0.0625rem; border-block-end-style: solid; border-block-end-color: var(--line);}
.pc-rtp tr:last-child td {border-block-end-width: 0; border-block-end-style: none; border-block-end-color: currentcolor;}
.pc-rtp .tw {overflow-x: auto;}
.pc-rtp .n {font-variant-numeric: tabular-nums; white-space: nowrap;}
/* the builder emits <td class="bar"><i style="width:N%"></i></td>: the cell is the track and the
   <i> is the fill. Styling .bar as the fill drew a 4px dot outside the column instead. */
.pc-rtp td.bar {width: 34%; min-width: 7.5rem;}
.pc-rtp td.bar i {display: block; height: 0.5rem; border-radius: 62.4375rem; background: var(--gold); min-width: 0.25rem;}

/* ---------------------------------------------------------------- phone split */
.pc-shot {
  display: grid;
  grid-template-columns: 16.875rem minmax(0, 1fr);
  row-gap: var(--q-sp24);
  column-gap: var(--q-sp24);
  align-items: center;
  max-width: var(--w);
  margin-block-start: 0;
  margin-inline-end: auto;
  margin-block-end: var(--q-sp25);
  margin-inline-start: auto;
  padding-block: var(--q-sp23);
  padding-inline: var(--q-sp18);
  background: var(--sink);
  border-block-start-width: 0.0625rem;
  border-block-start-style: solid;
  border-block-start-color: var(--line);
  border-block-end-width: 0.0625rem;
  border-block-end-style: solid;
  border-block-end-color: var(--line);
}
.pc-shot img {border-radius: var(--r-lg); width: 100%; border-width: 0.0625rem; border-style: solid; border-color: var(--line);}
.pc-shot .tx {min-width: 0;}
.pc-shot ul {list-style-type: none; list-style-position: outside; list-style-image: none; padding-block: 0; padding-inline: 0; margin-block-start: 0; margin-inline-end: 0; margin-block-end: var(--q-sp19); margin-inline-start: 0;}
.pc-shot li {position: relative; padding-inline-start: var(--q-sp21); margin-block-end: var(--q-sp9); font-size: 0.9375rem; color: var(--ink2);}
.pc-shot li::before {content: "\2713"; position: absolute; inset-inline-start: 0; color: var(--ok); font-weight: var(--q-wt2);}

/* ---------------------------------------------------------------- reviews */
.pc-revs {display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); row-gap: var(--q-sp16); column-gap: var(--q-sp16); max-width: var(--w); margin-block-start: 0; margin-inline-end: auto; margin-block-end: var(--q-sp25); margin-inline-start: auto; padding-block: 0; padding-inline: var(--q-sp18);}
.pc-rev {padding-block: var(--q-sp18); padding-inline: var(--q-sp18); background: var(--card); border-width: 0.0625rem; border-style: solid; border-color: var(--line); border-radius: var(--r-lg); min-width: 0;}
.pc-rev .hd {display: flex; align-items: baseline; row-gap: var(--q-sp9); column-gap: var(--q-sp9); margin-block-end: var(--q-sp9); flex-wrap: wrap;}
.pc-rev b {font-size: 0.96875rem;}
.pc-rev .p {font-size: 0.8125rem; color: var(--mut);}
.pc-rev .on {color: var(--gold-d); letter-spacing: .08em;}
.pc-rev p {margin-block: 0; margin-inline: 0; font-size: 0.90625rem; color: var(--ink2);}

/* ---------------------------------------------------------------- utility page */
.pc-util {max-width: var(--read); margin-block: 0; margin-inline: auto; padding-block-start: 2.875rem; padding-inline-end: var(--q-sp18); padding-block-end: 3.125rem; padding-inline-start: var(--q-sp18);}
.pc-util h2 {margin-block-start: var(--q-sp3);}

/* ---------------------------------------------------------------- inner hero */
.pc-ph {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  row-gap: var(--q-sp24);
  column-gap: var(--q-sp24);
  align-items: center;
  max-width: var(--w);
  margin-block-start: 0;
  margin-inline-end: auto;
  margin-block-end: 2.25rem;
  margin-inline-start: auto;
  padding-block-start: var(--q-sp24);
  padding-inline-end: var(--q-sp18);
  padding-block-end: var(--q-sp10);
  padding-inline-start: var(--q-sp18);
}
.pc-ph .tx {min-width: 0;}
.pc-ph .tx .act {justify-content: flex-start;}
.pc-ph h1 {font-size: clamp(1.75rem, 4.6vw, 2.75rem);}
.pc-ph h1::after {display: none;}
.pc-ph > img {border-radius: var(--r-lg); border-width: 0.0625rem; border-style: solid; border-color: var(--line); width: 100%;}

/* ---------------------------------------------------------------- footer */
.pc-foot {background: var(--ink); color: #ded8c6; margin-block-start: var(--q-sp10);}
.pc-foot .w {max-width: var(--w); margin-block: 0; margin-inline: auto; padding-block-start: var(--q-sp25); padding-inline-end: var(--q-sp18); padding-block-end: var(--q-sp23); padding-inline-start: var(--q-sp18);}
.pc-foot .cols {display: grid; grid-template-columns: 1.7fr 1fr 1fr 1fr; row-gap: var(--q-sp22); column-gap: var(--q-sp22);}
.pc-foot .ab {min-width: 0;}
.pc-foot .ab p {font-size: 0.875rem; color: #b8b2a0; margin-block-start: var(--q-sp14); margin-inline-end: 0; margin-block-end: 0; margin-inline-start: 0;}
.pc-foot h4 {font-size: 0.75rem; letter-spacing: var(--q-tr2); text-transform: uppercase; color: var(--gold-l); margin-block-end: var(--q-sp13);}
.pc-foot .cols div a {display: block; margin-block-end: var(--q-sp10); font-size: 0.875rem; color: #ded8c6; text-decoration-line: none; text-decoration-style: solid; text-decoration-color: currentcolor; text-decoration-thickness: auto;}
.pc-foot .cols div a:hover {color: #fff; text-decoration-line: underline; text-decoration-style: solid; text-decoration-color: currentcolor; text-decoration-thickness: auto;}
.pc-foot .pc-logo .wm b {color: var(--gold-l);}
.pc-foot .marks {display: flex; flex-wrap: wrap; row-gap: var(--q-sp21); column-gap: var(--q-sp21); margin-block-start: var(--q-sp22);}
.pc-foot .pay, .pc-foot .trust {display: flex; flex-wrap: wrap; row-gap: var(--q-sp9); column-gap: var(--q-sp9);}
.pc-foot .pay span, .pc-foot .trust span {background: #efece2; border-color: #cdc8bb;}
.pc-foot .rg {margin-block-start: var(--q-sp21); margin-inline-end: 0; margin-block-end: var(--q-sp7); margin-inline-start: 0; font-size: 0.8125rem; color: #b8b2a0;}
.pc-foot .cr {margin-block: 0; margin-inline: 0; font-size: 0.8125rem; color: #8d8878;}

/* ---------------------------------------------------------------- sticky cta */
.pc-scta {
  display: none;
  position: fixed;
  inset-block-start: auto;
  inset-inline-end: 0;
  inset-block-end: 0;
  inset-inline-start: 0;
  z-index: 40;
  row-gap: var(--q-sp10);
  column-gap: var(--q-sp10);
  padding-block: var(--q-sp10);
  padding-inline: var(--q-sp14);
  background: rgba(247, 243, 232, .97);
  border-block-start-width: 0.0625rem;
  border-block-start-style: solid;
  border-block-start-color: var(--line2);
}
.pc-scta .pc-btn {flex-grow: 1; flex-shrink: 1; flex-basis: auto;}
.pc-top {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 2.875rem;
  min-height: 2.875rem;
  display: grid;
  align-items: center;
  justify-items: center;
  border-radius: var(--r);
  background: var(--card);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line2);
  color: var(--ink);
  text-decoration-line: none;
  text-decoration-style: solid;
  text-decoration-color: currentcolor;
  text-decoration-thickness: auto;
}

@media (prefers-reduced-motion: reduce) { * {scroll-behavior: auto;} }

/* ---------------------------------------------------------------- responsive */
@media (max-width: 1040px) {
  .pc-wrap {grid-template-columns: minmax(0, 1fr); row-gap: var(--q-sp21); column-gap: var(--q-sp21);}
  .pc-jump {position: static;}
  .pc-jump ol {display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); row-gap: 0; column-gap: var(--q-sp18);}
  .pc-pays {grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);}
  .pc-cats {grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);}
  .pc-foot .cols {grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);}
}

@media (max-width: 880px) {
  body {padding-block-end: 6.5rem;}   /* sticky bar is 73px; keep a real gap under the footer */
  .pc-burger {display: block;}
  .pc-nav {display: none; order: 3; width: 100%; justify-content: flex-start;}
  .pc-open .pc-nav {display: flex; flex-direction: column; row-gap: var(--q-sp4); column-gap: var(--q-sp4);}
  .pc-open .pc-nav a {width: 100%;}
  .pc-head .bar {flex-wrap: wrap;}
  .pc-studios, .pc-shot, .pc-ph {grid-template-columns: minmax(0, 1fr); row-gap: var(--q-sp20); column-gap: var(--q-sp20);}
  .pc-shot img, .pc-ph > img {max-width: 20rem; margin-block: 0; margin-inline: auto;}
  .pc-ph > img {order: -1;}
  .pc-revs {grid-template-columns: minmax(0, 1fr);}
  .pc-scta {display: flex;}
  .pc-kpis {grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);}
  .pc-kpis div:nth-child(2) {border-inline-end-width: 0; border-inline-end-style: none; border-inline-end-color: currentcolor;}
}

@media (max-width: 620px) {
  body {font-size: 1rem;}
  .pc-logo .wm small {display: none;}
  .pc-head .bar {padding-block: var(--q-sp10); padding-inline: var(--q-sp16); row-gap: var(--q-sp10); column-gap: var(--q-sp10);}
  /* two columns at phone width squeezed each payment card to 161x372, a 2.3:1 strip.
     One column per row keeps them readable. */
  .pc-pays {grid-template-columns: minmax(0, 1fr);}
  .pc-cats {grid-template-columns: minmax(0, 1fr);}
  .pc-band {flex-direction: column; align-items: flex-start;}
  .pc-band .pc-btn {width: 100%;}
  .pc-jump ol {grid-template-columns: minmax(0, 1fr);}
  .pc-foot .cols {grid-template-columns: minmax(0, 1fr);}
  .act .pc-btn {width: 100%;}
  .pc-hero {padding-block-start: var(--q-sp23);}
}

/* wrappers the builder emits that the blocks above address only by their children */
.pc-side {display: flex; align-items: center; row-gap: var(--q-sp10); column-gap: var(--q-sp10); margin-inline-start: auto; min-width: 0;}
.pc-studios .h5, .pc-studios .wall {min-width: 0;}