/*
* Early-load utility classes from the body HTML widget.
* Smooth scroll is NOT declared here: elementor-frontend.min.css already ships
* @media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}},
* which is what live uses. Duplicating it here added nothing.
*/
.gradient-text {
background: linear-gradient(to right, #e2be69, #d18200);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
color: transparent;
}
.white-bold-text {
color: #ffffff;
font-weight: 700;
}
/*
* Top border only, as the class name says. It was `border: 1px solid transparent`
* on all four sides against a gradient border-box, so every element carrying the
* class painted a gold hairline at BOTH its top and its bottom -- which doubled
* the line wherever two such sections met, and left a stray line cutting across
* a section's middle.
*/
.twx-border-top {
background:
linear-gradient(#000 0 0) padding-box,
linear-gradient(270deg, rgba(117, 249, 145, 0) 0%, #e2be69 50.51%, rgba(117, 249, 145, 0) 101.07%)
border-box;
border: 0 solid transparent;
border-top-width: 1px;
border-radius: 0;
}
/*
* Needs Elementor-level specificity: post-17915.css sets border-width on the
* element itself, so a bare .twx-border-top lost and all four sides kept
* painting (measured 1px 1px 1px 1px).
*/
.elementor-17915 .elementor-element.twx-border-top {
border-width: 1px 0 0 0;
}
/*
* Stray gold hairlines, now removed at every width (previously only <=767px).
*
* .border-bottom-gradient draws a 2px gold rule at the bottom of whatever
* carries it, and three of those landed badly on desktop:
* - ab55a94 (y7494) sat ~200px above a451418's own section border (y7697), so
* the Community/Bonus boundary showed TWO lines.
* - e0252ad (y7133) added a third in the same band.
* - eea1cfd (y10541) cut straight across the middle of the Chart Ideas /
* Live Portfolio card, full width.
* a451418's top border is kept -- that is the real section separator.
*/
.elementor-17915 .elementor-element.elementor-element-e0252ad.border-bottom-gradient::after,
.elementor-17915 .elementor-element.elementor-element-ab55a94.border-bottom-gradient::after,
.elementor-17915 .elementor-element.elementor-element-eea1cfd.border-bottom-gradient::after {
display: none;
}
.twx-bg-gradient {
background-color: #000000;
background-image: radial-gradient(
93.75% 95.15% at 21.89% 4.85%,
rgba(103, 103, 103, 0.4) 0%,
rgba(41, 25, 0, 0.4) 58.66%,
rgba(155, 96, 7, 0.4) 100%
);
}
.twx-bg-gradient-2 {
background-color: #000000;
background-image: radial-gradient(
93.75% 95.15% at 21.89% 4.85%,
rgba(155, 96, 7, 0.4) 0%,
rgba(41, 25, 0, 0.4) 51.91%,
rgba(155, 96, 7, 0.4) 100%
);
}
.border-bottom-gradient {
position: relative;
}
.border-bottom-gradient::after {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 2px;
background: linear-gradient(
270deg,
rgba(117, 249, 145, 0) 0%,
#e2be69 50.51%,
rgba(117, 249, 145, 0) 101.07%
);
pointer-events: none;
}
/*
* Scroll-reveal removed: the exported page contains zero e-animation /
* elementor-invisible classes, so live has no section fade-in. The fade-up was
* added locally and read as a difference from the live design.
*/
/* WP live: masthead kosong, nav di body page 17915 */
body.page-id-17915 {
padding-top: 0 !important;
}
#masthead:empty {
height: 0;
min-height: 0;
overflow: hidden;
border: none;
position: absolute;
pointer-events: none;
}
/* Hero bg di belakang nav + konten */
.elementor-17915 {
position: relative;
}
.elementor-17915 .elementor-element.elementor-element-a9fe13c {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 1;
pointer-events: none;
}
.elementor-17915 .elementor-element.elementor-element-a85b357,
.elementor-17915 .elementor-element.elementor-element-97f8b21 {
position: relative;
z-index: 2;
}
.elementor-17915 .elementor-element.elementor-element-a85b357 {
z-index: 10;
}
/* Desktop: headline tidak tembus kolom kanan */
@media (min-width: 881px) {
.elementor-17915 .elementor-element.elementor-element-7bcf5e3 {
max-width: 703px;
width: 100%;
}
.elementor-17915 .elementor-element.elementor-element-7bcf5e3 .elementor-heading-title {
text-align: left;
}
.elementor-17915 .elementor-element.elementor-element-6d4b730 {
max-width: 586px;
overflow: hidden;
}
}
/* Bootstrap reboot jangan override elementor grid */
.site-main .elementor,
.site-main .elementor * {
box-sizing: border-box;
}
/*
* CTA hover lift removed: translateY(-2px) + brightness(1.08) was added locally.
* Elementor supplies no such hover on these buttons, so live does not lift them.
*/
/* Old WP login modal — replaced by React AuthModal */
#login-modal {
display: none !important;
}
/* FAQ nested accordion */
.elementor-widget-n-accordion .e-n-accordion {
width: 100%;
}
.elementor-widget-n-accordion .e-n-accordion-item > summary {
list-style: none;
}
.elementor-widget-n-accordion .e-n-accordion-item > summary::-webkit-details-marker {
display: none;
}
.elementor-widget-n-accordion .e-n-accordion-item > [role="region"] {
width: 100%;
}
.elementor-17915 .elementor-element.elementor-element-53f438a .e-n-accordion-item-title-text {
font-family: "Inter", sans-serif;
}
/* Footer Discord badge — reset negative margin Elementor */
.elementor-17915 .elementor-element.elementor-element-9af396d > .elementor-widget-container {
margin-left: 0 !important;
}
/*
* Heading-widget links. The theme's style.css:537 sets a bare global
* `a { color: #4169e1 }`. Live overrides that for heading widgets, but the export
* ships nothing that does, so the footer policy links (Syarat & Ketentuan,
* Kebijakan Privasi) rendered royalblue locally while live shows them in the
* heading's own colour. Inherit so they track the heading, as on live.
*/
.elementor-widget-heading .elementor-heading-title a {
color: inherit;
}
/*
* Same root cause, but it reaches much further than the footer: style.css also
* ships `a:visited { color: #800080 }` (line 541), and this whole WordPress /
* Elementor stylesheet stack is loaded on every route, not just the landing
* page. So the React app inherited the stock underscores palette -- the course
* card titles rendered royalblue, and "Balik ke beranda" / "Login" on the auth
* pages turned purple once visited. Nothing in this design asks for either
* colour. Every element that wants a link colour sets it via a class, which
* outranks this, so handing plain links back to their parent is safe.
*/
a:link,
a:visited {
color: inherit;
}
/*
* Coupon field, revealed by "Punya Kode Promo?" (toggled in LandingScripts).
*
* The carries inline `border:none !important; background:none !important`,
* and an inline !important cannot be overridden from a stylesheet -- so the field
* look goes on its .field-outer wrapper and the input stays transparent inside.
*/
.coupon_toggler_input.hidden {
display: none;
}
/*
* The checkout button below sits on a negative top margin, so once the coupon
* field appeared the button overlapped it. The extra bottom margin buys back
* more than that negative offset, and the stacking context keeps the field above
* the button if anything else shifts.
*/
/*
* One row, not two. The wrapper is display:block holding an inline