/* RL Residence Film — content refinement v5.1.0 */
:root {
    --rl-content-brown: #8b655d;
    --rl-content-brown-soft: #c9aaa2;
    --rl-content-brown-wash: rgba(139,101,93,.11);
    --rl-content-ease: cubic-bezier(.2,.72,.18,1);
}

/* Confidence strip: readable at a glance, animated as one continuous route. */
#mainContent .premium-trust-strip {
    position: relative;
    overflow: hidden;
}

#mainContent .premium-trust-strip::after {
    content: "";
    height: 2px;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    background: var(--rl-content-brown);
    transform: scaleX(var(--trust-progress,0));
    transform-origin: left;
    transition: transform 1.15s var(--rl-content-ease);
}

#mainContent .premium-trust-strip.content-visible { --trust-progress: 1; }

#mainContent .premium-trust-item {
    position: relative;
    transition: background-color .45s var(--rl-content-ease), padding-left .45s var(--rl-content-ease);
}

#mainContent .premium-trust-item::after {
    content: "";
    width: 5px;
    height: 5px;
    position: absolute;
    right: 20px;
    top: 50%;
    border: 1px solid var(--rl-content-brown);
    border-radius: 50%;
    opacity: 0;
    transform: translateY(-50%) scale(.4);
    transition: opacity .35s, transform .45s var(--rl-content-ease);
}

#mainContent .premium-trust-item:hover { background: var(--rl-content-brown-wash); }
#mainContent .premium-trust-item:hover::after { opacity: 1; transform: translateY(-50%) scale(1); }
#mainContent .premium-trust-item i { color: var(--rl-content-brown) !important; font-size: 14px !important; }
#mainContent .premium-trust-item strong { font-size: 15px !important; line-height: 1.25 !important; }
#mainContent .premium-trust-item span { margin-top: 4px; display: block; font-size: 10px !important; line-height: 1.45 !important; letter-spacing: .01em; }

/* Inventory: editorial image reveals, scroll depth and more legible metadata. */
#mainContent .properties-section { position: relative; overflow: hidden; }

#mainContent .properties-section::before {
    content: "";
    width: clamp(180px,24vw,390px);
    aspect-ratio: 1;
    position: absolute;
    right: -10vw;
    top: 4%;
    border: 1px solid rgba(139,101,93,.18);
    border-radius: 50%;
    box-shadow: 0 0 0 34px rgba(139,101,93,.035), 0 0 0 86px rgba(139,101,93,.02);
    pointer-events: none;
}

#mainContent .section-title-row { position: relative; }

#mainContent .section-title-row::after {
    content: "";
    width: 76px;
    position: absolute;
    right: 0;
    top: -1px;
    border-top: 3px solid var(--rl-content-brown);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .85s .12s var(--rl-content-ease);
}

#mainContent .section-title-row.content-visible::after { transform: scaleX(1); }
#mainContent .section-title-row h2 { padding-top: 0 !important; }
#mainContent .section-title-row h2::before { display: none !important; }
#mainContent .section-title-row h2 span {
    margin: 0 0 12px !important;
    display: block !important;
    color: var(--rl-content-brown) !important;
    font-size: 10px !important;
    line-height: 1.3 !important;
}
#mainContent .view-all { font-size: 10px !important; }
#mainContent .view-all i { margin-left: 9px; transition: transform .35s var(--rl-content-ease); }
#mainContent .view-all:hover i { transform: translateX(6px); }

#featuredProperties .property-card { --property-shift: 0px; }

#mainContent .property-image {
    isolation: isolate;
    clip-path: inset(0 0 0 0);
    transition: clip-path 1s var(--rl-content-ease), border-radius .5s var(--rl-content-ease) !important;
}

.content-motion-enabled #featuredProperties .property-card:not(.content-visible) .property-image { clip-path: inset(0 0 100% 0); }
.content-motion-enabled #featuredProperties .property-card.content-visible .property-image { clip-path: inset(0 0 0 0); }

#mainContent .property-image::after {
    content: "";
    position: absolute;
    inset: -25%;
    z-index: 3;
    pointer-events: none;
    background: linear-gradient(112deg,transparent 35%,rgba(255,255,255,.34) 48%,transparent 61%);
    transform: translateX(-75%) rotate(3deg);
    transition: transform 1.05s var(--rl-content-ease);
    mix-blend-mode: soft-light;
}

