/* The platform page alone uses this layout. */
/* Navigation uses the same shared header styles as the homepage; platform-only pill overrides removed. */
.platform-v51 {--pl-purple:#ae28ed;--pl-ink:#24112f;--pl-yellow:#ffec48;}
.pl-main {color:var(--pl-ink);margin:0 auto;max-width:1720px;padding:14px clamp(12px,1.9vw,32px) 0;}
.pl-main [hidden] {display:none!important;}
.pl-main h1,.pl-main h2,.pl-main .pl-card strong,.pl-main .pl-qr strong {font-family:var(--display);font-weight:900;text-transform:uppercase;letter-spacing:-.025em;}
.pl-main h1 em,.pl-main h2 em {display:block;font-style:normal;}
.pl-hero {position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;min-height:clamp(580px,52vw,790px);border-radius:30px;padding:clamp(110px,8.8vw,147px) clamp(26px,4.2vw,70px) 32px;color:#fff;background:linear-gradient(137deg,#aa1adc 0%,#af28ee 44%,#cb67ef 76%,#f4b991);}
.pl-glow {position:absolute;inset:28% -9% -26% 38%;z-index:-1;background:radial-gradient(ellipse at 70% 84%,#ffdf59 0 24%,#f4b88f 43%,transparent 70%);}
.pl-copy {position:relative;z-index:2;max-width:54%;}
.pl-kicker,.pl-label {display:inline-flex;align-items:center;gap:9px;font:750 12px/1.35 var(--body);letter-spacing:.12em;text-transform:uppercase;}
.pl-kicker i,.pl-label i {display:inline-block;width:19px;height:3px;background:currentColor;}
.pl-kicker {color:#fff;}
.pl-hero h1 {margin:17px 0 18px;font-size:clamp(68px,7.8vw,134px);line-height:.90;}
.pl-hero h1 em {color:var(--pl-yellow);}
.pl-lede {max-width:420px;font-size:clamp(15px,1.27vw,21px);line-height:1.45;font-weight:650;}
.pl-jump {display:inline-flex;align-items:center;gap:14px;font-size:14px;font-weight:750;margin:20px 0 12px;border-bottom:1px solid #ffffff84;}
.pl-skater {position:absolute;z-index:0;right:-1%;bottom:-.5%;width:61%;height:96%;object-fit:contain;object-position:right bottom;pointer-events:none;}
.pl-hero::after {content:"";pointer-events:none;position:absolute;top:10%;right:3.4%;width:clamp(55px,7vw,112px);aspect-ratio:1;background:url("bolt.webp") center/contain no-repeat;transform:rotate(10deg);animation:pl-float 5s ease-in-out infinite;}
@keyframes pl-float {50%{transform:translateY(-7px) rotate(16deg);}}
.pl-hero-bottom {position:relative;z-index:2;display:grid;justify-items:start;gap:11px;margin-top:27px;}
.pl-qr {display:flex;align-items:center;gap:14px;padding:9px 21px 9px 9px;background:#672588d9;border:1px solid #ffffff80;border-radius:19px;box-shadow:0 5px 18px #5c21631a;}
.pl-qr img {width:68px;height:68px;border-radius:9px;}
.pl-qr small {display:block;font-size:12px;font-weight:650;}
.pl-qr strong {display:block;font-size:clamp(22px,2.2vw,36px);line-height:1.1;}
.pl-id {font-weight:650;font-size:13px;line-height:1.4;background:#70258e;color:white;padding:5px 10px;border-radius:7px;}
.pl-cards {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:20px 0 clamp(45px,6vw,90px);}
.pl-card {isolation:isolate;position:relative;display:flex;flex-direction:column;align-items:flex-start;overflow:hidden;min-height:205px;border-radius:24px;padding:24px;color:var(--pl-ink);transition:transform .18s ease;}
.pl-card:hover {transform:translateY(-3px);}
.pl-card small {font-weight:750;font-size:11px;letter-spacing:.11em;}
.pl-card strong {position:relative;width:80%;margin:14px 0 28px;font-size:clamp(29px,3.15vw,58px);line-height:.96;z-index:2;}
.pl-card-bottom {display:flex;align-items:center;justify-content:space-between;gap:12px;align-self:stretch;margin-top:auto;font-size:13px;font-weight:750;border-top:1px solid #24112f3a;padding-top:10px;}
.pl-card-bottom b {font-size:18px;}
.pl-card-icon {position:absolute;z-index:-1;right:7%;top:14%;font-family:var(--display);font-weight:900;font-size:80px;line-height:1;transform:rotate(7deg);}
.pl-card-0 {background:#f6df52;}
.pl-card-0 .pl-card-icon {background:url("phone.webp") no-repeat center/contain;color:transparent;width:23%;height:68%;right:3%;top:3%;transform:rotate(10deg);}
.pl-card-0 strong {max-width:71%;}
.pl-card-1 {background:#eedcfe;}
.pl-card-1 .pl-card-icon {color:#c79be3;right:7%;top:20%;font-size:86px;}
.pl-card-2 {background:#ffb3a2;}
.pl-card-2 .pl-card-icon {background:url("bolt.webp") center/contain no-repeat;width:24%;height:57%;color:transparent;right:2%;}
.pl-guide,.pl-about {width:min(1180px,96%);margin:0 auto clamp(48px,6vw,90px);}
.pl-guide-head,.pl-about {display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(24px,5vw,75px);align-items:end;}
.pl-guide-head p {max-width:370px;color:#64546d;font-size:16px;line-height:1.55;}
.pl-label {color:#7a369a;}
.pl-guide h2,.pl-about h2 {margin:13px 0 0;font-size:clamp(48px,5.8vw,85px);line-height:.95;}
.pl-guide h2 em,.pl-about h2 em {color:#8726b2;}
.pl-tabs {display:inline-flex;gap:5px;border-radius:30px;padding:5px;background:#efe5f6;margin:28px 0 12px;}
.pl-tabs button {border:0;padding:10px 18px;border-radius:24px;color:#3f2652;background:none;font:700 15px/1.3 var(--body);}
.pl-tabs button[aria-selected=true] {background:#361842;color:white;}
.pl-panel {display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;margin:12px 0;border-radius:24px;background:#f6f1fa;}
.pl-steps {padding:clamp(24px,3.3vw,50px);}
.pl-steps h3 {font-family:var(--display);font-size:clamp(30px,3vw,50px);font-weight:800;text-transform:uppercase;}
.pl-steps ol {list-style:none;margin:18px 0 15px;padding:0;}
.pl-steps li {display:flex;gap:12px;align-items:baseline;border-top:1px solid #dacde2;padding:10px 0;font-size:16px;line-height:1.5;}
.pl-steps li span {color:#752590;font:800 13px/1.4 var(--body);}
.pl-steps a {display:inline-flex;align-items:center;background:#321b3b;color:white;border-radius:11px;padding:9px 16px;min-height:44px;font-weight:700;}
.pl-device {display:grid;place-items:center;overflow:hidden;min-height:285px;padding:20px;background:radial-gradient(at 80% 85%,#ffdb97,transparent 58%),#c9a2ee;}
.pl-device img {width:142px;height:auto;transform:rotate(3deg);filter:drop-shadow(2px 8px 12px #381b4928);}
.pl-about {align-items:start;}
.pl-questions details {border-top:1px solid #dbd0e2;padding:0 0 1px;}
.pl-questions details:last-child {border-bottom:1px solid #dbd0e2;}
.pl-questions summary {display:flex;align-items:center;justify-content:space-between;gap:18px;cursor:pointer;list-style:none;font:750 clamp(18px,1.5vw,24px)/1.35 var(--body);padding:17px 0;}
.pl-questions summary::-webkit-details-marker {display:none;}
.pl-questions summary span {color:#8527aa;font-size:25px;transition:transform .18s;}
.pl-questions details[open] summary span {transform:rotate(45deg);}
.pl-questions details>div {padding:0 0 18px;font-size:15px;color:#5a4b62;}
.pl-questions p+p,.pl-questions .highlight {margin-top:10px;}
.pl-questions ul {padding-left:20px;}
.pl-questions .button {min-height:42px;margin-top:12px;}
.pl-questions a:not(.button) {text-decoration:underline;}
@media (min-width:761px) and (max-width:1000px) {
 .pl-card {padding:18px;}
}
@media (max-width:760px) {
 .pl-main {padding:7px 8px 0;}
 .pl-hero {min-height:0;display:grid;grid-template-columns:1fr;padding:86px 19px 0;border-radius:21px;}
 .pl-copy {max-width:none;}
 .pl-hero h1 {font-size:clamp(51px,11.8vw,82px);line-height:.93;margin:12px 0;}
 .pl-kicker,.pl-label {font-size:10px;}
 .pl-lede {max-width:365px;font-size:15px;}
 .pl-jump {margin:13px 0 4px;}
 .pl-hero-bottom {grid-row:2;gap:8px;margin:8px 0 0;}
 .pl-qr {padding:8px 14px;border-radius:11px;gap:0;}
 .pl-qr img,.pl-qr small {display:none;}
 .pl-qr strong {font:700 14px/1.5 var(--body);text-transform:none;letter-spacing:0;}
 .pl-id {font-size:11px;padding:4px 7px;}
 .pl-skater {position:relative;grid-row:3;width:min(calc(100% + 38px),525px);max-width:none;height:auto;justify-self:end;right:-19px;bottom:-3px;margin:0 0 -6%;object-fit:contain;}
 .pl-glow {inset:40% -10% -5% 3%;}
 .pl-hero::after {top:auto;bottom:35%;right:6%;width:48px;}
 .pl-cards {gap:8px;grid-template-columns:1fr;margin:12px 0 42px;}
 .pl-card {min-height:112px;padding:15px 18px;border-radius:16px;}
 .pl-card small {font-size:10px;}
 .pl-card strong {width:78%;font-size:35px;margin:6px 0 8px;}
 .pl-card-bottom {align-self:flex-start;border:none;padding:0;gap:10px;font-size:12px;}
 .pl-card-bottom b {font-size:13px;}
 .pl-card-icon,.pl-card-1 .pl-card-icon {right:5%;top:10%;font-size:66px;}
 .pl-card-0 .pl-card-icon,.pl-card-2 .pl-card-icon {height:78%;top:9%;}
 .pl-guide,.pl-about {width:calc(100% - 20px);}
 .pl-guide-head,.pl-about {grid-template-columns:1fr;gap:16px;}
 .pl-guide h2,.pl-about h2 {font-size:clamp(41px,10vw,63px);}
 .pl-guide-head p {font-size:14px;}
 .pl-panel {grid-template-columns:1fr;}
 .pl-device {min-height:180px;height:210px;align-items:start;padding-top:16px;}
 .pl-device img {width:126px;}
 .pl-steps li {font-size:15px;}
 .pl-tabs {margin-top:16px;}
}
@media (prefers-reduced-motion:reduce) {
 .platform-v51 * {scroll-behavior:auto!important;}
 .pl-hero::after {animation:none;}
 .pl-card,.pl-questions summary span {transition:none;}
}
@media (min-width:761px) {
 html:lang(en) .pl-hero h1,html:lang(vi) .pl-hero h1 {font-size:clamp(63px,7vw,118px);}
}

/* Keep the Platform mobile action legible inside the shared homepage-style menu. */
.platform-v51 .mobile-nav .pl-mobile-cta {width:max-content;border-radius:10px;background:white;color:#4c155d;padding:9px 18px;margin-top:6px;}


/* V56: position the Platform introduction neatly near the hero bottom.
   This stylesheet is loaded by the Platform pages only. */
@media (min-width: 761px) {
  .pl-hero > .pl-lede {
    position: absolute;
    z-index: 2;
    left: clamp(26px, 4.2vw, 70px);
    bottom: clamp(34px, 4.2vw, 62px);
    margin: 0;
    max-width: min(425px, 41%);
    padding: 1px 0 1px 16px;
    border-left: 4px solid var(--pl-yellow);
    font-size: clamp(16px, 1.2vw, 18px);
    line-height: 1.52;
    font-weight: 650;
    text-wrap: pretty;
    text-shadow: 0 2px 9px rgba(44, 13, 58, .16);
  }
}
@media (max-width: 760px) {
  .pl-hero > .pl-lede {
    position: relative;
    z-index: 2;
    grid-row: 2;
    margin: 17px 0 13px;
    max-width: 35ch;
    padding: 1px 0 1px 12px;
    border-left: 3px solid var(--pl-yellow);
    font-size: clamp(14px, 3.8vw, 16px);
    line-height: 1.52;
    font-weight: 650;
    text-wrap: pretty;
  }
}


/* V57 — only the Platform pages use these responsive feature cards.
   Homepage CSS, homepage HTML, redirect rules and SEO files are unchanged. */
.pl-promo-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1.22vw,20px);margin:20px 0 0;}
.pl-promo-card {position:relative;isolation:isolate;overflow:hidden;aspect-ratio:.945;min-width:0;border-radius:clamp(18px,2vw,30px);text-align:center;}
.pl-promo-card p {margin:0;}
.pl-promo-card--gain {background:linear-gradient(153deg,#ededed 0%,#f3f3f3 36%,#f4f4f4 100%);}
.pl-promo-card--allinone {background:#59006e;color:#fff;}
.pl-promo-card--deposit {background:#ff4656;color:#fff;}
.pl-promo-overline {position:relative;z-index:2;padding:clamp(16px,2.05vw,33px) 12px 0;font:800 clamp(10px,1.18vw,17px)/1.2 var(--body);letter-spacing:-.02em;}
.pl-promo-card--gain .pl-promo-overline {color:#17121a;}
.pl-promo-card--allinone .pl-promo-overline {color:#fff;}
.pl-promo-number,.pl-promo-bigtext,.pl-promo-depositline {position:relative;z-index:1;font-family:var(--display);font-weight:900;letter-spacing:-.035em;text-transform:uppercase;}
.pl-promo-number {margin-top:clamp(5px,.6vw,9px)!important;font-size:clamp(88px,12.1vw,188px);line-height:.98;letter-spacing:-.055em;color:#ff4656;white-space:nowrap;}
.pl-promo-bigtext {margin-top:clamp(8px,1vw,20px)!important;font-size:clamp(35px,5.1vw,83px);line-height:.9;color:#ffdc25;white-space:nowrap;letter-spacing:-.045em;}
.pl-promo-depositline {display:grid;justify-items:center;gap:0;padding:clamp(13px,2vw,29px) 6px 0;font-size:clamp(29px,4.25vw,68px);line-height:.95;letter-spacing:-.035em;}
.pl-promo-depositline span {display:block;white-space:nowrap;}
.pl-promo-depositline span:first-child,.pl-promo-depositline b {color:#ffde25;}
.pl-promo-depositline b {font-weight:900;}
.pl-promo-art {position:absolute;z-index:0;height:auto;max-width:none;pointer-events:none;user-select:none;filter:none;}
.pl-promo-art--bull {width:114%;left:-6%;bottom:-27%;}
.pl-promo-art--phone {width:73%;left:50%;bottom:-35%;transform:translateX(-50%);}
.pl-promo-art--coin {width:118%;right:-9%;bottom:-83%;}
.pl-promo-fineprint {position:absolute!important;z-index:2;bottom:5.8%;left:13%;right:13%;font:800 clamp(9px,.96vw,13px)/1.2 var(--body);text-align:center;text-transform:uppercase;color:white;text-shadow:0 1px 3px #704f3333;}
.pl-promo-notice {margin:10px 0 clamp(45px,6vw,90px);padding:0 8px;font:500 clamp(10px,.85vw,12px)/1.5 var(--body);color:#736b79;text-align:center;}
@media (min-width:761px) and (max-width:1000px) {
  .pl-promo-overline {font-size:10px;}
  .pl-promo-bigtext {font-size:clamp(33px,5vw,51px);}
  .pl-promo-depositline {font-size:clamp(29px,4.15vw,43px);}
  .pl-promo-fineprint {font-size:9px;}
}
@media (max-width:760px) {
  .pl-promo-grid {grid-template-columns:1fr;gap:12px;margin:12px 0 0;}
  .pl-promo-card {aspect-ratio:1.015;border-radius:24px;}
  .pl-promo-overline {padding-top:24px;font-size:clamp(13px,3.5vw,18px);}
  .pl-promo-number {font-size:clamp(112px,36vw,180px);margin-top:7px!important;}
  .pl-promo-bigtext {font-size:clamp(53px,17vw,87px);margin-top:12px!important;}
  .pl-promo-depositline {font-size:clamp(39px,12.3vw,65px);padding-top:26px;}
  .pl-promo-art--bull {width:112%;left:-5%;bottom:-28%;}
  .pl-promo-art--phone {width:70%;bottom:-34%;}
  .pl-promo-art--coin {width:116%;right:-8%;bottom:-86%;}
  .pl-promo-fineprint {font-size:clamp(10px,2.5vw,12px);bottom:5%;}
  .pl-promo-notice {margin:11px 0 46px;font-size:11px;}
}
@media (max-width:350px) {
  .pl-promo-card {border-radius:18px;}
  .pl-promo-overline {font-size:11px;padding-top:18px;}
  .pl-promo-number {font-size:34vw;}
  .pl-promo-bigtext {font-size:16.2vw;}
  .pl-promo-depositline {font-size:11.4vw;padding-top:19px;}
}
/* Local image fallback for CDN outages: based on the supplied visual reference. */
.pl-promo-card.pl-promo-fallback {background-position:center;background-size:cover;background-repeat:no-repeat;}
.pl-promo-card--gain.pl-promo-fallback {background-image:url("/assets/platform-v57/card-gain.webp");}
.pl-promo-card--allinone.pl-promo-fallback {background-image:url("/assets/platform-v57/card-allinone.webp");}
.pl-promo-card--deposit.pl-promo-fallback {background-image:url("/assets/platform-v57/card-deposit.webp");}
.pl-promo-card.pl-promo-fallback .pl-promo-overline,
.pl-promo-card.pl-promo-fallback .pl-promo-number,
.pl-promo-card.pl-promo-fallback .pl-promo-bigtext,
.pl-promo-card.pl-promo-fallback .pl-promo-depositline,
.pl-promo-card.pl-promo-fallback .pl-promo-fineprint {visibility:hidden;}


/* V58: only the Indonesian Platform reference-card section uses these rules.
   Each local panel preserves the exact composition of the user-supplied reference.
   Natural image dimensions prevent text, artwork, and rounded corners from cropping.
   Homepage files, shared styles, and the existing EN/VI cards are untouched. */
.platform-v51 .pl-promo-grid--reference {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(10px, 1.22vw, 20px);
  align-items: start;
}
.platform-v51 .pl-promo-grid--reference .pl-reference-card {
  display: block;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}
.platform-v51 .pl-promo-grid--reference .pl-reference-card > img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 631 / 668;
  object-fit: contain;
  border: 0;
}
@media (max-width: 760px) {
  .platform-v51 .pl-promo-grid--reference {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }
}