/* PSG888 Malaysia, the reference register that sells. Deep oxblood ground, bone cards, brass
   hairlines, tables as the house style with a conversion band between them. Static stylesheet:
   the build does NOT regenerate this file.

   Conventions in here:
     - The corner radii, the type sizes, the font stacks and the font weights used more than
       once are named once in :root as --tk-* 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: #fbf7f1;
  --deep: #f2ebe0;
  --card: #ffffff;
  --card2: #f6f0e7;
  --line: #e5dbcc;
  --rule: #d9ccb8;
  --ink: #2b2017;
  --ink2: #4a3a2b;
  --mut: #6d5c4a;
  --onbg: #2b2017;
  --onbg2: #6d5c4a;
  --brass: #c4631c;
  --brass-l: #e08c3c;
  --brass-d: #9a4a11;
  --ok: #2f7d52;
  --r: 7px;
  --w: 1180px;

  /* token layer */
  --tk-rad1: 999px;
  --tk-fs1: 10.5px;
  --tk-fs2: 11px;
  --tk-fs3: 11.5px;
  --tk-fs4: 12px;
  --tk-fs5: 12.5px;
  --tk-fs6: 13px;
  --tk-fs7: 13.5px;
  --tk-fs8: 14px;
  --tk-fs9: 14.5px;
  --tk-fs10: 15px;
  --tk-fs11: 16px;
  --tk-fs12: 17px;
  --tk-fs13: 20px;
  --tk-wt1: 700;
  --tk-wt2: 800;
  --tk-wt3: 900;
}

* {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(--onbg);
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  font-stretch: normal;
  font-size: 16px;
  line-height: 1.68;
  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(--brass-l); text-decoration-line: none; text-decoration-style: solid; text-decoration-color: currentcolor; text-decoration-thickness: auto;}
a:hover {text-decoration-line: underline; text-decoration-style: solid; text-decoration-color: currentcolor; text-decoration-thickness: auto;}
h1, h2, h3, h4 {margin-block-start: 0; margin-inline-end: 0; margin-block-end: .48em; margin-inline-start: 0; line-height: 1.2; font-weight: var(--tk-wt2); letter-spacing: -.012em;}
h1 {font-size: clamp(27px, 4.5vw, 42px);}
h2 {font-size: clamp(21px, 2.9vw, 30px);}
h3 {font-size: clamp(17px, 2.1vw, 21px);}
p {margin-block-start: 0; margin-inline-end: 0; margin-block-end: 1.05em; margin-inline-start: 0;}
ul, ol {margin-block-start: 0; margin-inline-end: 0; margin-block-end: 1.1em; margin-inline-start: 0; padding-inline-start: 1.2em;}
li {margin-block-start: 0; margin-inline-end: 0; margin-block-end: .45em; margin-inline-start: 0;}
:focus-visible {outline: 3px solid var(--brass-l); outline-offset: 2px; border-radius: 4px;}
table {border-collapse: collapse;}

