:root { color-scheme: light; }
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
.hero { background-image: url('https://images.unsplash.com/photo-1494905998402-395d579af36f?auto=format&fit=crop&w=2200&q=85'); background-position: center; background-size: cover; }
#site-header.scrolled { top: 0; background: rgba(9, 19, 31, .94); backdrop-filter: blur(16px); box-shadow: 0 8px 24px rgba(0,0,0,.18); }
.page-header { background: rgba(9, 19, 31, .96); box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.nav-link { transition: color .2s ease; }.nav-link:hover { color: #fb923c; }
.active-nav { color:#fb923c; }
#menu-button span { display:block; width:17px; height:1.5px; margin:3px; background:currentColor; transition:.2s; }
#menu-button.open span:nth-child(1) { transform:translateY(4.5px) rotate(45deg); } #menu-button.open span:nth-child(2) { opacity:0; } #menu-button.open span:nth-child(3) { transform:translateY(-4.5px) rotate(-45deg); }
.mobile-link { display:block; border-radius:.75rem; padding:.75rem 1rem; font-size:.875rem; font-weight:700; color:#1b2a3a; }.mobile-link:hover { background:#fff1eb; color:#f15a24; }
.glass-card { border: 1px solid rgba(255,255,255,.17); background: rgba(20, 35, 50, .64); box-shadow: 0 20px 50px rgba(0,0,0,.2); backdrop-filter: blur(14px); }
.marquee-stack { display:grid; gap:1rem; }
.marquee-window { overflow:hidden; position:relative; mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent); -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent); }
.marquee-track { display:flex; width:max-content; }
.marquee-row-left .marquee-track { animation:brand-scroll-left 42s linear infinite; }
.marquee-row-right .marquee-track { animation:brand-scroll-right 42s linear infinite; }
.marquee-set { display:flex; align-items:center; gap:2.2rem; padding-right:2.2rem; }
.brand-logo { display:flex; min-width:76px; flex-direction:column; align-items:center; justify-content:center; gap:.45rem; color:#475569; }
.brand-logo img { height:42px; width:42px; object-fit:contain; opacity:.9; transition:transform .2s; }
.brand-logo span { font-size:.62rem; font-weight:700; white-space:nowrap; }
.brand-logo:hover img { transform:translateY(-2px); }
@keyframes brand-scroll-left { from { transform:translateX(0); } to { transform:translateX(-50%); } }
@keyframes brand-scroll-right { from { transform:translateX(-50%); } to { transform:translateX(0); } }
.eyebrow { color:#f15a24; font-size:.7rem; font-weight:800; letter-spacing:.18em; }.section-title { margin-top:.6rem; font-family:'Plus Jakarta Sans',sans-serif; font-size:clamp(2rem,4vw,3.25rem); font-weight:800; letter-spacing:-.055em; line-height:1.12; }
.filter { border-radius:9999px; border:1px solid #e2e8f0; background:white; padding:.65rem 1rem; font-size:.78rem; font-weight:700; color:#475569; transition:.2s; }.filter:hover,.filter.active { border-color:#f15a24; background:#f15a24; color:white; }
.car-card { display:flex; height:100%; flex-direction:column; overflow:hidden; border-radius:1rem; background:#fff; box-shadow:0 3px 12px rgba(15,23,42,.06); transition:transform .25s ease, box-shadow .25s ease; }.car-card > .p-5 { display:flex; flex:1; flex-direction:column; }.car-card > .p-5 > a { margin-top:auto !important; }.car-card:hover { transform:translateY(-6px); box-shadow:0 18px 28px rgba(15,23,42,.12); }.car-card.hidden-card { display:none; }
.car-image { position:relative; height:220px; background-position:center; background-size:cover; }.car-image::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 30%,rgba(9,19,31,.48)); }.car-image span { position:absolute; z-index:1; bottom:1rem; left:1rem; border:1px solid rgba(255,255,255,.25); border-radius:999px; background:rgba(9,19,31,.48); padding:.38rem .65rem; font-size:.62rem; font-weight:700; letter-spacing:.09em; color:#fff; backdrop-filter:blur(6px); }.image-alphard { background-image:url('https://images.unsplash.com/photo-1566473965997-3de9c817e938?auto=format&fit=crop&w=900&q=80'); }.image-harrier { background-image:url('https://images.unsplash.com/photo-1503376780353-7e6692767b70?auto=format&fit=crop&w=900&q=80'); }.image-crown { background-image:url('https://images.unsplash.com/photo-1555215695-3004980ad54e?auto=format&fit=crop&w=900&q=80'); }
.listing-car-image { background:linear-gradient(135deg,#dbe4ef,#eff3f7); }.listing-car-image img { position:absolute; inset:0; height:100%; width:100%; object-fit:cover; }.listing-car-image.image-unavailable::before { content:'Gambar kereta belum ada'; position:absolute; inset:0; display:grid; place-items:center; font-size:.8rem; font-weight:700; color:#64748b; }.listing-lightbox-trigger { cursor:zoom-in; touch-action:manipulation; }.listing-lightbox-trigger:focus-visible { outline:3px solid #f15a24; outline-offset:3px; }.listing-lightbox-trigger::before { content:'Tekan untuk besarkan'; position:absolute; z-index:2; top:1rem; right:1rem; border-radius:999px; background:rgba(9,19,31,.62); padding:.35rem .55rem; font-size:.62rem; font-weight:700; color:#fff; opacity:0; transform:translateY(-3px); transition:.2s; backdrop-filter:blur(6px); }.listing-lightbox-trigger:hover::before,.listing-lightbox-trigger:focus-visible::before { opacity:1; transform:translateY(0); }.listing-title { min-height:3.2rem; line-height:1.6rem; }.listing-specification { position:relative; height:4.75rem; min-height:4.75rem; overflow:hidden; line-height:1.5rem; }.listing-specification p { display:inline; max-height:none; overflow:visible; line-height:1.5rem; }.listing-specification p.is-expanded { display:inline; max-height:none; overflow:visible; }.see-more { position:static; display:inline; margin:0 0 0 .35rem; color:#f15a24; font-size:.75rem; font-weight:700; white-space:nowrap; }.see-more:hover { color:#c2410c; }.listing-specification.is-expanded { height:auto; min-height:0; overflow:visible; padding-bottom:0; }.listing-meta { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; min-height:4.1rem; font-size:.75rem; color:#64748b; }.listing-meta-details { display:grid; gap:.25rem; }.listing-meta strong { color:#f15a24; font-family:'Plus Jakarta Sans',sans-serif; font-size:.92rem; white-space:nowrap; }.listing-status.hidden { display:none; }
.benefit { min-height:195px; border:1px solid rgba(255,255,255,.12); border-radius:1rem; padding:1.6rem; background:rgba(255,255,255,.04); }.benefit b { color:#fb923c; font-family:'Plus Jakarta Sans',sans-serif; font-size:.75rem; }.benefit h3 { margin-top:2.2rem; font-family:'Plus Jakarta Sans',sans-serif; font-size:1.05rem; font-weight:700; color:#fff; }.benefit p { margin-top:.65rem; font-size:.875rem; line-height:1.5rem; color:#94a3b8; }
.step { position:relative; padding-top:1.1rem; border-top:1px solid #cbd5e1; }.step span { display:grid; place-items:center; width:2.35rem; height:2.35rem; border-radius:999px; background:#f15a24; font-family:'Plus Jakarta Sans',sans-serif; font-size:.75rem; font-weight:800; color:white; }.step h3 { margin-top:1.2rem; font-family:'Plus Jakarta Sans',sans-serif; font-weight:800; font-size:1.1rem; }.step p { max-width:18rem; margin-top:.6rem; font-size:.9rem; line-height:1.6rem; color:#64748b; }
.cta-panel { background:radial-gradient(circle at 75% 20%,rgba(241,90,36,.55),transparent 30%),linear-gradient(120deg,#09131f,#1b2a3a); }
.inner-hero { background:radial-gradient(circle at 80% 25%,rgba(241,90,36,.26),transparent 32%),linear-gradient(120deg,#09131f,#1b2a3a); }
.owner-image { min-height:410px; background:url('assets/owner-image/ownerimage.png') center/cover; }
.image-vellfire { background-image:url('https://images.unsplash.com/photo-1549317661-bd32c8ce0db2?auto=format&fit=crop&w=900&q=80'); }.image-rav4 { background-image:url('https://images.unsplash.com/photo-1511919884226-fd3cad34687c?auto=format&fit=crop&w=900&q=80'); }.image-camry { background-image:url('https://images.unsplash.com/photo-1492144534655-ae79c964c9d7?auto=format&fit=crop&w=900&q=80'); }
.gallery-grid { display:grid; grid-template-columns:repeat(12,1fr); grid-auto-rows:130px; gap:1rem; }.gallery-item { border-radius:1.25rem; background-position:center; background-size:cover; cursor:zoom-in; transition:transform .25s,filter .25s; }.gallery-item:hover { filter:brightness(.82); transform:scale(.985); }.gallery-one { grid-column:span 7; grid-row:span 3; background-image:url('assets/gallery/WhatsApp%20Image%202026-07-23%20at%209.27.57%20PM.jpeg'); }.gallery-two { grid-column:span 5; grid-row:span 3; background-image:url('assets/gallery/WhatsApp%20Image%202026-07-23%20at%2010.33.27%20PM.jpeg'); }.gallery-three { grid-column:span 6; grid-row:span 2; background-image:url('assets/gallery/WhatsApp%20Image%202026-07-23%20at%2010.34.07%20PM.jpeg'); }.gallery-four { grid-column:span 6; grid-row:span 2; background-image:url('assets/gallery/WhatsApp%20Image%202026-07-23%20at%2010.34.42%20PM.jpeg'); }
.lightbox { position:fixed; z-index:100; inset:0; display:grid; place-items:center; padding:2rem; background:rgba(2,6,12,.92); }.lightbox img { max-height:90vh; max-width:100%; border-radius:1rem; object-fit:contain; }.lightbox button { position:absolute; top:1.25rem; right:1.5rem; color:white; font-size:2.5rem; line-height:1; }.form-label { display:block; margin-top:1.25rem; margin-bottom:.45rem; font-size:.8rem; font-weight:700; color:#334155; }.form-input { display:block; width:100%; border:1px solid #e2e8f0; border-radius:.75rem; padding:.8rem 1rem; font:inherit; font-size:.9rem; outline:none; transition:border-color .2s,box-shadow .2s; }.form-input:focus { border-color:#f15a24; box-shadow:0 0 0 3px rgba(241,90,36,.12); }
.faq { border-radius:1rem; border:1px solid #e2e8f0; padding:0 1.25rem; }.faq summary { display:flex; cursor:pointer; align-items:center; justify-content:space-between; gap:1rem; padding:1.2rem 0; font-size:.95rem; font-weight:700; list-style:none; }.faq summary::-webkit-details-marker { display:none; }.faq summary span { color:#f15a24; font-size:1.35rem; font-weight:400; transition:.2s; }.faq[open] summary span { transform:rotate(45deg); }.faq p { padding:0 1.5rem 1.25rem 0; font-size:.9rem; line-height:1.55rem; color:#64748b; }
.whatsapp-float { position:fixed; z-index:40; right:1.25rem; bottom:1.25rem; display:grid; width:3.5rem; height:3.5rem; place-items:center; border:3px solid white; border-radius:999px; background:#25d366; color:white; box-shadow:0 10px 25px rgba(0,0,0,.25); transition:.2s; }.whatsapp-float:hover { transform:scale(1.08); }.whatsapp-float svg { width:1.9rem; height:1.9rem; }
@media (max-width: 640px) { .hero { min-height:720px; background-position:62% center; }.section-title { letter-spacing:-.045em; }.top-strip { min-height:38px; }.car-image { height:200px; }.owner-image { min-height:320px; background-size:110% auto; background-position:center 35%; }.gallery-grid { grid-auto-rows:100px; gap:.7rem; }.gallery-one { grid-column:span 12; grid-row:span 3; }.gallery-two { grid-column:span 12; grid-row:span 3; }.gallery-three,.gallery-four { grid-column:span 6; grid-row:span 2; } }
