:root {
    --gold:#f5c54a;
    --gold-light:#ffe28c;
    --red:#d44332;
    --wine:#210000;
    --ink:#030303;
}
* {
    box-sizing:border-box;
}
html {
    max-width:100%;
    overflow-x:clip;
    scroll-behavior:smooth;
    scroll-padding-top:112px;
}
body {
    max-width:100%;
    margin:0;
    color:#fff;
    body {
        background:#000 url('../assets/images/Elements/1920x1276_PM8-VIP%20Background.webp') top center/cover fixed no-repeat;
    }
    font:15px/1.55 Roboto,Arial,sans-serif;
    overflow-x:clip;
}
a {
    color:inherit;
    text-decoration:none;
}
.site-header {
    background:linear-gradient(90deg,#b70900 0%,#ff4d49 100%);
    border-bottom:0;
}
.header-inner {
    min-height:106px;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:20px;
}
.brand {
    display:block;
    line-height:0;
}
.brand img {
    width:231px;
    height:auto;
    display:block;
}
.hero {
    background:#490500;
}
.hero picture {
    display:block;
}
.hero img {
    width:100%;
    min-height:190px;
    height:auto;
    max-height:none;
    object-fit:cover;
    object-position:center;
    display:block;
}
.mobile-menu-bar {
    display:none;
}
.menu-toggle {
    display:none;
}
.section-nav {
    position:sticky;
    top:0;
    z-index:20;
    background:#861b16;
    box-shadow:0 3px 12px rgba(0,0,0,.4);
}
.section-nav .container {
    display:flex;
}
.section-nav a {
    flex:1;
    min-height:100px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:13px;
    padding:16px 15px;
    color:#F2D378;
    border-right:2px solid #F2D378;
    font:700 16px Montserrat,sans-serif;
    text-transform:uppercase;
    text-align:center;
    transition:.2s ease;
    white-space:nowrap;
}
.section-nav a:first-child {
    border-left:0;
}
.section-nav a:last-child {
    border-right:0;
}
.section-nav a.active {
    color:#fff;
    background:#b52d1e;
}
.section-nav a:hover,.section-nav a:focus-visible {
    color:#fff;
}
.section-nav .nav-icon {
    width:30px;
    height:28px;
    position:relative;
    flex:0 0 auto;
}
.section-nav .nav-icon img {
    width:100%;
    height:100%;
    object-fit:contain;
    transition:opacity .2s ease;
}
.section-nav .nav-icon-highlight {
    position:absolute;
    inset:0;
    opacity:0;
}
.section-nav a:hover .nav-icon-default,.section-nav a:focus-visible .nav-icon-default,.section-nav a.active .nav-icon-default {
    opacity:0;
}
.section-nav a:hover .nav-icon-highlight,.section-nav a:focus-visible .nav-icon-highlight,.section-nav a.active .nav-icon-highlight {
    opacity:1;
}
.page-body {
    --page-top-space:66px;
    position:relative;
    overflow-x:clip;
    padding:var(--page-top-space) 0 24px;
    background:transparent;
}
.content {
    max-width:1660px;
}
#program {
    margin-top:calc(var(--page-top-space) * -1);
    padding-top:var(--page-top-space);
}
.title-plaque {
    width:min(1123px,100%);
    min-height:145px;
    margin:0 auto 42px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:18px;
    padding:20px 38px;
    border:0;
    border-radius:0;
    color:#e45747;
    background:transparent url('../assets/images/Header%20%26%20Menu%20Icons/Header/Header%20Box.png') center/100% 100% no-repeat;
    box-shadow:none;
    font:800 38px Montserrat,sans-serif;
    text-align:center;
    text-transform:uppercase;
}
.title-plaque .symbol {
    color:#ffdd71;
    font-size:45px;
    line-height:1;
}
.plaque-icon {
    width:55px;
    max-height:52px;
    object-fit:contain;
}
.intro {
    position:relative;
    padding:0 390px 8px 0;
}
.intro p {
    margin:0 0 12px;
    color:#f2eeee;
}
.intro-list {
    width:100%;
    margin:28px 0 18px;
    padding-left:29px;
    list-style-type:lower-alpha;
}
.intro-list li {
    margin:0 0 20px;
    padding-left:5px;
    color:#fff;
    font:600 21px/1.42 Montserrat,sans-serif;
}
.intro-list li::marker {
    color:#fff;
}
.corner-element {
    position:absolute;
    width:445px;
    right:-123px;
    top:195px;
    pointer-events:none;
    filter:drop-shadow(0 8px 11px #000);
}
.fine-print {
    font-size:15px;
    color:#efefef;
}
.section-block {
    margin-top:68px;
}
.section-note {
    max-width:1100px;
    margin:0 auto 25px;
    color:#f4f0ef;
    font-size:15px;
    text-align:center;
}
.rank-scroll {
    width:100%;
    max-width:1217px;
    margin:auto;
}
.rank-panel {
    position:relative;
    width:100%;
    aspect-ratio:1217 / 659;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent url('../assets/images/VIP%20Tables/PROGRAM%20VIP-TABLE/PNG/table1.png') center/100% 100% no-repeat;
    box-shadow:none;
}
.exact-table {
    display:block;
    width:100%;
    height:auto;
}
.rank-grid {
    position:absolute;
    inset:12% 6% 12%;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:1%;
}
.rank-card {
    position:relative;
    min-width:0;
    overflow:hidden;
    background:transparent;
}
.rank-card img {
    width:100%;
    height:100%;
    display:block;
    object-fit:fill;
}
.rank-card p {
    position:absolute;
    right:4%;
    bottom:15%;
    left:4%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:.1em;
    margin:0;
    color:#ffe98c;
    font-size:clamp(12px,1.65vw,21px);
    line-height:1.45;
    text-align:center;
    white-space:normal;
}
.rank-card p span {
    display:block;
    max-width:100%;
}
.rank-card strong {
    color:#fff;
    font-weight:700;
}
.requirements {
    max-width:1600px;
    margin:24px auto 0;
    color:#e9e6e6;
    font-size:15px;
}
.benefit-table {
    width:100%;
    max-width:1638px;
    margin:auto;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    overflow:visible;
}
.benefit-board {
    position:relative;
    width:100%;
    aspect-ratio:1638 / 809;
    background:transparent url('../assets/images/VIP%20Tables/KEUNTUNGAN%20MEMBER%20VIP-table/PNG/table2.png') center/100% 100% no-repeat;
}
.benefit-headers {
    position:absolute;
    top:5.8%;
    right:4%;
    left:12.5%;
    height:5%;
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    align-items:center;
    color:#fff;
    font:700 clamp(5px,1vw,16px)/1.12 Roboto,Arial,sans-serif;
    text-align:center;
}
.benefit-rows {
    position:absolute;
    top:12.2%;
    right:4%;
    bottom:5.4%;
    left:4%;
    display:grid;
    grid-template-rows:1fr 1fr .84fr 1fr 1fr 1fr;
    gap:1.3%;
}
.benefit-row {
    display:grid;
    grid-template-columns:8.5% 91.5%;
    min-width:0;
}
.benefit-rank {
    position:relative;
    min-width:0;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:5%;
    overflow:visible;
}
.benefit-rank > img:first-child {
    width:auto;
    height:88%;
    max-width:70%;
    object-fit:contain;
    transform:translateX(clamp(-12px,-1vw,-8px));
}
.benefit-rank-title {
    position:absolute;
    top:50%;
    right:-2px;
    left:auto;
    transform:translateY(-50%) rotate(180deg);
    color:#f5f5f5;
    font:800 clamp(8px,.78vw,16px)/1 Montserrat,sans-serif;
    letter-spacing:-.3px;
    text-shadow:0 2px 1px rgba(0,0,0,.58);
    text-transform:uppercase;
    white-space:nowrap;
    writing-mode:vertical-rl;
    text-orientation:mixed;
}
.benefit-rank-title.rank-bronze {
    color:#bd8247;
}
.benefit-rank-title.rank-silver {
    color:#f4f4f4;
}
.benefit-rank-title.rank-gold {
    color:#f3b126;
}
.benefit-rank-title.rank-platinum,.benefit-rank-title.rank-diamond {
    color:#f5f5f5;
}
.benefit-data {
    min-width:0;
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    align-items:center;
    background-position:center;
    background-size:100% 100%;
    background-repeat:no-repeat;
}
.light-row .benefit-data {
    background-image:url('../assets/images/VIP%20Tables/KEUNTUNGAN%20MEMBER%20VIP-table/PNG/Rectangle%2014.png');
}
.dark-row .benefit-data {
    background-image:url('../assets/images/VIP%20Tables/KEUNTUNGAN%20MEMBER%20VIP-table/PNG/Rectangle%2015.png');
}
.benefit-data > span {
    min-width:0;
    height:55%;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 3%;
    border-left:0;
    color:#fff;
    font:700 clamp(4px,.9vw,14px)/1 Roboto,Arial,sans-serif;
    text-align:center;
    white-space:nowrap;
}
.benefit-data > span:first-child {
    border-left:0;
}
/* PlayMe8 asset set and gold-on-black VIP treatment */ body {
    background:#000 url('../assets/images/Elements/1920x1276_PM8-VIP%20Background.webp') top center/cover fixed no-repeat;
}
.site-header {
    background:#f4c13d;
}
.header-inner {
    min-height:86px;
    justify-content:center;
}
.brand img {
    width:200px;
}
.hero {
    border-top:3px solid #b87911;
}
.section-nav {
    background:#000;
    border-bottom:1px solid #b88720;
}
.section-nav a {
    min-height:92px;
    color:#f4c13d;
    border-color:#9e761b;
}
.section-nav a.active,.section-nav a:hover,.section-nav a:focus-visible {
    color:#080808;
    background:#f3c03c;
}
.section-nav a.active .nav-icon-default,.section-nav a:hover .nav-icon-default,.section-nav a:focus-visible .nav-icon-default {
    opacity:1;
}
.section-nav a.active .nav-icon-highlight,.section-nav a:hover .nav-icon-highlight,.section-nav a:focus-visible .nav-icon-highlight {
    opacity:0;
}
.title-plaque {
    min-height:132px;
    color:#050505;
    background:transparent url('../assets/images/menu-header/default/Title%20Asset.png') center/100% 100% no-repeat;
    font-size:clamp(24px,3.2vw,44px);
}
.plaque-icon {
    width:50px;
    max-height:48px;
}
.intro p,.terms li,.promise li {
    color:#f2f0e8;
}
.section-note {
    color:#f2f0e8;
}
.rank-panel {
    aspect-ratio:auto;
    padding:18px;
    background:linear-gradient(145deg,#1d1609,#4d3b12 52%,#1d1609);
    border:3px solid #d49d24;
    border-radius:20px;
    box-shadow:0 0 0 3px #080808 inset,0 10px 24px rgba(0,0,0,.55);
}
.rank-grid {
    position:static;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
}
.rank-card {
    min-height:190px;
    padding:12px 8px;
    border:1px solid rgba(255,218,118,.52);
    border-radius:8px;
    background:linear-gradient(145deg,rgba(93,65,18,.85),rgba(21,18,10,.92));
}
.rank-card img {
    width:76px;
    height:76px;
    margin:0 auto;
    object-fit:contain;
}
.rank-card p {
    position:static;
    gap:2px;
    margin:8px 0 0;
    font-size:clamp(10px,1.3vw,15px);
}
.benefit-board {
    aspect-ratio:auto;
    padding:18px;
    background:linear-gradient(145deg,#5a4818,#b39137 50%,#564415);
    border:3px solid #9b7a20;
    border-radius:16px;
}
.benefit-headers,.benefit-rows {
    position:static;
}
.benefit-headers {
    display:grid;
    grid-template-columns:repeat(7,minmax(74px,1fr));
    margin-left:104px;
    height:auto;
    padding:10px 0;
    color:#1a1204;
    font-size:clamp(7px,.92vw,14px);
    background:rgba(255,238,166,.65);
}
.benefit-rows {
    display:grid;
    grid-template-rows:none;
    gap:3px;
}
.benefit-row {
    grid-template-columns:104px minmax(0,1fr);
    min-height:58px;
}
.benefit-rank {
    background:rgba(25,19,7,.75);
}
.benefit-rank > img:first-child {
    height:54px;
    max-width:58px;
    transform:none;
}
.benefit-rank-title {
    position:static;
    transform:none;
    writing-mode:initial;
    font-size:11px;
}
.benefit-data {
    background:#2b2412!important;
    grid-template-columns:repeat(7,minmax(74px,1fr));
    border:1px solid rgba(255,225,133,.32);
}
.light-row .benefit-data {
    background:#4a3d1c!important;
}
.benefit-data > span {
    height:auto;
    min-height:54px;
    border-right:1px solid rgba(255,225,133,.25);
    font-size:clamp(7px,.85vw,13px);
    white-space:normal;
}
.benefit-notice {
    width:auto;
    margin:0;
    padding:10px 14px;
    background:#5d201a;
    font-size:clamp(8px,.75vw,12px);
}
.benefit-data img {
    display:none;
}
.benefit-data span:has(img)::after {
    content:'✓';
    color:#f4c13d;
    font-size:20px;
}
.help-bar {
    background:#f4c13d;
}
.help-inner {
    color:#151006;
}
.chat-link {
    color:#f4c13d;
    background:#111;
    clip-path:none;
}
.chat-link img {
    display:none;
}
.site-footer {
    background:#030303;
}
@media (max-width:767.98px) {
    body {
        background-attachment:scroll;
    }
    .site-header {
        background:#f4c13d;
    }
    .header-inner {
        min-height:56px;
        justify-content:flex-start;
    }
    .brand img {
        width:125px;
    }
    .mobile-menu-bar {
        background:#080808;
        border-color:#7d5c18;
    }
    .menu-toggle {
        border-color:#f4c13d;
        background:#17120a;
    }
    .section-nav {
        background:#080808;
    }
    .section-nav a.active {
        background:#f3c03c;
    }
    .title-plaque {
        min-height:56px;
        margin-bottom:20px;
        font-size:16px;
        background-image:url('../assets/images/menu-header/default/Title%20Asset.png');
    }
    .plaque-icon {
        width:22px;
        max-height:22px;
    }
    .corner-element {
        width:190px;
        right:-58px;
        top:280px;
        opacity:.8;
    }
    .rank-panel {
        padding:8px;
        border-width:2px;
        border-radius:12px;
    }
    .rank-grid {
        grid-template-columns:repeat(2,1fr);
        gap:5px;
    }
    .rank-card {
        min-height:130px;
        padding:8px 4px;
    }
    .rank-card img {
        width:55px;
        height:55px;
    }
    .rank-card p {
        font-size:9px;
    }
    .benefit-table {
        display:none;
    }
    .mobile-benefit-table {
        display:grid;
        gap:12px;
    }
    .mobile-benefit-section {
        border:2px solid #b88a20;
        border-radius:10px;
        overflow:hidden;
        background:#251e0d;
    }
    .mobile-benefit-section h3 {
        margin:0;
        padding:9px;
        color:#151006;
        background:#e7bd48;
        font:800 12px Montserrat,sans-serif;
        text-align:center;
    }
    .mobile-benefit-head,.mobile-benefit-row {
        display:grid;
        grid-template-columns:1fr 1fr;
        align-items:center;
    }
    .mobile-benefit-head {
        color:#f9e6a5;
        background:#120f08;
        font:700 10px Roboto,sans-serif;
        text-align:center;
    }
    .mobile-benefit-head span {
        padding:7px 5px;
    }
    .mobile-benefit-row {
        min-height:43px;
        border-top:1px solid rgba(245,205,111,.3);
    }
    .mobile-benefit-row > span {
        display:flex;
        align-items:center;
        gap:8px;
        padding-left:9px;
    }
    .mobile-benefit-row > span > img:first-child {
        width:32px;
        height:32px;
        object-fit:contain;
    }
    .mobile-benefit-rank-title {
        font:700 11px Roboto,sans-serif;
    }
    .mobile-benefit-row strong {
        color:#f8e7ac;
        font-size:11px;
        text-align:center;
    }
    .mobile-benefit-notice {
        margin:0;
        padding:9px;
        color:#fff;
        background:#55201a;
        font-size:10px;
        line-height:1.35;
    }
}
.light-row .benefit-data > span:not(:last-child) {
    background:transparent url('../assets/images/VIP%20Tables/KEUNTUNGAN%20MEMBER%20VIP-table/PNG/line%20separator2.png') right center/auto 180% no-repeat;
}
.dark-row .benefit-data > span:not(:last-child) {
    background:transparent url('../assets/images/VIP%20Tables/KEUNTUNGAN%20MEMBER%20VIP-table/PNG/line%20separator1.png') right center/auto 100% no-repeat;
}
.benefit-data img {
    width:clamp(8px,1.5vw,25px);
    height:auto;
    object-fit:contain;
}
.benefit-notice {
    position:relative;
    z-index:2;
    width:110.7%;
    margin-left:-5.35%;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:2% 5%;
    color:#fff;
    background:transparent url('../assets/images/VIP%20Tables/KEUNTUNGAN%20MEMBER%20VIP-table/PNG/red%20column.png') center/100% 100% no-repeat;
    font:italic 700 clamp(4px,.75vw,13px)/1.35 Roboto,Arial,sans-serif;
    text-align:center;
}
.mobile-benefit-table {
    display:none;
}
.terms {
    margin-top:80px;
}
.terms h3,.promise h3 {
    margin:0 0 25px;
    color:#f3d266;
    font:800 18px Montserrat,sans-serif;
    text-transform:uppercase;
}
.terms p,.promise p {
    margin:0 0 15px;
    color:#f4eeee;
    text-align:justify;
    font-size:15px;
}
.terms ol,.promise ol {
    margin:0;
    padding-left:18px;
}
.terms li,.promise li {
    margin-bottom:13px;
    padding-left:3px;
    color:#f4eeee;
    text-align:justify;
    font-size:15px;
}
.terms li::marker,.promise li::marker {
    color:#fff;
    font-weight:bold;
}
.promise {
    position:relative;
    margin-top:45px;
    padding:38px 420px 20px 0;
}
.promise h3 {
    color:#f0bd3f;
}
.promise-element {
    position:absolute;
    width:460px;
    right:-76px;
    bottom:-18px;
    pointer-events:none;
    filter:drop-shadow(0 8px 10px #000);
}
.help-bar {
    background:#991b14;
}
.help-inner {
    position:relative;
    width:100%;
    max-width:none;
    min-height:82px;
    padding:0!important;
    display:block;
    color:#ffdf91;
    font:700 15px Montserrat,sans-serif;
}
.help-inner > span {
    width:63%;
    min-height:82px;
    padding:0 35px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
}
.chat-link {
    position:absolute;
    top:0;
    left:63%;
    width:20%;
    min-width:0;
    min-height:82px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    color:#303030;
    background:#f2c545;
    clip-path:polygon(12% 0,100% 0,88% 100%,0 100%);
    font:800 19px Montserrat,sans-serif;
}
.chat-link img {
    width:38px;
}
.site-footer {
    padding:20px 0 24px;
    background:#3a3a3a;
    border-top:1px solid rgba(255,255,255,.15);
}
.footer-inner {
    min-height:104px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:40px;
    align-items:start;
}
.footer-group {
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:16px;
}
.footer-group:first-child {
    align-items:flex-start;
}
.footer-group:last-child {
    align-items:flex-end;
}
.footer-group:first-child .footer-title {
    margin-left:20px;
}
.footer-group:last-child .footer-title {
    margin-right:20px;
}
.footer-title {
    width:min(100%,330px);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    color:#ddd;
    font:700 14px Roboto,Arial,sans-serif;
    white-space:nowrap;
}
.footer-title span {
    width:42px;
    height:1px;
    background:#777;
}
.footer-logo {
    display:block;
    height:auto;
    object-fit:contain;
}
.footer-logo-left {
    width:255px;
    max-width:100%;
}
.footer-logo-right {
    width:500px;
    max-width:100%;
}
.reveal-on-scroll {
    opacity:0;
    transform:translate3d(0,44px,0);
    filter:blur(6px);
    transition:opacity .72s cubic-bezier(.22,1,.36,1),transform .78s cubic-bezier(.22,1,.36,1),filter .62s ease;
    transition-delay:var(--reveal-delay,0ms);
    will-change:opacity,transform,filter;
}
.reveal-on-scroll.reveal-from-left {
    transform:translate3d(-46px,0,0);
}
.reveal-on-scroll.reveal-from-right {
    transform:translate3d(46px,0,0);
}
.reveal-on-scroll.reveal-zoom {
    transform:translate3d(0,30px,0) scale(.965);
}
.reveal-on-scroll.reveal-image-entrance {
    opacity:0;
    transform:translate3d(0,82px,0) scale(.72) rotate(3deg);
    filter:blur(7px);
    transition:opacity .58s ease,transform .82s cubic-bezier(.22,1,.36,1),filter .55s ease;
}
.reveal-on-scroll.is-revealed {
    opacity:1;
    transform:none;
    filter:none;
    will-change:auto;
}
.rank-card-motion {
    opacity:0;
    transform:translate3d(-64px,0,0) rotate(-1.5deg);
    transition:opacity .46s ease,transform .62s cubic-bezier(.22,1,.36,1);
    transition-delay:var(--rank-delay,0ms);
    will-change:opacity,transform;
}
.rank-scroll.is-revealed .rank-card-motion {
    opacity:1;
    transform:none;
    will-change:auto;
}
.benefit-header-motion,.benefit-data-motion,.benefit-rank-motion,.benefit-notice-motion {
    opacity:0;
    will-change:opacity,transform;
}
.benefit-header-motion {
    transform:translate3d(0,-18px,0);
    transition:opacity .38s ease,transform .52s cubic-bezier(.22,1,.36,1);
    transition-delay:var(--benefit-header-delay,0ms);
}
.benefit-data-motion {
    transform:translate3d(62px,0,0);
    transition:opacity .42s ease,transform .6s cubic-bezier(.22,1,.36,1);
    transition-delay:var(--benefit-data-delay,0ms);
}
.benefit-rank-motion {
    transform:translate3d(-30px,0,0) scale(.82);
    transition:opacity .4s ease,transform .56s cubic-bezier(.22,1,.36,1);
    transition-delay:var(--benefit-rank-delay,0ms);
}
.benefit-notice-motion {
    transform:translate3d(0,18px,0);
    transition:opacity .42s ease,transform .56s cubic-bezier(.22,1,.36,1);
    transition-delay:var(--benefit-notice-delay,0ms);
}
.benefit-table.is-revealed .benefit-header-motion,.benefit-table.is-revealed .benefit-data-motion,.benefit-table.is-revealed .benefit-rank-motion,.benefit-table.is-revealed .benefit-notice-motion {
    opacity:1;
    transform:none;
    will-change:auto;
}
@media (prefers-reduced-motion:reduce) {
    .reveal-on-scroll,.rank-card-motion,.benefit-header-motion,.benefit-data-motion,.benefit-rank-motion,.benefit-notice-motion {
        opacity:1;
        transform:none;
        filter:none;
        transition:none;
    }
    .mobile-benefit-section.is-revealed .mobile-benefit-head,.mobile-benefit-section.is-revealed .mobile-benefit-row,.mobile-benefit-section.is-revealed .mobile-benefit-notice {
        animation:none;
    }
}
@media (min-width:768px) and (max-width:1199.98px) {
    .content {
        padding-right:28px!important;
        padding-left:28px!important;
    }
    .section-nav a {
        min-height:76px;
        gap:9px;
        padding:12px 8px;
        font-size:clamp(11px,1.6vw,15px);
        white-space:normal;
    }
    .section-nav .nav-icon {
        width:24px;
        height:23px;
    }
    .page-body {
        --page-top-space:45px;
    }
    .title-plaque {
        min-height:clamp(82px,12vw,125px);
        margin-bottom:30px;
        padding:14px 28px;
        font-size:clamp(24px,3.1vw,35px);
    }
    .plaque-icon {
        width:clamp(36px,4.5vw,48px);
        max-height:45px;
    }
    .corner-element {
        width:300px;
        right:-85px;
        top:180px;
    }
    .intro {
        padding-right:245px;
    }
    .intro-list li {
        font-size:clamp(16px,2vw,19px);
    }
    .rank-card p {
        font-size:clamp(12px,1.65vw,18px);
    }
    .promise {
        padding-right:285px;
    }
    .promise-element {
        width:330px;
        right:-85px;
    }
}
@media (min-width:768px) and (max-width:991.98px) {
    .terms p,.promise p,.terms li,.promise li {
        text-align:left;
    }
    .promise {
        padding-right:0;
    }
    .promise-element {
        position:static;
        display:block;
        width:290px;
        margin:18px 0 0 auto;
    }
    .help-inner {
        min-height:62px;
        font-size:12px;
    }
    .help-inner > span {
        width:59%;
        min-height:62px;
        padding:0 20px;
    }
    .chat-link {
        left:59%;
        width:33%;
        min-height:62px;
        gap:5px;
        font-size:14px;
    }
    .chat-link img {
        width:25px;
    }
}
@media (max-width:767.98px) {
    body {
        font-size:14px;
    }
    .site-header {
        background:linear-gradient(90deg,#b70900 0%,#ff4d49 100%);
        border-bottom:0;
    }
    .header-inner {
        min-height:58px;
        padding-left:12px!important;
        padding-right:12px!important;
    }
    .brand img {
        width:145px;
    }
    .hero img {
        width:100%;
        min-height:0;
        max-height:none;
        height:auto;
        object-fit:initial;
        margin-left:0;
    }
    .mobile-menu-bar {
        position:sticky;
        top:0;
        z-index:1100;
        display:block;
        min-height:56px;
        padding:7px 0;
        background:#861b16;
        border-top:1px solid rgba(255,255,255,.18);
        border-bottom:1px solid rgba(0,0,0,.35);
    }
    .menu-toggle {
        width:42px;
        height:42px;
        padding:10px;
        display:flex;
        flex-direction:column;
        justify-content:center;
        gap:5px;
        border:1px solid #f5c54a;
        border-radius:50%;
        background:#2c130d;
        box-shadow:inset 0 0 0 2px rgba(255,255,255,.1);
    }
    .menu-toggle span {
        width:20px;
        height:2px;
        display:block;
        margin:auto;
        background:#f5c54a;
        border-radius:2px;
        transition:transform .2s ease,opacity .2s ease;
    }
    .menu-toggle[aria-expanded="true"] span:nth-child(1) {
        transform:translateY(7px) rotate(45deg);
    }
    .menu-toggle[aria-expanded="true"] span:nth-child(2) {
        opacity:0;
    }
    .menu-toggle[aria-expanded="true"] span:nth-child(3) {
        transform:translateY(-7px) rotate(-45deg);
    }
    .section-nav {
        display:none;
        position:static;
        background:#861b16;
        overflow:visible;
        box-shadow:0 4px 10px rgba(0,0,0,.4);
    }
    .section-nav.is-open {
        position:sticky;
        top:56px;
        z-index:1090;
        display:block;
        border-top:1px solid #F2D378;
        border-bottom:1px solid #F2D378;
        border-right:0;
        border-left:0;
        border-radius:0;
        overflow:hidden;
    }
    .section-nav .container {
        width:100%;
        min-width:0;
        padding:0;
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .section-nav a {
        min-height:54px;
        padding:8px 9px;
        gap:7px;
        font-size:10px;
        white-space:normal;
        border:0;
    }
    .section-nav a:first-child {
        border-left:0;
    }
    .section-nav a:nth-child(odd) {
        border-right:1px solid #F2D378;
    }
    .section-nav a:nth-child(-n+2) {
        border-bottom:1px solid #F2D378;
    }
    .section-nav a.active {
        background:#b52d1e;
    }
    .section-nav .nav-icon {
        width:15px;
        height:14px;
    }
    .page-body {
        --page-top-space:26px;
        padding-bottom:24px;
    }
    .content {
        padding-left:14px!important;
        padding-right:14px!important;
    }
    .intro {
        padding-right:0;
    }
    .title-plaque {
        min-height:45px;
        margin-bottom:18px;
        padding:7px 14px;
        border-radius:0;
        border:0;
        background:transparent url('../assets/images/Header%20%26%20Menu%20Icons/Header/Header%20Box.png') center/100% 100% no-repeat;
        box-shadow:none;
        font-size:17px;
    }
    .title-plaque .symbol {
        font-size:20px;
    }
    .plaque-icon {
        width:23px;
        max-height:22px;
    }
    .intro p {
        font-size:12px;
        line-height:1.6;
    }
    .intro-list {
        width:100%;
        margin:14px 0 10px;
        padding-left:17px;
    }
    .intro-list li {
        margin-bottom:12px;
        font-size:14px;
        line-height:1.48;
    }
    .fine-print {
        font-size:11px;
        line-height:1.55;
    }
    .corner-element {
        position:static;
        display:block;
        width:145px;
        margin:8px auto 4px;
    }
    .section-block {
        margin-top:29px;
    }
    .section-note {
        margin-bottom:12px;
        font-size:11px;
        line-height:1.55;
    }
    .rank-scroll {
        max-width:100%;
        overflow:visible;
    }
    .rank-panel {
        width:100%;
        max-width:none;
    }
    .rank-card p {
        right:3%;
        bottom:11%;
        left:3%;
        gap:.15em;
        font-size:clamp(5.5px,1.73vw,13px);
        line-height:1.35;
    }
    .rank-card p span {
        display:flex;
        flex-direction:column;
        align-items:center;
    }
    .requirements {
        margin-top:12px;
        font-size:10px;
        line-height:1.55;
    }
    .benefit-table {
        margin-left:0;
        margin-right:0;
        padding:0;
        border:0;
        border-radius:0;
        background:transparent;
        overflow:visible;
    }
    .benefit-table {
        display:none;
    }
    .mobile-benefit-table {
        display:grid;
        gap:16px;
        margin:0;
    }
    .mobile-benefit-table.motion-ready .mobile-benefit-section {
        opacity:0;
        transform:translate3d(0,28px,0) scale(.985);
        transition:opacity .48s ease,transform .58s cubic-bezier(.22,1,.36,1);
    }
    .mobile-benefit-table.motion-ready .mobile-benefit-section.is-revealed {
        opacity:1;
        transform:none;
    }
    .mobile-benefit-section {
        overflow:hidden;
        border:1px solid #F2D378;
        border-radius:12px;
        background:rgba(45,5,5,.88);
        box-shadow:0 5px 14px rgba(0,0,0,.34);
    }
    .mobile-benefit-section h3 {
        min-height:43px;
        margin:0;
        padding:11px 10px;
        display:flex;
        align-items:center;
        justify-content:center;
        color:#fff;
        background:#a32018;
        font:800 12px/1.25 Montserrat,sans-serif;
        text-align:center;
    }
    .mobile-benefit-head,.mobile-benefit-row {
        display:grid;
        grid-template-columns:1.15fr .85fr;
        align-items:center;
    }
    .mobile-benefit-head {
        min-height:34px;
        color:#F2D378;
        border-bottom:1px solid rgba(242,211,120,.55);
        font:700 10px/1.2 Montserrat,sans-serif;
        text-align:center;
    }
    .mobile-benefit-row {
        min-height:48px;
        color:#fff;
        border-bottom:1px solid rgba(242,211,120,.2);
        font:600 11px/1.2 Roboto,Arial,sans-serif;
    }
    .mobile-benefit-row:nth-of-type(even) {
        background:rgba(255,255,255,.045);
    }
    .mobile-benefit-row:last-of-type {
        border-bottom:0;
    }
    .mobile-benefit-section.is-revealed .mobile-benefit-head,.mobile-benefit-section.is-revealed .mobile-benefit-row,.mobile-benefit-section.is-revealed .mobile-benefit-notice {
        animation:mobile-benefit-row-in .36s cubic-bezier(.22,1,.36,1) both;
        animation-delay:var(--mobile-benefit-row-delay,0ms);
    }
    .mobile-benefit-row > span {
        min-width:0;
        padding:4px 10px;
        display:flex;
        align-items:center;
        gap:6px;
        position:relative;
    }
    .mobile-benefit-row:nth-of-type(even) > span {
        background:transparent url('../assets/images/VIP%20Tables/KEUNTUNGAN%20MEMBER%20VIP-table/PNG/line%20separator2.png') right center/auto 110% no-repeat;
    }
    .mobile-benefit-row:nth-of-type(odd) > span {
        background:transparent url('../assets/images/VIP%20Tables/KEUNTUNGAN%20MEMBER%20VIP-table/PNG/line%20separator1.png') right center/auto 55% no-repeat;
    }
    .mobile-benefit-row > span > img:first-child {
        width:37px;
        height:37px;
        flex:0 0 auto;
        object-fit:contain;
    }
    .mobile-benefit-rank-title {
        position:absolute;
        top:50%;
        left:58px;
        transform:translateY(-50%);
        color:#f5f5f5;
        font:800 13px/1 Montserrat,sans-serif;
        letter-spacing:-.25px;
        text-shadow:0 2px 1px rgba(0,0,0,.58);
        text-transform:uppercase;
        white-space:nowrap;
    }
    .mobile-benefit-rank-title.rank-bronze {
        color:#bd8247;
    }
    .mobile-benefit-rank-title.rank-silver {
        color:#f4f4f4;
    }
    .mobile-benefit-rank-title.rank-gold {
        color:#f3b126;
    }
    .mobile-benefit-rank-title.rank-platinum,.mobile-benefit-rank-title.rank-diamond {
        color:#f5f5f5;
    }
    .mobile-benefit-row strong {
        min-width:0;
        padding:4px 10px;
        color:#fff;
        border-left:0;
        font:700 11px/1.25 Roboto,Arial,sans-serif;
        text-align:center;
    }
    .mobile-benefit-check {
        width:15px;
        height:15px;
        object-fit:contain;
        vertical-align:middle;
    }
    .mobile-benefit-notice {
        margin:0;
        padding:10px 13px;
        color:#fff;
        background:#9B0000;
        font:600 9px/1.45 Roboto,Arial,sans-serif;
        text-align:center;
    }
    @keyframes mobile-benefit-row-in {
        from {
            opacity:0;
            transform:translate3d(-14px,0,0);
        }
        to {
            opacity:1;
            transform:none;
        }
    }
    .benefit-headers {
        font-size:clamp(4px,1.05vw,8px);
    }
    .benefit-data > span {
        padding:0 1%;
        font-size:clamp(3.5px,.9vw,6px);
    }
    .benefit-data img {
        width:clamp(7px,2vw,11px);
    }
    .benefit-notice {
        padding:1% 4%;
        font-size:clamp(3.3px,.75vw,5px);
    }
    .terms {
        margin-top:35px;
    }
    .terms h3,.promise h3 {
        margin-bottom:13px;
        color:#f3d266;
        font-size:13px;
        line-height:1.45;
    }
    .terms p,.promise p,.terms li,.promise li {
        margin-bottom:10px;
        font-size:11px;
        line-height:1.6;
        color:#f4eeee;
    }
    .promise {
        margin-top:22px;
        padding:20px 0 12px;
        border-top-color:rgba(235,184,60,.28);
    }
    .promise-element {
        position:static;
        display:block;
        width:185px;
        margin:10px auto 0;
    }
    .help-inner {
        min-height:44px;
        font-size:8px;
        line-height:1.2;
    }
    .help-inner > span {
        min-height:44px;
        padding:0 7px;
    }
    .chat-link {
        left:59%;
        width:30%;
        min-height:44px;
        gap:3px;
        font-size:10px;
    }
    .chat-link img {
        width:16px;
    }
    .site-footer {
        padding:16px 0 18px;
    }
    .footer-inner {
        min-height:0;
        grid-template-columns:1fr;
        gap:18px;
    }
    .footer-group {
        gap:8px;
    }
    .footer-group:first-child,.footer-group:last-child {
        align-items:center;
    }
    .footer-group:first-child .footer-title,.footer-group:last-child .footer-title {
        margin:0;
    }
    .footer-title {
        width:min(100%,260px);
        gap:8px;
        font-size:10px;
    }
    .footer-title span {
        width:28px;
    }
    .footer-logo-left {
        width:155px;
    }
    .footer-logo-right {
        width:min(315px,100%);
    }
}
/* Final PlayMe8 theme overrides. Kept last so the legacy starter styles cannot win. */ body {
    background:#000 url('../assets/images/Elements/1920x1276_PM8-VIP%20Background.webp') top center/cover fixed no-repeat;
}
.site-header {
    background:#f4c13d;
}
.header-inner {
    min-height:86px;
    justify-content:center;
}
.brand img {
    width:200px;
}
.hero {
    border-top:3px solid #b87911;
}
.section-nav {
    background:#000;
    border-bottom:1px solid #b88720;
}
.section-nav a {
    min-height:92px;
    color:#f4c13d;
    border-color:#9e761b;
}
.section-nav a.active,.section-nav a:hover,.section-nav a:focus-visible {
    color:#080808;
    background:#f3c03c;
}
.section-nav a.active .nav-icon-default,.section-nav a:hover .nav-icon-default,.section-nav a:focus-visible .nav-icon-default {
    opacity:1;
}
.section-nav a.active .nav-icon-highlight,.section-nav a:hover .nav-icon-highlight,.section-nav a:focus-visible .nav-icon-highlight {
    opacity:0;
}
.title-plaque {
    min-height:132px;
    color:#050505;
    background:transparent url('../assets/images/menu-header/default/Title%20Asset.png') center/100% 100% no-repeat;
    font-size:clamp(24px,3.2vw,44px);
}
.plaque-icon {
    width:50px;
    max-height:48px;
}
.intro p,.terms li,.promise li,.section-note {
    color:#f2f0e8;
}
.rank-panel {
    aspect-ratio:auto;
    padding:18px;
    background:linear-gradient(145deg,#1d1609,#4d3b12 52%,#1d1609);
    border:3px solid #d49d24;
    border-radius:20px;
    box-shadow:0 0 0 3px #080808 inset,0 10px 24px rgba(0,0,0,.55);
}
.rank-grid {
    position:static;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
}
.rank-card {
    min-height:190px;
    padding:12px 8px;
    border:1px solid rgba(255,218,118,.52);
    border-radius:8px;
    background:linear-gradient(145deg,rgba(93,65,18,.85),rgba(21,18,10,.92));
}
.rank-card img {
    width:76px;
    height:76px;
    margin:0 auto;
    object-fit:contain;
}
.rank-card p {
    position:static;
    gap:2px;
    margin:8px 0 0;
    font-size:clamp(10px,1.3vw,15px);
}
.benefit-board {
    aspect-ratio:auto;
    padding:18px;
    background:linear-gradient(145deg,#5a4818,#b39137 50%,#564415);
    border:3px solid #9b7a20;
    border-radius:16px;
}
.benefit-headers,.benefit-rows {
    position:static;
}
.benefit-headers {
    display:grid;
    grid-template-columns:repeat(7,minmax(74px,1fr));
    margin-left:104px;
    height:auto;
    padding:10px 0;
    color:#1a1204;
    font-size:clamp(7px,.92vw,14px);
    background:rgba(255,238,166,.65);
}
.benefit-rows {
    display:grid;
    grid-template-rows:none;
    gap:3px;
}
.benefit-row {
    grid-template-columns:104px minmax(0,1fr);
    min-height:58px;
}
.benefit-rank {
    background:rgba(25,19,7,.75);
}
.benefit-rank>img:first-child {
    height:54px;
    max-width:58px;
    transform:none;
}
.benefit-rank-title {
    position:static;
    transform:none;
    writing-mode:initial;
    font-size:11px;
}
.benefit-data {
    background:#2b2412!important;
    grid-template-columns:repeat(7,minmax(74px,1fr));
    border:1px solid rgba(255,225,133,.32);
}
.light-row .benefit-data {
    background:#4a3d1c!important;
}
.benefit-data>span {
    height:auto;
    min-height:54px;
    border-right:1px solid rgba(255,225,133,.25);
    font-size:clamp(7px,.85vw,13px);
    white-space:normal;
}
.benefit-notice {
    width:auto;
    margin:0;
    padding:10px 14px;
    background:#5d201a;
    font-size:clamp(8px,.75vw,12px);
}
.benefit-data img {
    display:none;
}
.benefit-data span:has(img)::after {
    content:'✓';
    color:#f4c13d;
    font-size:20px;
}
.help-bar {
    background:#f4c13d;
}
.help-inner {
    color:#151006;
}
.chat-link {
    color:#f4c13d;
    background:#111;
    clip-path:none;
}
.chat-link img {
    display:none;
}
.site-footer {
    background:#030303;
}
@media(max-width:767.98px) {
    body {
        background-attachment:scroll;
    }
    .site-header {
        background:#f4c13d;
    }
    .header-inner {
        min-height:56px;
        justify-content:flex-start;
    }
    .brand img {
        width:125px;
    }
    .mobile-menu-bar {
        background:#080808;
        border-color:#7d5c18;
    }
    .menu-toggle {
        border-color:#f4c13d;
        background:#17120a;
    }
    .section-nav {
        background:#080808;
    }
    .section-nav a.active {
        background:#f3c03c;
    }
    .title-plaque {
        min-height:56px;
        margin-bottom:20px;
        font-size:16px;
        background-image:url('../assets/images/menu-header/default/Title%20Asset.png');
    }
    .plaque-icon {
        width:22px;
        max-height:22px;
    }
    .corner-element {
        width:190px;
        right:-58px;
        top:280px;
        opacity:.8;
    }
    .rank-panel {
        padding:8px;
        border-width:2px;
        border-radius:12px;
    }
    .rank-grid {
        grid-template-columns:repeat(2,1fr);
        gap:5px;
    }
    .rank-card {
        min-height:130px;
        padding:8px 4px;
    }
    .rank-card img {
        width:55px;
        height:55px;
    }
    .rank-card p {
        font-size:9px;
    }
    .benefit-table {
        display:none;
    }
    .mobile-benefit-table {
        display:grid;
        gap:12px;
    }
    .mobile-benefit-section {
        border:2px solid #b88a20;
        border-radius:10px;
        overflow:hidden;
        background:#251e0d;
    }
    .mobile-benefit-section h3 {
        margin:0;
        padding:9px;
        color:#151006;
        background:#e7bd48;
        font:800 12px Montserrat,sans-serif;
        text-align:center;
    }
    .mobile-benefit-head,.mobile-benefit-row {
        display:grid;
        grid-template-columns:1fr 1fr;
        align-items:center;
    }
    .mobile-benefit-head {
        color:#f9e6a5;
        background:#120f08;
        font:700 10px Roboto,sans-serif;
        text-align:center;
    }
    .mobile-benefit-head span {
        padding:7px 5px;
    }
    .mobile-benefit-row {
        min-height:43px;
        border-top:1px solid rgba(245,205,111,.3);
    }
    .mobile-benefit-row>span {
        display:flex;
        align-items:center;
        gap:8px;
        padding-left:9px;
    }
    .mobile-benefit-row>span>img:first-child {
        width:32px;
        height:32px;
        object-fit:contain;
    }
    .mobile-benefit-rank-title {
        font:700 11px Roboto,sans-serif;
    }
    .mobile-benefit-row strong {
        color:#f8e7ac;
        font-size:11px;
        text-align:center;
    }
    .mobile-benefit-notice {
        margin:0;
        padding:9px;
        color:#fff;
        background:#55201a;
        font-size:10px;
        line-height:1.35;
    }
}

#cara .rank-grid .rank-card .rank-name {
    text-transform:uppercase !important;
}
/* Header alignment, menu icon contrast, and the six-card VIP level board. */ .header-inner {
    justify-content:flex-start;
}
.hero {
    border-top:0;
}
.section-nav {
    border-bottom:0;
}
.section-nav a:not(.active) .nav-icon-default {
    opacity:0;
}
.section-nav a:not(.active) .nav-icon-highlight {
    opacity:1;
}
.section-nav a.active .nav-icon-default {
    opacity:1;
}
.section-nav a.active .nav-icon-highlight {
    opacity:0;
}
.rank-panel {
    max-width:1090px;
    margin:auto;
    padding:28px 34px;
    background:#030303;
    border:3px solid #d8af36;
    border-radius:44px;
    box-shadow:0 0 0 4px rgba(153,104,9,.55) inset;
}
.rank-grid {
    gap:10px;
}
.rank-card {
    min-height:225px;
    padding:0;
    overflow:hidden;
    border:1px solid #8b6a21;
    border-radius:9px;
    background:linear-gradient(145deg,#4b3210,#211704 62%,#181104);
    box-shadow:inset 0 0 22px rgba(255,187,49,.12);
}
.rank-card img {
    position:absolute;
    z-index:0;
    top:6px;
    left:1%;
    width:62%;
    height:calc(100% - 30px);
    margin:0;
    opacity:.78;
    object-fit:contain;
    object-position:left center;
}
.rank-card p {
    position:absolute;
    z-index:1;
    right:5%;
    bottom:34px;
    left:44%;
    align-items:flex-end;
    margin:0;
    color:#ded5bc;
    font-size:clamp(11px,1.15vw,18px);
    line-height:1.65;
    text-align:right;
}
.rank-card p strong {
    display:inline-block;
    color:#f4c13d;
    font-size:1.25em;
}
.rank-name {
    position:absolute;
    z-index:2;
    right:0;
    bottom:0;
    left:0;
    padding:3px 12px;
    color:#fff;
    background:rgba(52,43,22,.82);
    border-top:1px solid #9b7b27;
    font:800 clamp(14px,1.55vw,24px)/1.15 Montserrat,sans-serif;
}
.rank-vip {
    position:absolute;
    z-index:2;
    right:14px;
    bottom:5px;
    color:#e3b840;
    font:700 clamp(8px,.8vw,13px) Montserrat,sans-serif;
}
@media(max-width:767.98px) {
    .header-inner {
        justify-content:flex-start;
    }
    .hero {
        border-top:0;
    }
    .section-nav a:not(.active) .nav-icon-default {
        opacity:0;
    }
    .section-nav a:not(.active) .nav-icon-highlight {
        opacity:1;
    }
    .rank-panel {
        padding:9px;
        border-radius:16px;
    }
    .rank-grid {
        gap:5px;
    }
    .rank-card {
        min-height:120px;
    }
    .rank-card img {
        width:61%;
        height:93%;
        opacity:.68;
    }
    .rank-card p {
        right:4%;
        bottom:23px;
        left:40%;
        font-size:8px;
        line-height:1.45;
    }
    .rank-name {
        padding:3px 6px;
        font-size:10px;
    }
    .rank-vip {
        right:7px;
        bottom:3px;
        font-size:7px;
    }
}
/* Exact card-board proportions from the Cara Mengikuti reference. */

#cara {
    position:relative;
    z-index:2;
    margin-top:68px;
    padding:58px 0 44px;
    background:transparent;
    box-shadow:none;
    clip-path:none;
}
#cara .title-plaque {
    width:min(920px,100%);
    min-height:118px;
    margin-bottom:26px;
    font-size:clamp(24px,2.85vw,42px);
}
#cara .section-note {
    margin-bottom:60px;
    font-size:16px;
    font-weight:700;
}
#cara .rank-panel {
    max-width:1200px;
    padding:48px 54px;
    border:3px solid #f4dc83;
    border-radius:52px;
    background:rgba(37,34,26,.18);
    box-shadow:0 0 0 3px rgba(138,103,23,.52) inset;
}
#cara .rank-grid {
    gap:7px 8px;
}
#cara .rank-card {
    min-height:213px;
    border-color:#85671e;
    border-radius:8px;
    background:linear-gradient(140deg,#745a36 0%,#514326 48%,#363126 100%);
    box-shadow:inset 0 0 25px rgba(0,0,0,.32);
}
#cara .rank-card img {
    top:-7%;
    left:-10%;
    width:77%;
    height:121%;
    opacity:.57;
    object-position:left center;
}
#cara .rank-card p {
    top:32px;
    right:5%;
    bottom:auto;
    left:61%;
    color:#e6e0d5;
    font-size:clamp(10px,.95vw,15px);
    font-weight:500;
    line-height:1.85;
}
#cara .rank-card p strong {
    font-size:1.18em;
}
#cara .rank-name {
    padding:4px 13px;
    color:#fff;
    background:rgba(57,47,24,.86);
    border-color:#9f7d25;
    font-size:clamp(14px,1.45vw,22px);
}
#cara .rank-vip {
    right:14px;
    bottom:5px;
}
#cara .requirements {
    max-width:1200px;
    margin-top:38px;
}
@media(max-width:767.98px) {
    #cara {
        margin-top:38px;
        padding:32px 0 28px;
    }
    #cara .title-plaque {
        min-height:56px;
        margin-bottom:16px;
        font-size:16px;
    }
    #cara .section-note {
        margin-bottom:25px;
        font-size:12px;
    }
    #cara .rank-panel {
        padding:8px;
        border-radius:17px;
        background:rgba(37,34,26,.18);
    }
    #cara .rank-grid {
        gap:5px;
    }
    #cara .rank-card {
        min-height:118px;
    }
    #cara .rank-card img {
        top:-5%;
        left:-8%;
        width:72%;
        height:114%;
        opacity:.57;
    }
    #cara .rank-card p {
        top:16px;
        right:4%;
        left:44%;
        font-size:7px;
        line-height:1.55;
    }
    #cara .rank-name {
        padding:3px 6px;
        font-size:10px;
    }
    #cara .rank-vip {
        right:7px;
        bottom:3px;
        font-size:7px;
    }
}
/* Reference-grade VIP tier board styling. */