/* ---------------------------------------------------------------- buttons */
.pm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  row-gap: .4em;
  column-gap: .4em;
  min-width: 0;
  min-height: 45px;
  padding-block: 11px;
  padding-inline: 20px;
  border-width: 1px;
  border-style: solid;
  border-color: transparent;
  border-radius: var(--r);
  font-weight: var(--tk-wt2);
  font-size: var(--tk-fs9);
  cursor: pointer;
  text-align: center;
}
.pm-btn:hover {text-decoration-line: none; text-decoration-style: solid; text-decoration-color: currentcolor; text-decoration-thickness: auto; filter: brightness(1.06);}
.pm-btn.p {background: linear-gradient(180deg, var(--brass-l), var(--brass)); color: #2a1a00;}
.pm-btn.o {background: transparent; border-color: var(--brass); color: var(--brass-l);}
.pm-btn.g {background: var(--card); color: var(--ink);}
.pm-btn.lg {min-height: 52px; padding-block: 14px; padding-inline: 28px; font-size: var(--tk-fs11);}

/* ---------------------------------------------------------------- top offer strip */
.pm-strip {
  display: flex;
  align-items: center;
  justify-content: center;
  row-gap: 14px;
  column-gap: 14px;
  flex-wrap: wrap;
  padding-block: 8px;
  padding-inline: 16px;
  background: linear-gradient(90deg, var(--brass-d), var(--brass));
  color: #2a1a00;
  font-size: var(--tk-fs7);
  font-weight: var(--tk-wt1);
}
.pm-strip .pm-btn {min-height: 34px; padding-block: 5px; padding-inline: 14px; font-size: var(--tk-fs5); background: var(--deep); color: var(--brass-l);}

/* ---------------------------------------------------------------- header */
.pm-head {position: relative; z-index: 30; background: var(--deep); border-block-end-width: 1px; border-block-end-style: solid; border-block-end-color: var(--line);}
.pm-head .bar {display: flex; align-items: center; row-gap: 14px; column-gap: 14px; max-width: var(--w); margin-block: 0; margin-inline: auto; padding-block: 12px; padding-inline: 18px;}
.pm-logo {display: flex; align-items: center; row-gap: 10px; column-gap: 10px; min-width: 0;}
.pm-logo:hover {text-decoration-line: none; text-decoration-style: solid; text-decoration-color: currentcolor; text-decoration-thickness: auto;}
.pm-logo svg {width: 36px; height: 36px; flex-grow: 0; flex-shrink: 0; flex-basis: auto;}
.pm-logo .wm {display: flex; flex-direction: column; line-height: 1.05; min-width: 0;}
.pm-logo .wm b {font-size: var(--tk-fs13); font-weight: var(--tk-wt3); color: var(--brass-l); letter-spacing: .02em; white-space: nowrap;}
.pm-logo .wm small {font-size: 9px; letter-spacing: .15em; color: var(--onbg2); white-space: nowrap;}
.pm-burger {display: none; min-width: 45px; min-height: 45px; background: transparent; border-width: 1px; border-style: solid; border-color: var(--line); border-radius: var(--r); color: var(--brass-l); font-size: 18px; cursor: pointer;}
.pm-nav {display: flex; row-gap: 3px; column-gap: 3px; margin-inline-start: auto; min-width: 0; flex-wrap: wrap; justify-content: flex-end;}
.pm-nav a {padding-block: 8px; padding-inline: 11px; font-size: var(--tk-fs7); font-weight: 650; color: var(--onbg); border-radius: var(--r); white-space: nowrap;}
.pm-nav a:hover {background: var(--line); text-decoration-line: none; text-decoration-style: solid; text-decoration-color: currentcolor; text-decoration-thickness: auto;}
.pm-lang {display: flex; row-gap: 2px; column-gap: 2px;}
.pm-lang a {padding-block: 6px; padding-inline: 9px; font-size: var(--tk-fs4); font-weight: var(--tk-wt1); color: var(--onbg2); border-radius: var(--r); white-space: nowrap;}
.pm-lang a.on {background: var(--brass); color: #2a1a00;}

/* ---------------------------------------------------------------- hero */
.pm-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  row-gap: 34px;
  column-gap: 34px;
  align-items: start;
  max-width: var(--w);
  margin-block: 0;
  margin-inline: auto;
  padding-block-start: 36px;
  padding-inline-end: 18px;
  padding-block-end: 30px;
  padding-inline-start: 18px;
}
.pm-hero .tx {min-width: 0;}
.eb {
  display: inline-block;
  margin-block-end: 13px;
  font-size: var(--tk-fs3);
  font-weight: var(--tk-wt2);
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--brass);
}
.lead {font-size: var(--tk-fs12); color: var(--onbg2);}
.act {display: flex; flex-wrap: wrap; row-gap: 11px; column-gap: 11px; margin-block-start: 20px; margin-inline-end: 0; margin-block-end: 6px; margin-inline-start: 0;}

