/* ========================= */
/* LOAD PREMIUM FONTS */
/* ========================= */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Cormorant+Garamond:wght@400;500;600&display=swap');

/* ========================= */
/* GLOBAL TYPOGRAPHY */
/* ========================= */

body{
font-family:'Cormorant Garamond',serif;
color:#010101;
font-size:18px;
line-height:1.9;
}

/* Heading font */

h1,h2,h3,h4,h5,h6{
font-family:'Cinzel',serif;
letter-spacing:1px;
font-weight:600;
color:#010101;
}

/* Paragraph */

p,li{
font-family:'Cormorant Garamond',serif;
}

/* Highlight */

strong{
color:#d4af37;
font-weight:600;
}

/* ========================= */
/* HIDE TOP BAR */
/* ========================= */

#sp-top-bar{
display:none;
}

/* ========================= */
/* PREMIUM SERVICE BUTTON */
/* ========================= */

.btn-service{
display:inline-block;
min-width:220px;
text-align:center;
border-radius:36px;
padding:14px 36px;
font-family:'Cinzel',serif;
font-size:14px;
letter-spacing:1.5px;
text-transform:uppercase;
font-weight:600;
transition:.35s ease;
text-decoration:none;
margin:12px 15px;
}

/* PRIMARY BUTTON */

.btn-service-primary{
background:linear-gradient(180deg,#0b1626,#08101c);
color:#e6c77b;
border:1px solid rgba(212,175,55,.35);
box-shadow:0 10px 30px rgba(0,0,0,.45);
}

.btn-service-primary:hover{
background:linear-gradient(180deg,#c9a24c,#b8963c);
color:#000;
transform:translateY(-2px);
box-shadow:0 18px 40px rgba(0,0,0,.55);
}

/* OUTLINE BUTTON */

.btn-service-outline{
background:transparent;
color:#0f1c2e;
border:2px solid #0f1c2e;
}

.btn-service-outline:hover{
background:#0f1c2e;
color:#fff;
transform:translateY(-2px);
}

/* ========================= */
/* LINK EFFECT */
/* ========================= */

a{
transition:.3s ease;
}

/* ========================= */
/* CONSULT BUTTON */
/* ========================= */

.btn-konsultasi{
display:inline-flex;
align-items:center;
gap:10px;
padding:14px 36px;
font-family:'Cinzel',serif;
font-size:16px;
font-weight:600;
letter-spacing:1px;
color:#fff;
text-decoration:none;
border-radius:36px;
background:linear-gradient(135deg,#c9a24c,#b8963c);
box-shadow:0 10px 30px rgba(0,0,0,.45);
transition:.35s ease;
}

.btn-konsultasi:hover{
transform:translateY(-3px);
box-shadow:0 16px 40px rgba(0,0,0,.55);
}

/* ========================= */
/* CTA SECTION */
/* ========================= */

.cta-section{
text-align:center;
padding:80px 20px;
}

.cta-title{
font-family:'Cinzel',serif;
font-size:28px;
margin-bottom:25px;
}

.cta-description{
font-family:'Cormorant Garamond',serif;
font-size:18px;
line-height:1.9;
max-width:700px;
margin:0 auto 40px auto;
}

/* ========================= */
/* PREMIUM BOX SHADOW */
/* ========================= */

div[style*="linear-gradient(145deg"]{
box-shadow:
0 25px 60px rgba(0,0,0,.45),
0 0 25px rgba(212,175,55,.15);
transition:.4s ease;
}

div[style*="linear-gradient(145deg"]:hover{
transform:translateY(-6px);
box-shadow:
0 35px 80px rgba(0,0,0,.55),
0 0 35px rgba(212,175,55,.25);
}

/* ========================= */
/* ARTICLE INFO */
/* ========================= */

.article-info{
font-size:20px !important;
color:#010101 !important;
font-weight:600 !important;
font-style:normal !important;
line-height:1.6;
}

.article-info .createdby:before{
content:"✍ ";
}

.article-info .category-name:before{
content:"📂 ";
}

.article-info .published:before{
content:"📅 ";
}

.article-info time:before{
content:"🕒 ";
}

.article-info,
.article-info span,
.article-info a,
.article-info time{
font-size:20px !important;
color:#010101 !important;
font-weight:600 !important;
font-style:normal !important;
}

/* ========================= */
/* MAIN BODY SPACING */
/* ========================= */

#sp-main-body{
padding-top:10px !important;
}

.item-page{
margin-top:-20px;
}

/* ========================= */
/* PAGE BUILDER SPACING */
/* ========================= */

#sp-page-builder .sppb-section{
margin-bottom:30px;
}

/* ========================= */
/* FOOTER */
/* ========================= */

.bm-footer{
width:100%;
display:flex;
justify-content:center;
padding:40px 0;
margin-top:20px;
}

.bm-footer-inner{
max-width:1140px;
width:100%;
margin:auto;
text-align:center;

padding:24px 30px;

background:#0b0b0b;
border:1px solid #c9a646;
border-radius:10px;

box-shadow:0 6px 18px rgba(0,0,0,0.35);

color:#d4af37;
font-family:Arial, sans-serif;
}

.bm-footer-title{
font-size:16px;
font-weight:700;
margin-bottom:6px;
}

.bm-footer-copy{
font-size:14px;
margin-bottom:6px;
}

.bm-footer-dev{
font-size:14px;
}

.bm-footer-dev a{
color:#e5c158;
text-decoration:none;
font-weight:600;
}

.bm-footer-dev a:hover{
color:#fff2b0;
}

/* ========================= */
/* RESPONSIVE FOOTER */
/* ========================= */

@media (max-width:768px){

.bm-footer{
padding:30px 10px;
}

.bm-footer-inner{
padding:18px 16px;
}

.bm-footer-title{
font-size:15px;
}

.bm-footer-copy,
.bm-footer-dev{
font-size:13px;
}

}

/* ========================= */
/* POST TITLE */
/* ========================= */

.post-title{
margin-bottom:20px !important;
}

/* ========================= */
/* BOTTOM MODULE ADJUST */
/* ========================= */

#sp-bottom1 .sp-module,
#sp-bottom2 .sp-module,
#sp-bottom3 .sp-module,
#sp-bottom4 .sp-module{
margin-top:-20px;
}