#cara .rank-panel {
    padding:47px 48px;
    border:5px solid #f8e49b;
    border-radius:55px;
    background:rgba(44,42,35,.19);
    box-shadow:0 0 0 2px rgba(92,70,17,.58) inset;
}
#cara .rank-grid {
    gap:7px 6px;
}
#cara .rank-card {
    min-height:212px;
    border:1px solid #80631e;
    border-radius:9px;
    background:linear-gradient(135deg,#8b6333 0%,#654922 45%,#3e3421 100%);
    box-shadow:inset 0 2px 8px rgba(255,191,35,.62),inset 0 -18px 26px rgba(19,15,7,.3);
}
#cara .rank-card img {
    top:-12%;
    left:-32%;
    width:110%;
    height:135%;
    opacity:.52;
}
#cara .rank-card p {
    top:38px;
    right:5%;
    left:54%;
    gap:12px;
    color:#f0ece4;
    font:400 16px/1.05 Roboto,Arial,sans-serif;
    text-align:right;
}
#cara .rank-card p span {
    display:flex;
    flex-direction:column;
    align-items:flex-end;
}
#cara .rank-card p strong {
    color:#f5c549;
    font-size:20px;
    font-weight:700;
}
#cara .rank-name {
    height:46px;
    display:flex;
    align-items:center;
    padding:0 15px;
    color:#fff;
    background:rgba(54,47,29,.81);
    border-top:1px solid #a98526;
    font:700 26px/1 Roboto,Arial,sans-serif;
}
#cara .rank-vip {
    right:15px;
    bottom:14px;
    color:#e6bc43;
    font:700 15px/1 Georgia,serif;
}
@media(max-width:767.98px) {
    #cara .rank-panel {
        padding:8px;
        border-width:2px;
        border-radius:18px;
    }
    #cara .rank-grid {
        gap:5px;
    }
    #cara .rank-card {
        min-height:118px;
        border-radius:6px;
        box-shadow:inset 0 1px 4px rgba(255,191,35,.55),inset 0 -10px 16px rgba(19,15,7,.3);
    }
    #cara .rank-card img {
        top:-10%;
        left:-29%;
        width:102%;
        height:128%;
        opacity:.52;
    }
    #cara .rank-card p {
        top:17px;
        right:4%;
        left:44%;
        gap:5px;
        font-size:7px;
    }
    .rank-card p strong {
        font-size:11px;
    }
    #cara .rank-name {
        height:24px;
        padding:0 6px;
        font-size:11px;
    }
    #cara .rank-vip {
        right:7px;
        bottom:7px;
        font-size:7px;
    }
}