.pm-caps {display: flex; flex-wrap: wrap; row-gap: 8px; column-gap: 8px; margin-block-end: 20px;}
.pm-caps span {
  padding-block: 6px;
  padding-inline: 13px;
  border-radius: var(--tk-rad1);
  border-width: 1px;
  border-style: solid;
  border-color: var(--line);
  background: rgba(0, 0, 0, .18);
  font-size: var(--tk-fs5);
  color: var(--onbg);
}

.pm-promo {
  padding-block: 22px;
  padding-inline: 22px;
  background: var(--card);
  color: var(--ink);
  border-radius: var(--r);
  border-width: 1px;
  border-style: solid;
  border-color: var(--rule);
  min-width: 0;
}
.pm-promo .pill {
  display: inline-block;
  margin-block-end: 11px;
  padding-block: 4px;
  padding-inline: 11px;
  border-radius: var(--tk-rad1);
  background: var(--brass-d, #9a4a11);
  color: #ffe9c9;
  font-size: var(--tk-fs2);
  font-weight: var(--tk-wt2);
  letter-spacing: .09em;
  text-transform: uppercase;
}
.pm-promo h2 {font-size: 22px; color: var(--ink); margin-block-end: 16px;}
.pm-promo .cd {display: flex; row-gap: 10px; column-gap: 10px; margin-block-end: 15px;}
.pm-promo .cd span {flex-grow: 1; flex-shrink: 1; flex-basis: 0; min-width: 0; padding-block: 10px; padding-inline: 4px; text-align: center; background: var(--card2); border-radius: var(--r);}
.pm-promo .cd b {display: block; font-size: 25px; font-weight: var(--tk-wt3); color: var(--ink); font-variant-numeric: tabular-nums;}
.pm-promo .cd em {display: block; font-style: normal; font-size: var(--tk-fs1); color: var(--ink2); text-transform: uppercase; letter-spacing: .07em;}
.pm-promo p {font-size: var(--tk-fs8); color: var(--ink2);}
.pm-promo .pm-btn {width: 100%;}

/* ---------------------------------------------------------------- category cards */
.pm-cats {display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); row-gap: 14px; column-gap: 14px; max-width: var(--w); margin-block-start: 0; margin-inline-end: auto; margin-block-end: 40px; margin-inline-start: auto; padding-block: 0; padding-inline: 18px;}
.pm-cat {display: flex; flex-direction: column; background: var(--deep); border-width: 1px; border-style: solid; border-color: var(--line); border-radius: var(--r); overflow-x: hidden; overflow-y: hidden; min-width: 0;}
.pm-cat:hover {border-color: var(--brass); text-decoration-line: none; text-decoration-style: solid; text-decoration-color: currentcolor; text-decoration-thickness: auto;}
.pm-cat img {width: 100%; aspect-ratio: 4 / 3; object-fit: cover;}
.pm-cat .tx {padding-block-start: 14px; padding-inline-end: 15px; padding-block-end: 16px; padding-inline-start: 15px; min-width: 0;}
.pm-cat b {display: block; font-size: var(--tk-fs8); color: var(--onbg);}
.pm-cat .big {display: block; margin-block-start: 4px; margin-inline-end: 0; margin-block-end: 3px; margin-inline-start: 0; font-size: 26px; font-weight: var(--tk-wt3); color: var(--brass-l); font-variant-numeric: tabular-nums;}
.pm-cat span {display: block; font-size: var(--tk-fs5); color: var(--onbg2);}

/* ---------------------------------------------------------------- common section frame */
.pm-tiers, .pm-wheel, .pm-fees, .pm-time, .pm-revs, .pm-banner {
  max-width: var(--w);
  margin-block-start: 0;
  margin-inline-end: auto;
  margin-block-end: 40px;
  margin-inline-start: auto;
  padding-block: 0;
  padding-inline: 18px;
}
.pm-tiers .sub, .pm-fees .note {color: var(--onbg2); font-size: var(--tk-fs9); max-width: 74ch;}

