/* Lapaktoto.co — shared styles */

html { scroll-padding-top: 80px; }
body {
    background-color: #f7f4ee;
    color: #1c1a17;
    font-feature-settings: "ss01", "cv11";
}

::selection { background:#1c1a17; color:#f7f4ee; }

::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #f7f4ee; }
::-webkit-scrollbar-thumb { background: #c7c0b0; border-radius: 0; }
::-webkit-scrollbar-thumb:hover { background: #a87f47; }

.display {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 500;
    letter-spacing: -0.01em;
}

.eyebrow {
    font-size: 11px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: #8b6535;
    font-weight: 500;
}

.rule {
    display: inline-block;
    width: 28px;
    height: 1px;
    background: #a87f47;
    vertical-align: middle;
    margin-right: 10px;
}

.btn-ink {
    background: #1c1a17;
    color: #f7f4ee;
    transition: background .2s ease, transform .2s ease;
}
.btn-ink:hover { background: #2a2723; transform: translateY(-1px); }

.btn-outline {
    border: 1px solid #1c1a17;
    color: #1c1a17;
    background: transparent;
    transition: background .2s ease, color .2s ease;
}
.btn-outline:hover { background: #1c1a17; color: #f7f4ee; }

.card {
    background: #fdfbf6;
    border: 1px solid #e5dfd2;
    transition: transform .35s ease, box-shadow .35s ease;
}
.card:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 40px -24px rgba(20,18,16,0.25);
}

.nav-link {
    position: relative;
    color: #2a2723;
}
.nav-link::after {
    content: '';
    position: absolute;
    left: 0; bottom: -6px;
    width: 0; height: 1px;
    background: #1c1a17;
    transition: width .25s ease;
}
.nav-link:hover::after { width: 100%; }
.nav-link.is-active { color: #1c1a17; }
.nav-link.is-active::after { width: 100%; }

.prop-img {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* Real estate photos */
.prop-scbd        { background-image: url('https://images.unsplash.com/photo-1545324418-cc1a3fa10c00?auto=format&fit=crop&w=900&q=70'); }
.prop-menteng     { background-image: url('https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&w=900&q=70'); }
.prop-pik         { background-image: url('https://images.unsplash.com/photo-1613490493576-7fde63acd811?auto=format&fit=crop&w=900&q=70'); }
.prop-pondokindah { background-image: url('https://images.unsplash.com/photo-1600596542815-ffad4c1539a9?auto=format&fit=crop&w=900&q=70'); }
.prop-kemang      { background-image: url('https://images.unsplash.com/photo-1512917774080-9991f1c4c750?auto=format&fit=crop&w=900&q=70'); }
.prop-kelapagading{ background-image: url('https://images.unsplash.com/photo-1582268611958-ebfd161ef9cf?auto=format&fit=crop&w=900&q=70'); }
.prop-sudirman    { background-image: url('https://images.unsplash.com/photo-1551361415-69c87624334f?auto=format&fit=crop&w=900&q=70'); }
.prop-thamrin     { background-image: url('https://images.unsplash.com/photo-1493809842364-78817add7ffb?auto=format&fit=crop&w=900&q=70'); }

.hero-photo {
    background-image: linear-gradient(180deg, rgba(20,18,16,0) 0%, rgba(20,18,16,0.15) 60%, rgba(20,18,16,0.55) 100%),
                      url('https://images.unsplash.com/photo-1600585154526-990dced4db0d?auto=format&fit=crop&w=1600&q=80');
    background-size: cover;
    background-position: center;
}

.ticker {
    display: flex;
    gap: 3rem;
    animation: scroll-x 45s linear infinite;
    white-space: nowrap;
}
@keyframes scroll-x {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.area-link { color: #3d3a35; transition: color .2s ease; }
.area-link:hover { color: #8b6535; }

/* Breadcrumb */
.crumb-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    font-size: 12px;
    color: #6b665e;
    letter-spacing: 0.04em;
}
.crumb-list a:hover { color: #1c1a17; }
.crumb-sep { color: #c7c0b0; }

/* Prose for content-heavy pages */
.prose-property h2 {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 500;
    font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.2rem);
    color: #1c1a17;
    margin: 3rem 0 1rem;
    letter-spacing: -0.01em;
}
.prose-property h3 {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 500;
    font-size: 1.35rem;
    color: #1c1a17;
    margin: 2rem 0 0.75rem;
}
.prose-property p { color: #3d3a35; line-height: 1.7; margin-bottom: 1rem; font-size: 15px; }
.prose-property ul { margin: 0.75rem 0 1.25rem; padding-left: 1.2rem; color: #3d3a35; font-size: 15px; }
.prose-property ul li { margin-bottom: 0.4rem; line-height: 1.65; }
.prose-property ul li::marker { color: #a87f47; }
.prose-property a { color: #1c1a17; text-decoration: underline; text-decoration-color: #c9a874; text-underline-offset: 3px; }
.prose-property a:hover { color: #8b6535; }
.prose-property strong { color: #1c1a17; font-weight: 600; }