#cara .rank-card img {
    transform-origin:42% 52%;
    transition:transform .24s ease-out;
}
@media(hover:hover) {
    #cara .rank-card:hover img {
        transform:scale(1.045);
    }
}
@media(prefers-reduced-motion:reduce) {
    #cara .rank-card img {
        transition:none;
    }
}

/* Keuntungan Member VIP table */
#keuntungan .benefit-table {
    max-width:1430px;
}
#keuntungan .benefit-board {
    --benefit-label-column:335px;
    position:static;
    aspect-ratio:auto;
    padding:20px 48px 22px;
    background:#2f291b;
    border:3px solid #d2a636;
    border-radius:28px;
    box-shadow:inset 0 0 0 2px rgba(63,47,13,.55),0 8px 18px rgba(0,0,0,.35);
}
.vip-benefit-grid {
    position:relative;
    display:grid;
    grid-template-columns:var(--benefit-label-column) repeat(7,minmax(0,1fr));
    gap:8px 0;
}
.vip-benefit-grid::before {
    content:"";
    position:absolute;
    top:0;
    right:0;
    left:var(--benefit-label-column);
    height:130px;
    background:linear-gradient(90deg,#ab793e 0%,#c99e59 30%,#eddd89 58%,#d0a95c 100%);
    border-radius:0 6px 6px 0;
}
.benefit-service-head,.benefit-level {
    min-height:130px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    position:relative;
    z-index:1;
    background:transparent;
}
.benefit-service-head {
    align-items:flex-start;
    padding:0 28px;
    color:#fff;
    background:linear-gradient(90deg,#dfcf80,#9a7038);
    border-right:3px solid #4b371c;
    border-radius:6px 0 0 6px;
    font:800 32px/1.02 Montserrat,Arial,sans-serif;
    white-space:nowrap;
}
.benefit-level:nth-child(8) {
    border-radius:0 6px 6px 0;
}
.benefit-level img {
    width:90px;
    height:90px;
    object-fit:contain;
    transform-origin:center bottom;
    margin-top: 0.4rem;
}
.benefit-level:nth-child(2) img {
    transform:scale(.90);
    margin-top: 0px;
}
.benefit-level:nth-child(3) img {
    transform:scale(.95);
}
.benefit-level:nth-child(4) img {
    transform:scale(1.1);
}
.benefit-level:nth-child(5) img {
    transform:scale(1.1);
}
.benefit-level:nth-child(6) img {
    transform:scale(1.15);
}
.benefit-level:nth-child(7) img {
    transform:scale(1.18);
}
.benefit-level:nth-child(8) img {
    transform:scale(1.18);
}
.benefit-level span {
    margin-top: 7px;
    color:#050505;
    font:500 clamp(10px,1.05vw,16px)/1 Roboto,Arial,sans-serif;
}
.vip-benefit-row {
    grid-column:1/-1;
    min-height:38px;
    display:grid;
    grid-template-columns:var(--benefit-label-column) repeat(7,minmax(0,1fr));
    overflow:hidden;
    color:#fff;
    background:#896a32;
    border-radius:5px;
    font:700 clamp(10px,.87vw,14px)/1.1 Roboto,Arial,sans-serif;
}
.vip-benefit-row.dark {
    background:#4a3a24;
}
.vip-benefit-row > * {
    min-width:0;
    padding:8px 6px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
}
.vip-benefit-row > b {
    justify-content:flex-start;
    padding-left:38px;
    border-right:3px solid #46341e;
}
.vip-benefit-row > span,.vip-benefit-row > b {
    background:#896a32;
}
.vip-benefit-row.dark > span,.vip-benefit-row.dark > b {
    background:#4a3a24;
}
.vip-benefit-notice,.vip-reload-note {
    grid-column:1/-1;
    margin:0;
}
.vip-benefit-notice {
    min-height:70px;
    padding:12px 38px;
    display:flex;
    align-items:center;
    color:#fff;
    background:linear-gradient(90deg,#ac803d,#b38a46);
    border-radius:6px;
    font:italic 500 clamp(10px,.86vw,14px)/1.35 Roboto,Arial,sans-serif;
}
.vip-reload-note {
    min-height:26px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 20px;
    color:#171006;
    background:linear-gradient(90deg,transparent 0%,rgba(85,64,27,.42) 16%,#c28f32 36%,#ebbb43 48%,#f4c64b 50%,#ebbb43 52%,#c28f32 64%,rgba(85,64,27,.42) 84%,transparent 100%);
    border-radius:0;
    font:italic 700 clamp(10px,.86vw,14px)/1 Roboto,Arial,sans-serif;
}
.benefit-check {
    width:20px;
    height:20px;
    padding:0 !important;
    justify-self:center;
    align-self:center;
    display:block;
    object-fit:contain;
}
@media(max-width:767.98px) {
    #keuntungan .benefit-table {
        display:none;
    }
}

@media(min-width:992px) {
    .promise {
        padding-bottom:160px;
    }
    .promise-element {
        bottom:63px;
    }
}

@media(min-width:1200px) {
    #program .intro p {
        margin-bottom:22px;
        font-size:21px;
        line-height:1.3;
    }
    #program .intro-list {
        margin:42px 0 30px;
        padding-left:39px;
    }
    #program .intro-list li {
        margin-bottom:34px;
        padding-left:8px;
        font-size:30px;
        line-height:1.35;
    }
    #program .fine-print {
        font-size:20px;
        line-height:1.3;
    }
}