/* tier cards */
.pm-tiers .g {display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); row-gap: 13px; column-gap: 13px; margin-block-start: 20px;}
.pm-tier {
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: 4px;
  column-gap: 4px;
  min-width: 0;
  padding-block-start: 20px;
  padding-inline-end: 16px;
  padding-block-end: 18px;
  padding-inline-start: 16px;
  background: var(--card);
  color: var(--ink);
  border-width: 1px;
  border-style: solid;
  border-color: var(--rule);
  border-radius: var(--r);
}
.pm-tier.pop {background: var(--deep); color: var(--onbg); border-color: var(--brass); transform: translateY(-8px);}
.pm-tier .rib {
  position: absolute;
  inset-block-start: -13px;
  inset-inline-start: 50%;
  transform: translateX(-50%);
  padding-block: 4px;
  padding-inline: 13px;
  border-radius: var(--tk-rad1);
  background: var(--brass);
  color: #2a1a00;
  font-size: var(--tk-fs1);
  font-weight: var(--tk-wt3);
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
}
.pm-tier b {font-size: var(--tk-fs11);}
.pm-tier .pc {font-size: 29px; font-weight: var(--tk-wt3); color: var(--brass-d); font-variant-numeric: tabular-nums;}
.pm-tier.pop .pc {color: var(--brass-l);}
.pm-tier em {font-style: normal; font-size: var(--tk-fs3); text-transform: uppercase; letter-spacing: .07em; color: var(--mut);}
.pm-tier p {margin-block-start: 8px; margin-inline-end: 0; margin-block-end: 14px; margin-inline-start: 0; font-size: var(--tk-fs6);}
.pm-tier .pm-btn {margin-block-start: auto; width: 100%;}

/* wheel */
.pm-wheel {display: grid; grid-template-columns: 300px minmax(0, 1fr); row-gap: 36px; column-gap: 36px; align-items: center;}
.pm-wheel .dial {position: relative; text-align: center; min-width: 0;}
.pm-wheel .wh {
  width: 100%;
  max-width: 250px;
  aspect-ratio: 1 / 1;
  margin-block-start: 0;
  margin-inline-end: auto;
  margin-block-end: 16px;
  margin-inline-start: auto;
  border-radius: 50%;
  border-width: 8px;
  border-style: solid;
  border-color: var(--brass-d);
  background: conic-gradient(var(--brass) 0 45deg, var(--deep) 45deg 90deg, var(--brass-l) 90deg 135deg,
    var(--deep) 135deg 180deg, var(--brass) 180deg 225deg, var(--deep) 225deg 270deg,
    var(--brass-l) 270deg 315deg, var(--deep) 315deg 360deg);
}
.pm-wheel .pin {
  position: absolute;
  inset-block-start: -4px;
  inset-inline-start: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-inline-start-width: 11px;
  border-inline-start-style: solid;
  border-inline-start-color: transparent;
  border-inline-end-width: 11px;
  border-inline-end-style: solid;
  border-inline-end-color: transparent;
  border-block-start-width: 20px;
  border-block-start-style: solid;
  border-block-start-color: var(--card);
}
.pm-wheel .dial small {display: block; margin-block-start: 9px; font-size: var(--tk-fs4); color: var(--onbg2);}
.pm-wheel .tx {min-width: 0;}
.pm-wheel .pill {
  display: inline-block;
  margin-block-end: 10px;
  padding-block: 4px;
  padding-inline: 12px;
  border-radius: var(--tk-rad1);
  background: var(--line);
  font-size: var(--tk-fs2);
  font-weight: var(--tk-wt2);
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--brass-l);
}
.pm-wheel .tx p {color: var(--onbg2); font-size: var(--tk-fs9);}
.pm-wheel .pzs {display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); row-gap: 11px; column-gap: 11px; margin-block-start: 16px;}
.pm-wheel .pz {padding-block: 13px; padding-inline: 15px; background: var(--deep); border-width: 1px; border-style: solid; border-color: var(--line); border-radius: var(--r); min-width: 0;}
.pm-wheel .pz b {display: block; font-size: var(--tk-fs7);}
.pm-wheel .pz span {display: block; margin-block-start: 3px; font-size: var(--tk-fs10); font-weight: var(--tk-wt2); color: var(--brass-l);}