#mainContent .property-card:hover .property-image::after { transform: translateX(65%) rotate(3deg); }
#mainContent .property-image img { transform: translate3d(0,var(--property-shift),0) scale(1.065) !important; will-change: transform; }
#mainContent .property-card:hover .property-image img { transform: translate3d(0,var(--property-shift),0) scale(1.105) !important; }
#mainContent .property-badge,
#mainContent .property-code { font-size: 9px !important; }
#mainContent .property-price { font-size: 16px !important; }
#mainContent .property-type { color: var(--rl-content-brown) !important; font-size: 10px !important; line-height: 1.35 !important; }
#mainContent .property-location { font-size: 10px !important; line-height: 1.5 !important; letter-spacing: .045em !important; }
#mainContent .property-features .feature { font-size: 10px !important; line-height: 1.35 !important; }
#mainContent .property-features .feature i { color: var(--rl-content-brown) !important; }

#mainContent .property-content { position: relative; }
#mainContent .property-content::after {
    content: "↗";
    position: absolute;
    right: 0;
    top: 14px;
    color: var(--rl-content-brown);
    font-size: 18px;
    opacity: 0;
    transform: translate(-8px,8px);
    transition: opacity .35s, transform .45s var(--rl-content-ease);
}
#mainContent .property-card:hover .property-content::after { opacity: 1; transform: none; }

/* Institutional copy and process: readable text plus a progress spine. */
#mainContent .about-text::before { color: var(--rl-content-brown) !important; font-size: 10px !important; }
#mainContent .about-text p { font-size: 13px !important; line-height: 1.75 !important; }
#mainContent .about-features li { font-size: 11px !important; line-height: 1.5 !important; }

#mainContent .about-process {
    --process-progress: 0;
    position: relative;
    isolation: isolate;
    overflow: hidden;
}

#mainContent .about-process::before {
    content: "";
    width: 2px;
    position: absolute;
    left: clamp(20px,3vw,46px);
    top: 10%;
    bottom: 10%;
    z-index: 2;
    background: linear-gradient(to bottom,var(--rl-content-brown) 0 calc(var(--process-progress) * 100%),rgba(255,255,255,.12) calc(var(--process-progress) * 100%) 100%);
}

#mainContent .about-process::after {
    content: "NEGOCIAÇÃO / EM CURSO";
    position: absolute;
    right: 24px;
    bottom: 22px;
    color: rgba(255,255,255,.26);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .14em;
}

#mainContent .about-process > div {
    position: relative;
    z-index: 3;
    transition: padding-left .5s var(--rl-content-ease), background-color .5s var(--rl-content-ease), opacity .5s;
}

#mainContent .about-process > div::after {
    content: "";
    width: 7px;
    height: 7px;
    position: absolute;
    left: calc(clamp(20px,3vw,46px) - clamp(40px,6vw,90px) - 2px);
    top: 27px;
    border: 2px solid #171614;
    border-radius: 50%;
    background: rgba(255,255,255,.25);
    box-shadow: 0 0 0 1px rgba(255,255,255,.18);
    transition: transform .35s, background-color .35s;
}

#mainContent .about-process > div.is-active { padding-left: 12px; background: linear-gradient(90deg,rgba(139,101,93,.2),transparent 70%); }
#mainContent .about-process > div.is-active::after { background: var(--rl-content-brown-soft); transform: scale(1.35); }
#mainContent .about-process span { color: var(--rl-content-brown-soft) !important; font-size: 11px !important; }
#mainContent .about-process strong { font-size: 20px !important; line-height: 1.2 !important; }
#mainContent .about-process p { font-size: 12px !important; line-height: 1.65 !important; }

/* Services: a responsive operational list, not a generic card grid. */
#mainContent .services-section { position: relative; overflow: hidden; }
#mainContent .services-section .section-header {
    max-width: none !important;
    padding-top: 28px;
    position: relative;
}
#mainContent .services-section .section-header::before {
    position: absolute;
    left: 0;
    top: 0;
    line-height: 1;
}
#mainContent .services-section .section-header h2 {
    max-width: 820px;
    font-size: clamp(40px,4vw,56px) !important;
}
#mainContent .services-section .section-header p { font-size: 12px !important; line-height: 1.65 !important; }

#mainContent .service-card {
    --spot-x: 50%;
    --spot-y: 50%;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background:
        radial-gradient(380px circle at var(--spot-x) var(--spot-y),rgba(139,101,93,.18),transparent 64%),
        linear-gradient(90deg,rgba(139,101,93,.12),rgba(139,101,93,.025) 52%,transparent 74%) !important;
    background-size: 100% 100%, 0% 100% !important;
    background-repeat: no-repeat !important;
    transition: padding-left .5s var(--rl-content-ease), background-size .7s var(--rl-content-ease) !important;
}

#mainContent .service-card > * { position: relative; z-index: 2; }
#mainContent .service-card:hover,
#mainContent .service-card.is-active { padding-left: 18px !important; background-size: 100% 100%,100% 100% !important; }
#mainContent .service-card::before { color: var(--rl-content-brown) !important; font-size: 13px !important; }
#mainContent .service-card::after { color: var(--rl-content-brown) !important; transition: transform .45s var(--rl-content-ease), color .35s; }
#mainContent .service-card:hover::after { transform: translate(5px,-5px); color: var(--rl-ink) !important; }
#mainContent .service-card h3 { transition: transform .45s var(--rl-content-ease); }
#mainContent .service-card:hover h3 { transform: translateX(6px); }
#mainContent .service-card p { font-size: 12px !important; line-height: 1.65 !important; }