/* desktop */
#sp-bottom{
margin-top:-40px;
}

/* tablet */
@media (max-width:991px){
#sp-bottom{
margin-top:-30px;
}
}

/* hp */
@media (max-width:768px){
#sp-bottom{
margin-top:-40px;
}
}

/* hilangkan jarak kosong di atas slider - khusus HP */

@media (max-width:768px){

#sp-main-body{
padding-top:0 !important;
}

.sp-page-builder{
margin-top:-30px;
}

}



/* Kecilkan sedikit logo supaya menu muat */
#sp-header .logo img{
max-height:36px;
}

#sp-menu .sp-megamenu-parent > li > a{
color:#010101;
}

#sp-menu .sp-megamenu-parent > li > a:hover{
color:#c9a24c;
}

#sp-menu .sp-megamenu-parent > li.active > a{
color:#d4af37;
}

/* =========================
   FONT LUXURY
   ========================= */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;600;700&family=Cormorant+Garamond:wght@400;500;600&display=swap');

/* =========================
   WRAPPER
   ========================= */
.elite-faq {
  position: relative;
  isolation: isolate;
  overflow: hidden;

  max-width: 1200px;
  margin: -25px auto 0;
  padding: 35px 60px;

  background: radial-gradient(circle at top, #1a3b5d, #081a2c 70%);
  border-radius: 30px;

  box-shadow:
    0 30px 80px rgba(0,0,0,0.6),
    inset 0 0 60px rgba(255,255,255,0.03);

  color: #f8f8f8;
}

/* =========================
   BACKGROUND EFFECT
   ========================= */
.elite-faq::before,
.elite-faq::after {
  content: "";
  position: absolute;
  inset: -50%;
  z-index: 0;
  pointer-events: none;
}

.elite-faq::before {
  background: radial-gradient(circle at 30% 20%, rgba(255,255,255,0.08), transparent 60%);
  animation: moveLight 20s linear infinite;
}

.elite-faq::after {
  background: radial-gradient(circle at 70% 80%, rgba(212,175,55,0.08), transparent 60%);
  animation: moveLightReverse 25s linear infinite;
}

@keyframes moveLight {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes moveLightReverse {
  from { transform: rotate(360deg); }
  to { transform: rotate(0deg); }
}

/* =========================
   CONTAINER
   ========================= */
.elite-container {
  position: relative;
  z-index: 1;
  max-width: 760px;
  margin: 0 auto;
}

/* =========================
   HEADER TEXT
   ========================= */
.elite-eyebrow {
  text-align: center;
  font-family: 'Cormorant Garamond', serif;
  letter-spacing: 3px;
  opacity: 0.7;
  font-size: clamp(16px,2vw,20px);
}

.elite-title {
  text-align: center;
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px,5vw,52px);

  background: linear-gradient(90deg,#fff,#e6d3a3,#fff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

  position: relative;
  overflow: hidden;
}

.elite-title::after {
  content: "";
  position: absolute;
  top: 0;
  left: -120%;
  width: 50%;
  height: 100%;
  background: linear-gradient(110deg,transparent,rgba(255,255,255,0.7),rgba(255,215,150,0.6),transparent);
  animation: shimmerPro 5s infinite;
}

@keyframes shimmerPro {
  from { left: -120%; }
  to { left: 160%; }
}

.elite-divider {
  width: 100px;
  height: 2px;
  margin: 0 auto 40px;
  background: linear-gradient(90deg,transparent,#d4af37,transparent);
  box-shadow: 0 0 15px rgba(212,175,55,0.5);
}

/* =========================
   FAQ ITEMS
   ========================= */
.elite-item {
  position: relative;
  z-index: 1;

  background: rgba(255,255,255,0.04);
  border-radius: 18px;
  margin-bottom: 18px;
  overflow: hidden;

  backdrop-filter: blur(14px);

  box-shadow:
    0 15px 40px rgba(0,0,0,0.5),
    inset 0 0 30px rgba(255,255,255,0.04);

  transition: all 0.45s ease;

  opacity: 0;
  transform: translateY(40px);
  animation: reveal 0.8s ease forwards;
}

/* DELAY SAMPAI 12 ITEM */
.elite-item:nth-child(2){animation-delay:0.1s;}
.elite-item:nth-child(3){animation-delay:0.2s;}
.elite-item:nth-child(4){animation-delay:0.3s;}
.elite-item:nth-child(5){animation-delay:0.4s;}
.elite-item:nth-child(6){animation-delay:0.5s;}
.elite-item:nth-child(7){animation-delay:0.6s;}
.elite-item:nth-child(8){animation-delay:0.7s;}
.elite-item:nth-child(9){animation-delay:0.8s;}
.elite-item:nth-child(10){animation-delay:0.9s;}
.elite-item:nth-child(11){animation-delay:1.0s;}
.elite-item:nth-child(12){animation-delay:1.1s;}
.elite-item:nth-child(13){animation-delay:1.2s;}

@keyframes reveal {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.elite-item:hover {
  transform: translateY(-6px) scale(1.015);
  box-shadow:
    0 25px 60px rgba(0,0,0,0.6),
    0 0 30px rgba(212,175,55,0.2);
}

.elite-item::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 18px;
  background: linear-gradient(120deg,transparent,rgba(212,175,55,0.08),transparent);
  opacity: 0;
  transition: 0.4s;
}

.elite-item:hover::before {
  opacity: 1;
}

/* =========================
   QUESTION
   ========================= */
.elite-item label {
  display: block;
  padding: 22px 24px;
  cursor: pointer;

  font-family: 'Playfair Display', serif;
  font-size: clamp(20px,2.5vw,26px);
  font-weight: 600;

  position: relative;
}

.elite-item label::after {
  content: "›";
  position: absolute;
  right: 25px;
  font-size: 26px;
  transform: rotate(90deg);
  transition: 0.4s;
}

.elite-item input {
  display: none;
}

.elite-item input:checked + label::after {
  transform: rotate(270deg);
}

/* =========================
   CONTENT
   ========================= */
.elite-content {
  max-height: 0;
  overflow: hidden;

  padding: 0 24px;
  opacity: 0;

  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(18px,2.3vw,22px);
  line-height: 1.9;

  transform: translateY(-12px) scale(0.98);
  filter: blur(4px);

  transition: all 0.5s ease;
}

.elite-item input:checked ~ .elite-content {
  max-height: 1000px;
  padding: 10px 24px 24px;
  opacity: 1;

  transform: translateY(0) scale(1);
  filter: blur(0);
}

.elite-item input:checked + label {
  color: #f0d78c;
  text-shadow:
    0 0 8px rgba(212,175,55,0.6),
    0 0 20px rgba(212,175,55,0.3);
}

/* =========================
   LIST STYLE
   ========================= */
.elite-content ul {
  padding-left: 20px;
}

.elite-content li {
  margin-bottom: 8px;
}

/* =========================
   CTA WHATSAPP
   ========================= */
.elite-cta {
  text-align: center;
  margin-top: 40px;
}

.elite-cta p {
  font-family: 'Libre Baskerville', serif;
  font-size: 20px;
  margin-bottom: 15px;
  color: #eaeaea;
}

.elite-cta a {
  display: inline-block;
  padding: 14px 32px;
  border-radius: 40px;

  background: linear-gradient(135deg,#d4af37,#b8962e);
  color: #000;
  text-decoration: none;
  font-weight: 600;

  font-family: 'Cinzel', serif;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-size: 15px;

  box-shadow: 0 8px 20px rgba(0,0,0,0.35),
              0 0 10px rgba(212,175,55,0.35);

  transition: all 0.3s ease;
}

.elite-cta a:hover {
  background: linear-gradient(135deg,#c9a233,#a88427);
  box-shadow: 0 10px 25px rgba(0,0,0,0.45),
              0 0 14px rgba(212,175,55,0.5);
  transform: translateY(-2px);
}

  font-family: 'Playfair Display', serif;
  letter-spacing: 1px;
  font-size: 16px;

  box-shadow: 0 10px 30px rgba(37,211,102,0.4);
  transition: all 0.3s ease;
}

.elite-cta a:hover {
  transform: translateY(-3px);
  box-shadow: 0 20px 40px rgba(37,211,102,0.6);
}

/* =========================
   RESPONSIVE
   ========================= */
@media (max-width: 600px) {
  .elite-faq {
    padding: 25px 20px;
  }

  .elite-item label,
  .elite-content {
    text-align: center;
  }

  .elite-content ul {
    padding-left: 0;
    list-style-position: inside;
  }

  .elite-item label::after {
    right: 15px;
  }
}