/* fees + generic tables */
.pm-fees .tw, .pm-tw {overflow-x: auto; margin-block-start: 18px; margin-inline-end: 0; margin-block-end: 16px; margin-inline-start: 0; border-width: 1px; border-style: solid; border-color: var(--line); border-radius: var(--r);}
.pm-fees table, .pm-tbl {width: 100%; font-size: var(--tk-fs9); background: var(--deep);}
.pm-fees th, .pm-tbl th {
  text-align: left;
  padding-block: 12px;
  padding-inline: 14px;
  background: var(--line);
  color: var(--brass-l);
  font-size: var(--tk-fs3);
  font-weight: var(--tk-wt2);
  letter-spacing: .07em;
  text-transform: uppercase;
  white-space: nowrap;
}
.pm-fees td, .pm-tbl td {padding-block: 12px; padding-inline: 14px; border-block-start-width: 1px; border-block-start-style: solid; border-block-start-color: var(--line);}
.pm-fees .ok {color: #7fd6a2; font-weight: var(--tk-wt1);}

/* timeline */
.pm-time ol {list-style-type: none; list-style-position: outside; list-style-image: none; margin-block-start: 18px; margin-inline-end: 0; margin-block-end: 0; margin-inline-start: 0; padding-block: 0; padding-inline: 0;}
.pm-time li {position: relative; margin-block: 0; margin-inline: 0; padding-block-start: 0; padding-inline-end: 0; padding-block-end: 26px; padding-inline-start: 38px; border-inline-start-width: 2px; border-inline-start-style: solid; border-inline-start-color: var(--line);}
.pm-time li:last-child {border-inline-start-color: transparent; padding-block-end: 0;}
.pm-time li::before {
  content: "";
  position: absolute;
  inset-inline-start: -9px;
  inset-block-start: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--brass);
  border-width: 3px;
  border-style: solid;
  border-color: var(--bg);
}
.pm-time b {display: block; font-size: var(--tk-fs11);}
.pm-time .t {display: inline-block; margin-block-start: 4px; margin-inline-end: 0; margin-block-end: 6px; margin-inline-start: 0; padding-block: 3px; padding-inline: 10px; border-radius: var(--tk-rad1); background: var(--line); font-size: var(--tk-fs3); font-weight: var(--tk-wt2); color: var(--brass-l); font-variant-numeric: tabular-nums;}
.pm-time p {margin-block: 0; margin-inline: 0; font-size: var(--tk-fs8); color: var(--onbg2);}

/* reviews */
.pm-revs .g {display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); row-gap: 15px; column-gap: 15px; margin-block-start: 18px;}
.pm-rev {padding-block: 19px; padding-inline: 19px; background: var(--card); color: var(--ink); border-radius: var(--r); min-width: 0;}
.pm-rev .hd {display: flex; align-items: baseline; row-gap: 9px; column-gap: 9px; flex-wrap: wrap; margin-block-end: 9px;}
.pm-rev b {font-size: var(--tk-fs10);}
.pm-rev .sm {font-size: var(--tk-fs5); color: var(--ink2);}
.pm-rev .st {color: var(--brass-d); letter-spacing: .08em;}
.pm-rev p {margin-block-start: 0; margin-inline-end: 0; margin-block-end: 11px; margin-inline-start: 0; font-size: var(--tk-fs8); color: var(--ink2);}
.pm-rev .ft {display: flex; row-gap: 10px; column-gap: 10px; align-items: center; padding-block-start: 10px; border-block-start-width: 1px; border-block-start-style: solid; border-block-start-color: var(--rule); font-size: var(--tk-fs4); color: var(--ink2);}
.pm-rev .vf {color: var(--ok); font-weight: var(--tk-wt2);}

/* banner */
.pm-banner img {width: 100%; border-radius: var(--r); border-width: 1px; border-style: solid; border-color: var(--line);}

