/* Tema Black & Gold - PT. Raja VIP */
:root{
  --black:#0A0A0A; --charcoal:#1A1A1A; --charcoal2:#232323;
  --gold:#D4AF37; --gold-light:#F0D77A; --gold-dark:#A67C00; --cream:#E8D9A8;
  --text:#F5F5F5; --muted:#9A9A9A; --paper:#F7F5EF;
  --gold-grad:linear-gradient(135deg,#F0D77A 0%,#D4AF37 50%,#A67C00 100%);
  --bs-primary:#D4AF37; --bs-primary-rgb:212,175,55;
}
body{font-family:'Poppins','Inter',system-ui,sans-serif}
.font-display{font-family:'Cinzel','Playfair Display',Georgia,serif;letter-spacing:.04em}
.text-gold{color:var(--gold)!important}
.bg-black-gold{background:var(--black)}
.btn-gold{background:var(--gold-grad);border:0;color:#111;font-weight:600;transition:.2s}
.btn-gold:hover{filter:brightness(1.08);color:#000;transform:translateY(-1px)}
.btn-outline-gold{border:1px solid var(--gold);color:var(--gold);background:transparent}
.btn-outline-gold:hover{background:var(--gold);color:#111}
.badge-st{font-weight:500;font-size:.72rem}
.badge.bg-warning{color:#222!important}

/* ===== Public (gelap) ===== */
body.public{background:var(--black);color:var(--text)}
body.public a{color:var(--gold)}
body.public a:hover{color:var(--gold-light)}
.navbar-rv{background:rgba(10,10,10,.96);border-bottom:1px solid rgba(212,175,55,.35)}
.navbar-rv .nav-link{color:#ddd;font-weight:500}
.navbar-rv .nav-link:hover,.navbar-rv .nav-link.active{color:var(--gold)}
.navbar-rv .navbar-brand{color:var(--gold);font-family:'Cinzel',serif;font-weight:700}
.navbar-rv img{height:46px;width:46px;border-radius:50%}
.hero{background:radial-gradient(ellipse at top,#2a2108 0%,#0A0A0A 65%);padding:90px 0 70px;border-bottom:1px solid rgba(212,175,55,.25)}
.hero h1{font-family:'Cinzel',serif;font-weight:700;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p.lead{color:var(--cream)}
.gold-line{height:3px;width:80px;background:var(--gold-grad);border-radius:3px;margin:14px 0 22px}
.card-rv{background:var(--charcoal);border:1px solid rgba(212,175,55,.3);border-radius:14px;color:var(--text);overflow:hidden;transition:.25s}
.card-rv:hover{border-color:var(--gold);transform:translateY(-3px);box-shadow:0 10px 28px rgba(212,175,55,.12)}
.card-rv .car-img{height:190px;width:100%;object-fit:cover;background:#111}
.card-rv .price{color:var(--gold);font-weight:700;font-size:1.15rem}
.section-title{font-family:'Cinzel',serif;color:var(--gold);font-weight:700}
.box-dark{background:var(--charcoal);border:1px solid rgba(212,175,55,.3);border-radius:14px;padding:26px}
.form-dark .form-control,.form-dark .form-select{background:#111;border:1px solid #3a3a3a;color:#fff}
.form-dark .form-control:focus,.form-dark .form-select:focus{border-color:var(--gold);box-shadow:0 0 0 .2rem rgba(212,175,55,.2);background:#111;color:#fff}
.form-dark label{color:var(--cream);font-size:.88rem;margin-bottom:4px}
.form-dark .form-text,.text-muted-d{color:var(--muted)!important}
.form-dark .form-control::placeholder{color:#666}
.step-no{width:44px;height:44px;border-radius:50%;background:var(--gold-grad);color:#111;font-weight:700;display:flex;align-items:center;justify-content:center;flex:none}
footer.site{background:#050505;border-top:1px solid rgba(212,175,55,.35);color:#bbb}
footer.site h6{color:var(--gold);font-family:'Cinzel',serif}
.wa-float{position:fixed;right:18px;bottom:18px;background:#25D366;color:#fff!important;width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:28px;box-shadow:0 6px 18px rgba(0,0,0,.4);z-index:99}
body.public .table{--bs-table-bg:transparent;--bs-table-color:var(--text);--bs-table-border-color:#333}
body.public .alert{border-radius:10px}
.price-box{background:#111;border:1px dashed var(--gold);border-radius:12px;padding:16px}
.tab-gold .nav-link{color:var(--cream)}
.tab-gold .nav-link.active{background:var(--gold-grad);color:#111;font-weight:600}

/* ===== Admin (konten terang) ===== */
body.admin{background:var(--paper);color:#222}
.sidebar{width:250px;background:var(--black);min-height:100vh;position:fixed;top:0;left:0;bottom:0;overflow-y:auto;border-right:2px solid var(--gold-dark);z-index:1030;transition:.25s}
.sidebar .brand{padding:18px;border-bottom:1px solid #2a2a2a;display:flex;gap:10px;align-items:center;color:var(--gold);font-family:'Cinzel',serif;font-weight:700;line-height:1.15;text-decoration:none}
.sidebar .brand img{width:44px;height:44px;border-radius:50%}
.sidebar .menu-label{color:#6f6f6f;font-size:.7rem;letter-spacing:.12em;padding:14px 20px 4px;text-transform:uppercase}
.sidebar a.item{display:flex;align-items:center;gap:10px;padding:10px 20px;color:#cfcfcf;text-decoration:none;border-left:3px solid transparent;font-size:.92rem}
.sidebar a.item:hover{background:#171717;color:var(--gold-light)}
.sidebar a.item.active{background:linear-gradient(90deg,rgba(212,175,55,.22),transparent);color:var(--gold);border-left-color:var(--gold);font-weight:600}
.admin-main{margin-left:250px;min-height:100vh}
.topbar{background:#fff;border-bottom:3px solid var(--gold);padding:12px 24px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:1020}
.admin-main .content{padding:24px}
.card-a{background:#fff;border:0;border-radius:12px;box-shadow:0 2px 10px rgba(0,0,0,.06);border-top:3px solid var(--gold)}
.stat{background:#fff;border-radius:12px;padding:18px;box-shadow:0 2px 10px rgba(0,0,0,.06);border-left:5px solid var(--gold)}
.stat .v{font-size:1.45rem;font-weight:700}
.stat .l{color:#777;font-size:.82rem}
.table-a thead th{background:#111;color:var(--gold);font-weight:500;font-size:.85rem;white-space:nowrap}
.table-a td{vertical-align:middle;font-size:.9rem}
.page-title{font-family:'Cinzel',serif;font-weight:700;margin:0}
.car-thumb{width:64px;height:44px;object-fit:cover;border-radius:6px;background:#111}
.tl-wrap{overflow-x:auto}
.tl{border-collapse:collapse;min-width:100%;font-size:.78rem}
.tl th,.tl td{border:1px solid #e5e0d0;padding:0;height:34px}
.tl th{background:#111;color:var(--gold);text-align:center;min-width:34px;font-weight:500}
.tl th.we{background:#3a2e06}
.tl td.carname{background:#fff;padding:4px 10px;min-width:190px;position:sticky;left:0;z-index:2;white-space:nowrap;font-weight:600}
.tl th.carname{position:sticky;left:0;z-index:3}
.tl .bk{display:block;height:100%;padding:2px 4px;color:#111;overflow:hidden;white-space:nowrap;font-size:.7rem;text-decoration:none}
.bk-menunggu_dp{background:#ffe08a}.bk-dikonfirmasi{background:#9fd4f5}.bk-berjalan{background:#b9a0f0}.bk-selesai{background:#a8e0b4}
.tl td.today{box-shadow:inset 0 0 0 2px var(--gold)}
@media(max-width:991px){.sidebar{left:-260px}.sidebar.show{left:0}.admin-main{margin-left:0}}
@media print{.sidebar,.topbar,.no-print{display:none!important}.admin-main{margin:0}}

/* Perbaikan kontras tombol pada tautan di halaman publik */
body.public a.btn-gold,body.public a.btn-gold:hover{color:#111}
body.public a.btn-outline-gold{color:var(--gold)}
body.public a.btn-outline-gold:hover{color:#111}
body.public a.btn-outline-secondary{color:#bbb}
body.public a.btn-outline-secondary:hover{color:#fff}

/* Bar kontak atas, peta, foto hero */
.topbar-contact{background:#050505;border-bottom:1px solid rgba(212,175,55,.2)}
.cbox{display:flex;align-items:center;gap:10px;border:1px solid rgba(212,175,55,.45);border-radius:10px;padding:5px 12px;color:var(--text)!important;text-decoration:none;transition:.2s}
.cbox:hover{border-color:var(--gold);background:#141414}
.cbox i{font-size:1.4rem;color:var(--gold)}
.cbox span{display:flex;flex-direction:column;line-height:1.15}
.cbox small{color:var(--muted);font-size:.68rem}
.cbox b{font-size:.8rem;font-weight:600;color:#fff}
.map-wrap{height:100%;min-height:340px;border:1px solid rgba(212,175,55,.45);border-radius:14px;overflow:hidden;background:#111}
.map-wrap iframe{width:100%;height:100%;min-height:340px;border:0;filter:grayscale(.15) contrast(1.05)}
.hero-photo{border:1px solid rgba(212,175,55,.5);box-shadow:0 0 50px rgba(212,175,55,.18)}

/* Hero gambar penuh */
.hero-full{position:relative;background:#000;border-bottom:1px solid rgba(212,175,55,.35)}
.hero-full img{display:block;width:100%;height:auto;min-height:200px;object-fit:cover}
.hero-full::after{content:"";position:absolute;left:0;right:0;bottom:0;height:35%;background:linear-gradient(to top,rgba(0,0,0,.75),transparent);pointer-events:none}
.hero-cta{position:absolute;left:0;right:0;bottom:4%;z-index:2;display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.hero-cta .btn-outline-gold{background:rgba(0,0,0,.55)}
.hero-text{padding:42px 0 10px}
.hero-text h1{font-family:'Cinzel',serif;font-weight:700;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-text .lead{color:var(--cream)}
@media(max-width:575px){.hero-cta .btn-lg{padding:.4rem .8rem;font-size:.9rem}.hero-cta{bottom:3%}}

/* ===== Animasi & sentuhan visual (publik) ===== */
html{scroll-behavior:smooth}
@keyframes fadeUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.08)}}
@keyframes shimmer{0%{transform:translateX(-120%) skewX(-20deg)}60%,100%{transform:translateX(220%) skewX(-20deg)}}
@keyframes pulseRing{0%{box-shadow:0 0 0 0 rgba(37,211,102,.55)}70%{box-shadow:0 0 0 18px rgba(37,211,102,0)}100%{box-shadow:0 0 0 0 rgba(37,211,102,0)}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes goldglow{0%,100%{text-shadow:0 0 0 rgba(212,175,55,0)}50%{text-shadow:0 0 18px rgba(212,175,55,.45)}}
@keyframes lineGrow{from{width:0}to{width:80px}}

body.public{animation:pageIn .6s ease both}
@keyframes pageIn{from{opacity:0}to{opacity:1}}

/* Scroll reveal */
.rv{opacity:0;transform:translateY(34px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.rv.in{opacity:1;transform:none}
.rv-left{transform:translateX(-40px)}.rv-right{transform:translateX(40px)}
.rv-left.in,.rv-right.in{transform:none}

/* Navbar */
.navbar-rv{transition:padding .3s,background .3s,box-shadow .3s;backdrop-filter:blur(8px)}
.navbar-rv.scrolled{box-shadow:0 6px 24px rgba(0,0,0,.6);background:rgba(5,5,5,.97)}
.navbar-rv img{transition:transform .5s}
.navbar-rv .navbar-brand:hover img{transform:rotate(360deg)}
.navbar-rv .nav-link{position:relative}
.navbar-rv .nav-link::after{content:"";position:absolute;left:12%;right:12%;bottom:2px;height:2px;background:var(--gold-grad);transform:scaleX(0);transition:transform .3s;transform-origin:left}
.navbar-rv .nav-link:hover::after,.navbar-rv .nav-link.active::after{transform:scaleX(1)}

/* Hero */
.hero-full{overflow:hidden}
.hero-full img{animation:kenburns 14s ease-in-out infinite alternate}
.hero-cta .btn{animation:fadeUp .9s .5s both}
.hero-cta .btn+.btn{animation-delay:.7s}
.hero-text .badge,.hero-text h1,.hero-text .gold-line,.hero-text .lead{animation:fadeUp .8s both}
.hero-text h1{animation-delay:.15s}.hero-text .gold-line{animation:lineGrow 1s .4s both}.hero-text .lead{animation-delay:.45s}
.hero-text h1{animation:fadeUp .8s .15s both,goldglow 4s 1.5s infinite}

/* Tombol emas berkilau */
.btn-gold{position:relative;overflow:hidden;box-shadow:0 4px 14px rgba(212,175,55,.25)}
.btn-gold::after{content:"";position:absolute;top:0;left:0;width:40%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:translateX(-120%) skewX(-20deg)}
.btn-gold:hover::after{animation:shimmer .9s}
.btn-gold:hover{box-shadow:0 8px 22px rgba(212,175,55,.45)}
.btn-outline-gold{transition:.25s}
.btn-outline-gold:hover{box-shadow:0 6px 18px rgba(212,175,55,.3);transform:translateY(-2px)}

/* Kartu */
.card-rv{position:relative}
.card-rv .img-wrap{overflow:hidden;position:relative}
.card-rv .car-img{transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.card-rv:hover .car-img{transform:scale(1.09)}
.card-rv .img-wrap::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(to top,rgba(26,26,26,1),transparent)}
.card-rv .tag{position:absolute;top:12px;left:12px;z-index:2;background:rgba(0,0,0,.7);border:1px solid var(--gold);color:var(--gold);font-size:.72rem;padding:3px 10px;border-radius:20px;backdrop-filter:blur(4px)}
.card-rv:hover{box-shadow:0 14px 34px rgba(212,175,55,.18)}
.box-dark{transition:transform .3s,border-color .3s,box-shadow .3s}
.box-dark:hover{transform:translateY(-4px);border-color:var(--gold);box-shadow:0 12px 28px rgba(212,175,55,.12)}
.box-dark>i.bi{display:inline-block;transition:transform .4s}
.box-dark:hover>i.bi{transform:scale(1.2) rotate(-6deg);animation:floaty 1.6s infinite}
form.box-dark:hover,.price-box,.box-dark.no-lift:hover{transform:none}

/* Statistik */
.stats{background:linear-gradient(180deg,#0f0c03,#0A0A0A);border-top:1px solid rgba(212,175,55,.25);border-bottom:1px solid rgba(212,175,55,.25)}
.stats .num{font-family:'Cinzel',serif;font-size:2.6rem;font-weight:700;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1}
.stats .lbl{color:var(--cream);font-size:.85rem;letter-spacing:.08em;text-transform:uppercase}
.stats .col-6,.stats .col-md-3{position:relative}

/* Marquee */
.marquee{overflow:hidden;background:var(--gold-grad);color:#111;padding:9px 0;border-top:1px solid #6b5200;border-bottom:1px solid #6b5200}
.marquee .track{display:flex;width:max-content;animation:marquee 32s linear infinite}
.marquee:hover .track{animation-play-state:paused}
.marquee span{font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:.82rem;padding:0 28px;white-space:nowrap}
.marquee span::after{content:"\2726";margin-left:56px;opacity:.7}

/* Judul bagian */
.section-title{position:relative;display:inline-block}
.gold-line{position:relative;overflow:hidden}
.gold-line::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,#fff,transparent);transform:translateX(-100%);animation:shimmer 3.5s 1s infinite}

/* WhatsApp & kembali ke atas */
.wa-float{animation:pulseRing 2.2s infinite;transition:transform .25s}
.wa-float:hover{transform:scale(1.12) rotate(-8deg)}
.to-top{position:fixed;right:20px;bottom:84px;width:44px;height:44px;border-radius:50%;background:var(--charcoal);border:1px solid var(--gold);color:var(--gold);display:flex;align-items:center;justify-content:center;z-index:98;opacity:0;pointer-events:none;transform:translateY(10px);transition:.3s;cursor:pointer}
.to-top.show{opacity:1;pointer-events:auto;transform:none}
.to-top:hover{background:var(--gold);color:#111}

/* Bar kontak */
.cbox i{transition:transform .35s}
.cbox:hover i{transform:scale(1.2) rotate(-8deg)}

/* Form */
.form-dark .form-control,.form-dark .form-select{transition:border-color .25s,box-shadow .25s,transform .2s}
.form-dark .form-control:focus,.form-dark .form-select:focus{transform:translateY(-1px)}
.step-no{transition:transform .4s}.box-dark:hover .step-no{transform:rotate(360deg) scale(1.08)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
}