@media(max-width:767.98px) {
    .mobile-benefit-notice {
        background:linear-gradient(90deg,#ac803d,#b38a46);
    }
    .mobile-benefit-rank-title.rank-regular {
        color:#d5e0df;
    }
    .mobile-benefit-rank-title.rank-chairman {
        color:#f3b126;
    }
    .mobile-benefit-row strong .mobile-benefit-check {
        width:17px;
        height:17px;
        display:block;
        margin:0 auto;
    }
    .mobile-reload-note {
        min-height:34px;
        margin:0;
        padding:8px 12px;
        display:flex;
        align-items:center;
        justify-content:center;
        color:#181006;
        background:linear-gradient(90deg,#3f321b 0%,#b17d24 28%,#F7B500 50%,#b17d24 72%,#3f321b 100%);
        font:italic 700 9px/1.35 Roboto,Arial,sans-serif;
        text-align:center;
    }
}

/* Footer */
.help-bar {
    background:#f4c13d;
}
.help-inner {
    position:relative;
    width:100%;
    max-width:none;
    min-height:88px;
    margin:0;
    padding:0 !important;
    color:#0c0a07;
    background:#f4c13d;
}
.help-copy {
    width:64%;
    min-height:88px;
    padding:0 38px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    font:700 clamp(15px,1.2vw,22px)/1.2 Montserrat,Arial,sans-serif;
}
.chat-link {
    position:absolute;
    top:0;
    bottom:-1px;
    left:62%;
    width:20%;
    min-width:285px;
    min-height:0;
    padding:0 32px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    color:#f4c13d;
    background:#000;
    clip-path:polygon(12% 0,100% 0,88% 100%,0 100%);
    font:800 clamp(15px,1vw,20px)/1 Montserrat,Arial,sans-serif;
    text-decoration:none;
}
.chat-link:hover {
    color:#fff0a6;
}
.chat-link img {
    display:block;
    width:62px;
    height:54px;
    object-fit:contain;
}
.site-footer {
    padding:22px 0 0;
    background:#000;
    border:0;
}
.footer-inner {
    width:min(1320px,100%);
    min-height:160px;
    margin:0 auto;
    padding:0 28px 26px;
    display:grid;
    grid-template-columns:.9fr .8fr 1.55fr;
    gap:46px;
    align-items:start;
}
.footer-group,.footer-group:first-child,.footer-group:last-child {
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:16px;
}
.footer-group:first-child .footer-title,.footer-group:last-child .footer-title {
    margin:0;
}
.footer-title {
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    color:#d8d8d8;
    font:500 16px/1 Roboto,Arial,sans-serif;
    white-space:nowrap;
}
.footer-title span {
    width:42px;
    height:1px;
    flex:0 1 42px;
    background:#c6c6c6;
}
.footer-logo {
    display:block;
    height:auto;
    object-fit:contain;
}
.footer-logo-left {
    width:185px;
}
.footer-logo-right {
    width:min(465px,100%);
}
.footer-social-links {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
}
.footer-social-links a {
    display:block;
    line-height:0;
}
.footer-social-links img {
    width:42px;
    height:42px;
    object-fit:contain;
}
.footer-links {
    min-height:49px;
    padding:0 24px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:0;
    color:#080705;
    background:#f4c13d;
}
.footer-links a {
    position:relative;
    padding:0 35px;
    color:inherit;
    font:500 16px/1 Roboto,Arial,sans-serif;
    text-decoration:none;
}
.footer-links a + a::before {
    content:"";
    position:absolute;
    top:50%;
    left:0;
    width:1px;
    height:20px;
    background:#1c180d;
    transform:translateY(-50%);
}
.footer-links a:hover {
    color:inherit;
    text-decoration:none;
}
@media(max-width:960px) {
    .help-copy {
        width:61%;
        padding:0 24px;
    }
    .chat-link {
        left:59%;
        width:27%;
        min-width:0;
    }
    .footer-inner {
        gap:20px;
        padding-right:20px;
        padding-left:20px;
    }
    .footer-logo-left {
        width:150px;
    }
    .footer-logo-right {
        width:min(370px,100%);
    }
    .footer-links a {
        padding:0 16px;
        font-size:13px;
    }
}
@media(max-width:640px) {
    .help-inner,.help-copy,.chat-link {
        min-height:58px;
    }
    .help-copy {
        width:62%;
        padding:0 10px;
        font-size:10px;
    }
    .chat-link {
        left:59%;
        width:34%;
        padding:0 10px;
        gap:5px;
        font-size:13px;
    }
    .chat-link img {
        width:39px;
        height:38px;
    }
    .site-footer {
        padding-top:18px;
    }
    .footer-inner {
        min-height:0;
        grid-template-columns:1fr;
        gap:20px;
        padding-bottom:22px;
    }
    .footer-group {
        gap:10px;
    }
    .footer-title {
        font-size:13px;
    }
    .footer-title span {
        width:30px;
        flex-basis:30px;
    }
    .footer-logo-left {
        width:155px;
    }
    .footer-logo-right {
        width:min(315px,100%);
    }
    .footer-social-links img {
        width:34px;
        height:34px;
    }
    .footer-links {
        min-height:42px;
        padding:7px 8px;
        flex-wrap:wrap;
        row-gap:7px;
    }
    .footer-links a {
        padding:0 9px;
        font-size:10px;
    }
    .footer-links a + a::before {
        height:12px;
    }
}