/* conversion band */
.pm-band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  row-gap: 18px;
  column-gap: 18px;
  max-width: var(--w);
  margin-block-start: 0;
  margin-inline-end: auto;
  margin-block-end: 40px;
  margin-inline-start: auto;
  padding-block: 22px;
  padding-inline: 24px;
  background: linear-gradient(135deg, var(--deep), #3a181c);
  border-width: 1px;
  border-style: solid;
  border-color: var(--brass-d);
  border-radius: var(--r);
}
.pm-band b {font-size: var(--tk-fs12); min-width: 0;}

/* ---------------------------------------------------------------- reading column */
.pm-col, .pm-ph {max-width: var(--w); margin-block: 0; margin-inline: auto; padding-block-start: 0; padding-inline-end: 18px; padding-block-end: 40px; padding-inline-start: 18px;}
/* a single reading column: the build puts the steps, prose, table and FAQ straight into
   .pm-col with no sidebar, so a two-track grid split them down the middle. */
.pm-col {max-width: 860px;}
.pm-col .main {min-width: 0;}
.pm-col h2 {margin-block-start: 1.5em;}
.pm-col h2:first-child {margin-block-start: 0;}
/* .pm-side is the header's right-hand group (language switcher plus the two buttons), not a
   page sidebar. It was styled as a sticky column, which stacked the header controls. */
.pm-side {display: flex; align-items: center; row-gap: 10px; column-gap: 10px; margin-inline-start: auto; min-width: 0;}

.pm-kpis {display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); row-gap: 12px; column-gap: 12px; margin-block-start: 0; margin-inline-end: 0; margin-block-end: 26px; margin-inline-start: 0;}
.pm-kpis div {padding-block: 15px; padding-inline: 15px; background: var(--deep); border-width: 1px; border-style: solid; border-color: var(--line); border-radius: var(--r); min-width: 0;}
.pm-kpis b {display: block; font-size: 23px; font-weight: var(--tk-wt3); color: var(--brass-l); font-variant-numeric: tabular-nums;}
.pm-kpis span {display: block; margin-block-start: 4px; font-size: var(--tk-fs5); color: var(--onbg2);}

.pm-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: 26px; margin-inline-start: 0;}
.pm-steps li {counter-increment: s; position: relative; margin-block-start: 0; margin-inline-end: 0; margin-block-end: 10px; margin-inline-start: 0; padding-block-start: 14px; padding-inline-end: 16px; padding-block-end: 14px; padding-inline-start: 54px; background: var(--deep); border-width: 1px; border-style: solid; border-color: var(--line); border-radius: var(--r);}
.pm-steps li::before {
  content: counter(s);
  position: absolute;
  inset-inline-start: 15px;
  inset-block-start: 13px;
  width: 27px;
  height: 27px;
  display: grid;
  align-items: center;
  justify-items: center;
  border-radius: 50%;
  background: var(--brass);
  color: #2a1a00;
  font-weight: var(--tk-wt3);
  font-size: var(--tk-fs6);
}

.pm-faq {margin-block-start: 4px; margin-inline-end: 0; margin-block-end: 26px; margin-inline-start: 0;}
.pm-faq details {border-width: 1px; border-style: solid; border-color: var(--line); border-radius: var(--r); background: var(--deep); margin-block-end: 9px;}
.pm-faq summary {padding-block: 14px; padding-inline: 16px; cursor: pointer; font-weight: var(--tk-wt1); min-height: 44px;}
.pm-faq summary::-webkit-details-marker {display: none;}
.pm-faq summary::after {content: "+"; float: right; color: var(--brass); font-weight: var(--tk-wt3);}
.pm-faq details[open] summary::after {content: "\2212";}
.pm-faq p {margin-block: 0; margin-inline: 0; padding-block-start: 0; padding-inline-end: 16px; padding-block-end: 15px; padding-inline-start: 16px; color: var(--onbg2);}

