/* RL Residence Film — Homecraft principle adapted for real estate, v5.0.0 */

#mainContent .residence-hero {
    min-height: 100svh !important;
    padding: 0 !important;
    display: block !important;
    position: relative;
    isolation: isolate;
    overflow: hidden !important;
    background: #0b0b0a !important;
    color: white !important;
}

.residence-scene {
    --scene-x: 0px;
    --scene-y: 0px;
    position: absolute;
    inset: 0;
    z-index: -1;
    overflow: hidden;
    background: #0b0b0a;
}

.residence-scene__base,
.residence-scene__reveal {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    object-fit: cover;
    object-position: center;
    transform: translate3d(var(--scene-x),var(--scene-y),0) scale(1.045);
    transition: transform .8s cubic-bezier(.2,.75,.2,1);
    will-change: transform,clip-path;
}

.residence-scene__base {
    filter: grayscale(.82) saturate(.32) brightness(.58) contrast(1.08);
    animation: residence-camera 18s ease-in-out infinite alternate;
}

.residence-scene__reveal {
    filter: saturate(.72) brightness(.82) contrast(1.04);
    clip-path: inset(0 100% 0 0);
    animation: residence-reveal 13s cubic-bezier(.72,0,.2,1) infinite,residence-camera 18s ease-in-out infinite alternate;
}

.residence-scene__shade {
    position: absolute;
    inset: 0;
    z-index: 4;
    pointer-events: none;
    background:
        linear-gradient(90deg,rgba(7,9,10,.9) 0%,rgba(7,9,10,.7) 25%,rgba(7,9,10,.23) 55%,rgba(7,9,10,.2) 100%),
        linear-gradient(0deg,rgba(7,8,8,.8) 0%,transparent 32%,rgba(7,8,8,.18) 70%,rgba(7,8,8,.48) 100%);
}

.residence-blueprint {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    z-index: 3;
    overflow: visible;
    pointer-events: none;
    transform: translate3d(var(--scene-x),var(--scene-y),0) scale(1.045);
    transform-origin: center;
    transition: transform .8s cubic-bezier(.2,.75,.2,1);
    filter: drop-shadow(0 0 7px rgba(226,220,207,.15));
    animation: blueprint-cycle 13s ease-in-out infinite,blueprint-camera 18s ease-in-out infinite alternate;
}

.residence-blueprint path,
.residence-blueprint circle {
    fill: none;
    stroke: rgba(226,220,207,.72);
    stroke-width: 1.35;
    vector-effect: non-scaling-stroke;
    stroke-dasharray: 2200;
    stroke-dashoffset: 2200;
    animation: blueprint-draw 13s cubic-bezier(.55,0,.18,1) infinite;
}

.residence-blueprint .blueprint-terrain path {
    stroke: rgba(214,205,190,.28);
    stroke-width: 1;
    animation-delay: -.65s;
}

.residence-blueprint .blueprint-marks path,
.residence-blueprint .blueprint-marks circle {
    stroke: rgba(126,77,78,.95);
    stroke-width: 1.4;
    animation-delay: -1.1s;
}

.residence-scan {
    width: 1px;
    position: absolute;
    z-index: 5;
    top: 11%;
    bottom: 11%;
    left: 29%;
    background: linear-gradient(180deg,transparent,rgba(235,228,214,.9) 16%,rgba(126,77,78,.95) 50%,rgba(235,228,214,.9) 84%,transparent);
    box-shadow: 0 0 28px rgba(235,228,214,.18);
    opacity: 0;
    animation: residence-scan 13s cubic-bezier(.72,0,.2,1) infinite;
}

.residence-shell {
    width: min(100% - 72px,1480px);
    min-height: 100svh;
    margin: 0 auto;
    padding: 132px 0 150px;
    display: grid;
    grid-template-columns: minmax(420px,610px) 1fr;
    align-items: center;
    position: relative;
}

#mainContent .residence-copy {
    width: auto !important;
    max-width: 610px !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    z-index: 8 !important;
    text-align: left !important;
}

#mainContent .residence-copy .premium-kicker {
    margin: 0 0 22px !important;
    padding-left: 36px !important;
    display: block !important;
    position: relative;
    border: 0 !important;
    background: none !important;
    color: rgba(255,255,255,.62) !important;
    font-size: 8px !important;
    font-weight: 700 !important;
    letter-spacing: .14em !important;
    text-transform: uppercase;
}

#mainContent .residence-copy .premium-kicker::before {
    content: "";
    width: 23px;
    position: absolute;
    left: 0;
    top: 50%;
    border-top: 1px solid rgba(226,220,207,.72);
}

#mainContent .residence-copy h2 {
    max-width: 610px !important;
    margin: 0 !important;
    color: white !important;
    font: 500 clamp(42px,4vw,58px)/.98 var(--rl-display) !important;
    letter-spacing: -.045em !important;
    text-shadow: 0 3px 30px rgba(0,0,0,.25) !important;
}

#mainContent .residence-copy h2 span {
    display: block;
    color: white !important;
}