/* Footer typography and closing line. */
#mainContent .footer { position: relative; overflow: hidden; }
#mainContent .footer::before {
    content: "";
    height: 2px;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    background: linear-gradient(90deg,var(--rl-content-brown) 0 22%,rgba(255,255,255,.12) 22% 100%);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 1.1s var(--rl-content-ease);
}
#mainContent .footer.content-visible::before { transform: scaleX(1); }
#mainContent .footer-section h4 { color: var(--rl-content-brown-soft) !important; font-size: 10px !important; }
#mainContent .footer-section p,
#mainContent .footer-section a { font-size: 10.5px !important; line-height: 1.8 !important; }
#mainContent .footer-section a { transition: color .3s, padding-left .3s var(--rl-content-ease); }
#mainContent .footer-section li a:hover { padding-left: 5px; color: var(--rl-content-brown-soft) !important; }
#mainContent .footer-bottom { font-size: 9.5px !important; }

body.premium-floats-visible .premium-whatsapp,
body.premium-floats-visible .admin-trigger { background: var(--rl-content-brown) !important; }

/* JS-enabled entries are limited to content sections. */
.content-motion-enabled #mainContent .premium-trust-item,
.content-motion-enabled #mainContent .section-title-row,
.content-motion-enabled #mainContent .about-text,
.content-motion-enabled #mainContent .about-process,
.content-motion-enabled #mainContent .services-section .section-header,
.content-motion-enabled #mainContent .footer-grid {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .8s var(--rl-content-ease), transform .8s var(--rl-content-ease);
}

.content-motion-enabled #mainContent .premium-trust-item.content-visible,
.content-motion-enabled #mainContent .section-title-row.content-visible,
.content-motion-enabled #mainContent .about-text.content-visible,
.content-motion-enabled #mainContent .about-process.content-visible,
.content-motion-enabled #mainContent .services-section .section-header.content-visible,
.content-motion-enabled #mainContent .footer-grid.content-visible {
    opacity: 1;
    transform: none;
}

.content-motion-enabled #mainContent .premium-trust-item:nth-child(2) { transition-delay: .08s; }
.content-motion-enabled #mainContent .premium-trust-item:nth-child(3) { transition-delay: .16s; }

@media (max-width: 820px) {
    #mainContent .premium-trust-item::after { right: 8px; }
    #mainContent .section-title-row h2 span { font-size: 10px !important; }
    #mainContent .property-content::after { display: none; }
    #mainContent .about-text p { font-size: 12.5px !important; }
    #mainContent .about-process::before { left: 20px; }
    #mainContent .about-process > div::after { left: calc(20px - clamp(40px,6vw,90px) - 2px); }
    #mainContent .about-process > div { grid-template-columns: 38px 1fr; }
    #mainContent .about-process > div p { grid-column: 2; }
    #mainContent .about-process::after { font-size: 8px; }
    #mainContent .service-card p { font-size: 11.5px !important; }
}

@media (max-width: 540px) {
    #mainContent .premium-trust-item strong { font-size: 14px !important; }
    #mainContent .property-badge,
    #mainContent .property-code { font-size: 8.5px !important; }
    #mainContent .property-location,
    #mainContent .property-features .feature { font-size: 9.5px !important; }
    #mainContent .about-text::before { margin-bottom: 28px; }
    #mainContent .about-process { padding: 64px 26px !important; }
    #mainContent .about-process::before { display: none; }
    #mainContent .about-process > div::after { display: none; }
    #mainContent .about-process > div { grid-template-columns: 34px 1fr; gap: 10px; }
    #mainContent .about-process strong { font-size: 18px !important; }
    #mainContent .about-process p { font-size: 11.5px !important; }
    #mainContent .service-card:hover,
    #mainContent .service-card.is-active { padding-left: 8px !important; }
    #mainContent .footer-section p,
    #mainContent .footer-section a { font-size: 11px !important; }
}

@media (prefers-reduced-motion: reduce) {
    #mainContent .property-image img { transform: scale(1.02) !important; }
    .content-motion-enabled #mainContent .premium-trust-item,
    .content-motion-enabled #mainContent .section-title-row,
    .content-motion-enabled #mainContent .about-text,
    .content-motion-enabled #mainContent .about-process,
    .content-motion-enabled #mainContent .services-section .section-header,
    .content-motion-enabled #mainContent .footer-grid { opacity: 1; transform: none; }
}