/* inner hero */
.pm-ph {display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); row-gap: 32px; column-gap: 32px; align-items: center; padding-block-start: 32px; padding-block-end: 26px;}
.pm-ph .tx {min-width: 0;}
.pm-ph > img {border-radius: var(--r); border-width: 1px; border-style: solid; border-color: var(--line); width: 100%;}

.utl {max-width: 800px;}

/* ---------------------------------------------------------------- footer */
.pm-foot {background: var(--deep); border-block-start-width: 1px; border-block-start-style: solid; border-block-start-color: var(--line);}
.pm-foot .w {max-width: var(--w); margin-block: 0; margin-inline: auto; padding-block-start: 38px; padding-inline-end: 18px; padding-block-end: 30px; padding-inline-start: 18px;}
.pm-foot .cols {display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; row-gap: 28px; column-gap: 28px;}
.pm-foot .ab {min-width: 0;}
.pm-foot .ab p {font-size: var(--tk-fs7); color: var(--onbg2); margin-block-start: 13px; margin-inline-end: 0; margin-block-end: 0; margin-inline-start: 0;}
.pm-foot h4 {font-size: var(--tk-fs4); letter-spacing: .11em; text-transform: uppercase; color: var(--brass); margin-block-end: 12px;}
.pm-foot .cols div a {display: block; margin-block-end: 9px; font-size: var(--tk-fs7); color: var(--onbg);}
.pm-foot .pay, .pm-foot .trust {display: flex; flex-wrap: wrap; row-gap: 9px; column-gap: 9px; margin-block-start: 22px;}
.pm-foot .pay span, .pm-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: 8px;
  padding-inline: 12px;
  background: #efece2;
  border-width: 1px;
  border-style: solid;
  border-color: #cdc8bb;
  border-radius: 5px;
}
.pm-foot .pay img, .pm-foot .trust img {max-height: 21px; width: auto; min-width: 0;}
.pm-foot .rg {margin-block-start: 22px; margin-inline-end: 0; margin-block-end: 6px; margin-inline-start: 0; font-size: var(--tk-fs5); color: var(--onbg2);}
.pm-foot .cr {margin-block: 0; margin-inline: 0; font-size: var(--tk-fs5); color: var(--mut);}

/* ---------------------------------------------------------------- sticky cta */
.pm-scta {
  display: none;
  position: fixed;
  inset-block-start: auto;
  inset-inline-end: 0;
  inset-block-end: 0;
  inset-inline-start: 0;
  z-index: 40;
  padding-block: 10px;
  padding-inline: 13px;
  background: rgba(29, 11, 13, .96);
  border-block-start-width: 1px;
  border-block-start-style: solid;
  border-block-start-color: var(--brass-d);
}
.pm-scta .pm-btn {width: 100%;}