#mainContent .residence-copy #heroSubtitleDisplay {
    max-width: 490px !important;
    margin: 25px 0 0 !important;
    padding: 0 !important;
    color: rgba(255,255,255,.66) !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.7 !important;
    text-shadow: none !important;
}

.residence-actions {
    margin-top: 28px;
    display: flex;
    align-items: center;
    gap: 20px;
}

.residence-primary,
.residence-secondary {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    transition: .25s;
}

.residence-primary {
    min-width: 165px;
    padding: 0 18px;
    justify-content: space-between;
    border: 1px solid rgba(255,255,255,.8);
    background: rgba(9,9,8,.28);
    backdrop-filter: blur(10px);
}

.residence-primary i { font-size: 14px; font-style: normal; }
.residence-secondary { border-bottom: 1px solid rgba(255,255,255,.42); }
.residence-primary:hover { border-color: #fff; background: #fff; color: #151412; }
.residence-secondary:hover { border-color: #fff; }

.residence-scene-note {
    justify-self: end;
    align-self: center;
    margin: 2vh 1vw 0 0;
    padding: 15px 0 15px 17px;
    display: grid;
    gap: 5px;
    position: relative;
    z-index: 8;
    border-left: 1px solid rgba(255,255,255,.32);
    color: white;
}

.residence-scene-note span,
.residence-scene-note i {
    color: rgba(255,255,255,.46);
    font-size: 7px;
    font-weight: 700;
    font-style: normal;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.residence-scene-note p { margin: 0 0 12px; font: 500 16px/1.25 var(--rl-display); }

#mainContent .residence-search {
    width: 100% !important;
    max-width: none !important;
    min-height: 88px;
    margin: 0 !important;
    padding: 11px !important;
    position: absolute !important;
    left: 0;
    right: 0;
    bottom: 22px;
    z-index: 12;
    display: grid !important;
    grid-template-columns: 120px 190px minmax(0,1fr);
    gap: 11px;
    align-items: center;
    border: 1px solid rgba(255,255,255,.22) !important;
    border-radius: 0 !important;
    background: rgba(12,12,11,.64) !important;
    color: white;
    box-shadow: 0 25px 80px rgba(0,0,0,.32) !important;
    backdrop-filter: blur(20px) saturate(120%);
}

.residence-search-label { padding-left: 8px; display: grid; gap: 4px; }
.residence-search-label span { color: white; font: 600 11px var(--rl-display); }
.residence-search-label small { color: rgba(255,255,255,.43); font-size: 7px; letter-spacing: .08em; text-transform: uppercase; }

#mainContent .residence-search .search-tabs {
    margin: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 3px !important;
    border: 0 !important;
}

#mainContent .residence-search .search-tab {
    min-height: 35px;
    padding: 0 8px !important;
    border: 1px solid rgba(255,255,255,.2) !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(255,255,255,.52) !important;
    font-size: 7px !important;
    letter-spacing: .08em;
    text-transform: uppercase;
}

#mainContent .residence-search .search-tab:nth-child(3) { display: none; }
#mainContent .residence-search .search-tab.active { border-color: rgba(255,255,255,.72) !important; color: white !important; }
#mainContent .residence-search .search-tab::after { display: none !important; }

#mainContent .residence-search .search-form {
    width: 100%;
    display: grid !important;
    grid-template-columns: repeat(5,minmax(86px,1fr)) 132px !important;
    gap: 7px !important;
    align-items: end;
}

#mainContent .residence-search .form-group { min-width: 0; }
#mainContent .residence-search .form-group label { margin: 0 0 5px !important; color: rgba(255,255,255,.4) !important; font-size: 6px !important; letter-spacing: .08em; }
#mainContent .residence-search select {
    width: 100%;
    height: 35px;
    padding: 0 7px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.28) !important;
    border-radius: 0 !important;
    outline: 0;
    background: transparent !important;
    color: white !important;
    font-size: 8px !important;
}
#mainContent .residence-search select option { color: #151412; }
#mainContent .residence-search .search-btn {
    min-height: 40px !important;
    padding: 0 12px !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #fff !important;
    border-radius: 0 !important;
    background: #fff !important;
    color: #151412 !important;
    font-size: 7px !important;
    letter-spacing: .08em;
}

.residence-status {
    position: absolute;
    right: max(36px,calc((100vw - 1480px)/2));
    bottom: 122px;
    z-index: 8;
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgba(255,255,255,.4);
    font-size: 6px;
    font-weight: 700;
    letter-spacing: .13em;
}
.residence-status i { width: 24px; border-top: 1px solid rgba(255,255,255,.35); }

/* No abstract plate in the institutional section. */
#mainContent .about-content { min-height: 690px; grid-template-columns: 1.08fr .92fr !important; }
#mainContent .about-text h2 { font-size: clamp(38px,4.2vw,56px) !important; }
#mainContent .about-process {
    min-height: 690px;
    padding: clamp(70px,8vw,120px) clamp(40px,6vw,90px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    order: 2;
    background: #171614;
    color: white;
}

#mainContent .about-process > div {
    min-height: 104px;
    padding: 20px 0;
    display: grid;
    grid-template-columns: 46px minmax(140px,.7fr) 1fr;
    gap: 16px;
    align-items: start;
    border-bottom: 1px solid rgba(255,255,255,.14);
}