/* ---------------------------------------------------------------- entry modal */
.pm-pop {position: fixed; inset-block: 0; inset-inline: 0; z-index: 60; display: none; align-items: center; justify-items: center; padding-block: 18px; padding-inline: 18px; background: rgba(12, 5, 6, .8);}
.pm-pop.on {display: grid;}
.pm-pop .bx {
  position: relative;
  width: min(420px, 100%);
  max-height: 92vh;
  overflow-x: auto;
  overflow-y: auto;
  padding-block: 16px;
  padding-inline: 16px;
  background: var(--card);
  color: var(--ink);
  border-width: 1px;
  border-style: solid;
  border-color: var(--brass);
  border-radius: var(--r);
}
.pm-pop .x {
  position: absolute;
  inset-block-start: 10px;
  inset-inline-end: 10px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--card2);
  border-width: 1px;
  border-style: solid;
  border-color: var(--rule);
  color: var(--ink);
  font-size: var(--tk-fs13);
  line-height: 1;
  cursor: pointer;
}
.pm-pop .hd {margin-block-start: 2px; margin-inline-end: 44px; margin-block-end: 14px; margin-inline-start: 2px; font-size: var(--tk-fs5); font-weight: var(--tk-wt2); letter-spacing: .09em; text-transform: uppercase; color: var(--brass-d);}
.pm-pop .pane {display: block; text-align: center;}
.pm-pop .pane.pm-off {display: none !important;}
.pm-pop .pane .eb {color: var(--ink2);}
.pm-pop .pane .big {display: block; margin-block-start: 8px; margin-inline-end: 0; margin-block-end: 10px; margin-inline-start: 0; font-size: clamp(36px, 10vw, 52px); font-weight: var(--tk-wt3); color: var(--brass-d, #9a4a11);}
.pm-pop .pane p {color: var(--ink2); font-size: var(--tk-fs8);}
.pm-pop .pane .pm-btn {width: 100%;}
.pm-pop .pg {display: flex; align-items: center; justify-content: center; row-gap: 10px; column-gap: 10px; margin-block-start: 14px;}
.pm-pop .pv, .pm-pop .nx {width: 40px; height: 40px; border-radius: 50%; background: var(--card2); border-width: 1px; border-style: solid; border-color: var(--rule); color: var(--ink); font-size: var(--tk-fs12); cursor: pointer;}
.pm-pop .pv[disabled], .pm-pop .nx[disabled] {opacity: .35; cursor: default;}
.pm-pop .dots {display: flex; row-gap: 6px; column-gap: 6px;}
.pm-pop .dot {width: 22px; height: 22px; padding-block: 0; padding-inline: 0; border-width: 0; border-style: none; border-color: currentcolor; background: transparent; cursor: pointer;}
.pm-pop .dot::after {content: ""; display: block; width: 8px; height: 8px; margin-block: 0; margin-inline: auto; border-radius: 50%; background: var(--rule);}
.pm-pop .dot.on::after {background: var(--brass-d);}
.pm-pop .ct {font-size: var(--tk-fs4); color: var(--ink2); font-variant-numeric: tabular-nums;}

@media (prefers-reduced-motion: reduce) { * {transition-property: none !important; transition-duration: 0s !important; transition-timing-function: ease !important; transition-delay: 0s !important; animation-name: none !important; animation-duration: 0s !important; animation-timing-function: ease !important; animation-delay: 0s !important; animation-iteration-count: 1 !important; animation-direction: normal !important; animation-fill-mode: none !important; animation-play-state: running !important;} }

/* ---------------------------------------------------------------- responsive */
@media (max-width: 1060px) {
  .pm-cats {grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);}
  .pm-tiers .g {grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);}
  .pm-foot .cols {grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);}
}

@media (max-width: 880px) {
  body {padding-block-end: 110px;}   /* sticky bar is 78px and was covering the 18+ line */
  .pm-burger {display: block;}
  .pm-nav {display: none; order: 3; width: 100%; justify-content: flex-start;}
  .pm-open .pm-nav {display: flex; flex-direction: column; row-gap: 2px; column-gap: 2px;}
  .pm-open .pm-nav a {width: 100%;}
  .pm-head .bar {flex-wrap: wrap;}
  .pm-hero, .pm-wheel, .pm-ph {grid-template-columns: minmax(0, 1fr); row-gap: 24px; column-gap: 24px;}
  .pm-ph > img {order: -1; max-width: 420px; margin-block: 0; margin-inline: auto;}
  .pm-tier.pop {transform: none;}
  .pm-scta {display: block;}
}

@media (max-width: 620px) {
  .pm-logo .wm small {display: none;}
  .pm-tiers .g {grid-template-columns: minmax(0, 1fr);}
  .pm-tier .rib {position: static; transform: none; display: inline-block; margin-block-end: 8px;}
  .pm-cats {grid-template-columns: minmax(0, 1fr);}
  .pm-kpis {grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);}
  .pm-revs .g, .pm-wheel .pzs {grid-template-columns: minmax(0, 1fr);}
  .pm-band {flex-direction: column; align-items: flex-start;}
  .pm-band .pm-btn {width: 100%;}
  .pm-foot .cols {grid-template-columns: minmax(0, 1fr);}
  .act .pm-btn {width: 100%;}
}

.pm-pop .panes {min-width: 0;}