#mainContent .about-process > div:first-child { border-top: 1px solid rgba(255,255,255,.14); }
#mainContent .about-process span { color: #a77475; font: 600 10px var(--rl-display); }
#mainContent .about-process strong { color: white; font: 600 18px/1.15 var(--rl-display); }
#mainContent .about-process p { margin: 0; color: rgba(255,255,255,.48); font-size: 9px; line-height: 1.65; }

@keyframes residence-camera {
    from { transform: translate3d(var(--scene-x),var(--scene-y),0) scale(1.045); }
    to { transform: translate3d(calc(var(--scene-x) - 12px),calc(var(--scene-y) - 5px),0) scale(1.075); }
}

@keyframes residence-reveal {
    0%,10% { clip-path: inset(0 100% 0 0); }
    48%,82% { clip-path: inset(0 0 0 0); }
    100% { clip-path: inset(0 0 0 100%); }
}

@keyframes blueprint-camera {
    from { transform: translate3d(var(--scene-x),var(--scene-y),0) scale(1.045); }
    to { transform: translate3d(calc(var(--scene-x) - 12px),calc(var(--scene-y) - 5px),0) scale(1.075); }
}

@keyframes blueprint-draw {
    0%,4% { stroke-dashoffset: 2200; opacity: 0; }
    14% { opacity: 1; }
    44%,68% { stroke-dashoffset: 0; opacity: .92; }
    84%,100% { stroke-dashoffset: -2200; opacity: 0; }
}

@keyframes blueprint-cycle {
    0%,7%,100% { opacity: 0; }
    14%,65% { opacity: 1; }
    82% { opacity: 0; }
}

@keyframes residence-scan {
    0%,8% { left: 29%; opacity: 0; }
    14% { opacity: 1; }
    48% { left: 94%; opacity: .9; }
    53%,100% { left: 94%; opacity: 0; }
}

@media(max-width:1200px) {
    .residence-shell { width: calc(100% - 40px); }
    #mainContent .residence-search { grid-template-columns: 105px 165px minmax(0,1fr); }
    #mainContent .residence-search .search-form { grid-template-columns: repeat(3,1fr) 120px !important; }
    #mainContent .residence-search .form-group:nth-child(4),
    #mainContent .residence-search .form-group:nth-child(5) { display: none; }
}

@media(max-width:820px) {
    #mainContent .residence-hero { min-height: 820px !important; }
    .residence-scene__base,.residence-scene__reveal { object-position: 66% center; }
    .residence-scene__shade { background: linear-gradient(90deg,rgba(7,9,10,.88),rgba(7,9,10,.48)),linear-gradient(0deg,rgba(7,8,8,.9),transparent 55%); }
    .residence-shell { width: calc(100% - 36px); min-height: 820px; padding: 108px 0 285px; grid-template-columns: 1fr; align-content: center; }
    #mainContent .residence-copy { max-width: 530px !important; }
    #mainContent .residence-copy h2 { font-size: clamp(38px,10vw,50px) !important; }
    .residence-scene-note,.residence-status { display: none; }
    #mainContent .residence-search { bottom: 15px; grid-template-columns: 1fr auto; }
    .residence-search-label { grid-row: 1; }
    #mainContent .residence-search .search-tabs { grid-row: 1; width: 170px; }
    #mainContent .residence-search .search-form { grid-column: 1 / -1; grid-template-columns: 1fr 1fr 110px !important; }
    #mainContent .residence-search .form-group:nth-child(3),
    #mainContent .residence-search .form-group:nth-child(4),
    #mainContent .residence-search .form-group:nth-child(5) { display: none; }
    #mainContent .about-content { grid-template-columns: 1fr !important; }
    #mainContent .about-process { min-height: 0; padding: 65px 24px; }
}

@media(max-width:540px) {
    #mainContent .residence-hero,.residence-shell { min-height: 860px !important; }
    .residence-shell { padding: 100px 0 330px; }
    #mainContent .residence-copy h2 { font-size: 39px !important; }
    #mainContent .residence-copy #heroSubtitleDisplay { max-width: 360px !important; font-size: 11px !important; }
    .residence-actions { align-items: flex-start; flex-direction: column; gap: 13px; }
    #mainContent .residence-search { grid-template-columns: 1fr; }
    #mainContent .residence-search .search-tabs { grid-row: 2; width: 100%; }
    #mainContent .residence-search .search-form { grid-column: 1; grid-template-columns: 1fr 1fr !important; }
    #mainContent .residence-search .search-btn { grid-column: 1 / -1; }
    #mainContent .about-process > div { grid-template-columns: 34px 1fr; }
    #mainContent .about-process p { grid-column: 2; }
}

@media(prefers-reduced-motion:reduce) {
    .residence-scene__base,.residence-scene__reveal,.residence-blueprint,.residence-blueprint path,.residence-blueprint circle,.residence-scan { animation: none !important; }
    .residence-scene__base { filter: saturate(.68) brightness(.75) contrast(1.04); }
    .residence-scene__reveal,.residence-blueprint,.residence-scan { display: none; }
}
