/*🟢 Hero*/
.hero {padding-bottom:var(--InsetXL)}
.hero .hero-title {text-align:center}
.hero-form, .listing-hero {display:flex; flex-direction:column}
.hero-form {gap:var(--GapL); padding:0 var(--InsetBlock)}
.collection-hero, .full-service-hero, .page-hero {gap:var(--GapS)}
.collection-hero {gap:var(--GapXS)}
.listing-hero {gap:var(--GapXS)}

.full-service-hero, .page-hero {align-items:center; justify-content:center; text-align:center}
.full-service-hero img {max-width:8rem; height:8rem}
.full-service-hero .btn {margin-top:var(--OffsetL)}
.full-service {background:var(--BackgroundPurpleSecondary)}

.page-hero img.page-hero-icon {width:auto; height:8rem}
.page-hero img.page-hero-qr {max-width:17.5rem; height:auto; margin:var(--OffsetXL) auto}
.page-hero form {gap:var(--GapM); margin:var(--OffsetL) 0}
.page-hero form button {margin:0}
.page-hero .add-properties {margin-top:var(--OffsetXL)}

.blog-hero {align-items:center; padding-top:var(--InsetXXL)}
.blog-hero, .blog-category-hero, .blog-post-hero {gap:var(--GapXS)}
.blog-hero h1, .blog-hero p {text-align:center}
.blog-hero-label {display:inline-flex; align-items:center; justify-content:center; align-self:center; width:max-content; max-width:calc(100% - 2rem); padding:var(--InsetXS) var(--InsetM); font-size:var(--Base); line-height:var(--BaseLine); font-weight:var(--Medium); color:var(--TextOnBackground); border-radius:var(--RadiusXXL); background-color:var(--BackgroundOrangeDeep); transform:rotate(-4deg); z-index:2}


/*🟢 Banners*/
.banner {position:relative; display:flex; flex-flow:row nowrap; align-items:center; justify-content:flex-start; gap:var(--GapL); min-width:0; margin-top:var(--OffsetM); box-sizing:border-box; padding:var(--InsetM); color:var(--TextPrimary); border-radius:var(--RadiusXL); background:var(--BackgroundWhite); transition:transform .32s cubic-bezier(.22,1,.36,1), box-shadow .32s cubic-bezier(.22,1,.36,1)}
.banner--canvas {background:var(--BackgroundCanvas)}
.banner-content {display:flex; flex:1 1 auto; min-width:0; flex-direction:column; gap:var(--GapXXS)}
.banner-content > * {min-width:0; max-width:100%}
.banner-content-title {font-size:var(--Base); line-height:var(--BaseLine); font-weight:var(--SemiBold); color:var(--TextPrimary)}
.banner-content-hint {font-size:var(--Small); line-height:var(--SmallLine); color:var(--TextTertiary)}

.banner-media {display:block; flex:0 0 auto; width:auto; height:var(--ControlL); object-fit:contain; pointer-events:none}

.banner-media-stack {display:flex; flex:0 0 auto; flex-flow:row nowrap; align-items:center; position:relative}
.banner-media-stack-img {display:block; flex:0 0 auto; width:var(--ControlL); height:var(--ControlL); object-fit:cover; border-radius:var(--RadiusL); box-shadow:0 0 0 var(--StrokeL) var(--BackgroundWhite)}
.banner--canvas .banner-media-stack-img {box-shadow:0 0 0 var(--StrokeL) var(--BackgroundCanvas)}
.banner-media-stack-img + .banner-media-stack-img {margin-left:-2rem}
.banner-media-stack-img:nth-child(1) {z-index:1}
.banner-media-stack-img:nth-child(2) {z-index:2}
.banner-media-stack-img:nth-child(3) {z-index:3}

/*🟢 Benefits*/
.benefit-card {display:flex; flex-direction:column; gap:var(--GapXL); box-sizing:border-box; border-radius:var(--RadiusXL); background:var(--BackgroundCanvas)}
.benefit-card-icon {display:flex; align-items:center; justify-content:center; width:var(--ControlXL); height:var(--ControlXL); margin-left:var(--OffsetS); margin-top:var(--OffsetS); border-radius:var(--RadiusL); background-color:var(--BackgroundWhite)}
.benefit-card-icon svg {display:block; width:var(--IconL); height:var(--IconL)}
.benefit-card-icon svg * {fill:var(--IconSecondary)}
.benefit-card-content {display:flex; flex-direction:column; gap:var(--GapS)}
.benefit-card h4 {margin:0 var(--OffsetL) var(--OffsetL) var(--OffsetL); font-weight:var(--Regular)}

/*🟢 Promo Blocks*/
.promo-block {display:flex; flex:1 1 auto; flex-flow:row nowrap; align-items:stretch; justify-content:space-between; gap:var(--GapL); padding:var(--InsetM) var(--InsetL) var(--InsetL) var(--InsetL); border-radius:var(--RadiusXL); background:var(--BackgroundCanvas)}
.promo-block-content {display:flex; flex:1 1 auto; min-width:0; min-height:0; flex-direction:column; align-items:flex-start; gap:var(--GapXL)}
.promo-block-text {display:flex; flex-direction:column; gap:var(--GapXS)}
.promo-block-content .btn {margin-top:auto}
.promo-block img {display:block; flex:0 0 auto; align-self:flex-end; width:auto; height:6rem; object-fit:contain; pointer-events:none}
.promo-block-content .btn--tertiary:not(.btn--disabled):hover {color:var(--TextOnBackground); background-color:var(--BackgroundOrangeDeep)}
.promo-block-content .btn--tertiary:not(.btn--disabled):hover svg * {fill:var(--IconOnBackground); stroke:none}
.promo-block--dark {background:var(--BackgroundDark)}
.promo-block--dark .promo-block-content {color:var(--TextOnBackground)}
.promo-block--dark .promo-block-text .gray {color:var(--TextOnBackground)}

/*🟢 Navigation*/
header {display:flex; flex-flow:row nowrap; justify-content:space-between; align-items:center; gap:var(--GapM); padding:var(--InsetS); border-radius:var(--RadiusXXL) var(--RadiusXXL) 0 0}
.header-left, .header-center, .header-right {display:flex; flex-flow:row nowrap; align-items:center}
.header-left, .header-right {flex:0 0 auto; gap:var(--GapS)}
.header-center {flex:1 1 auto; justify-content:flex-start}
.header-center--logo {flex:0 0 auto; align-self:center}

.page-header--overlay {position:absolute; top:0; left:0; right:0; z-index:10; pointer-events:auto}
.header--start {justify-content:flex-start}
.header--end {justify-content:flex-end}
.header--center {align-items:center; position:relative}
.headrer-icon-left {margin-right:auto}
.headrer-icon-right {margin-right:auto}
.headrer-page-title {position:absolute; left:50%; transform:translateX(-50%)}
.header-title {display:flex; flex-flow:row nowrap; align-items:center}
.header-title--icons .circle-img {margin-left:-1rem; z-index:2}
.header-title--icons .circle-icon {z-index:1}
.header-title--city {justify-content:flex-start; gap:var(--GapM); min-width:0; margin-right:auto; font-size:var(--Base); line-height:var(--BaseLine)}

.page-header--map {pointer-events:none}
.page-header--map .btn,
.page-header--map a,
.page-header--map button,
.page-header--map .header-title--logo {pointer-events:auto}

.header-title--logo {display:inline-flex; flex-flow:row nowrap; justify-content:center; align-items:center; height:var(--ControlM); padding:0 var(--InsetM); color:var(--TextLink); border-radius:var(--RadiusL); text-decoration:none}
.header-title--logo svg {display:block; width:auto; height:1.75rem}
.header-title--logo svg * {fill:currentColor; stroke:none}
.header-title--logo--white {color:var(--TextOnBackground)}
a.header-title--logo {color:var(--TextLink)}
a.header-title--logo:hover {color:var(--TextLinkHover)}
a.header-title--logo.header-title--logo--white {color:var(--TextOnBackground)}
a.header-title--logo.header-title--logo--white:hover {color:var(--TextLink)}

footer {margin-top:var(--OffsetXL); border-top:var(--Stroke) solid var(--StrokeSecondary)}
footer .container {display:flex; flex-direction:column; gap:var(--GapM)}
footer .copyright {color:var(--TextTertiary)}

/*🟢 Rent Forms*/
.rent-form {display:flex; flex-flow:row wrap; overflow:hidden; border-radius:var(--RadiusXL); box-shadow:var(--ShadowDefault); background:var(--BackgroundWhite)}
.rent-form .btn-field {border-radius:0}
.rent-form--segmented {gap:0}
.rent-form--segmented .btn-field--half {flex:0 0 50%}

.price-filter-form {display:flex; flex-flow:row wrap; gap:var(--GapL); margin-top:var(--OffsetM)}
.price-filter-form .input {flex:0 0 calc(50% - (var(--GapL) / 2)); min-width:0}
.price-filter-form .btn {flex:0 0 100%}

.price-grid {display:flex; gap:var(--GapL)}
.price-grid .base {padding:0 var(--InsetM)}
.price-col, .price-list {display:flex; flex-direction:column}
.price-col {flex:1 1 0; min-width:0; gap:var(--GapS)}
.price-list .btn {width:100%; justify-content:flex-start; text-align:left}
.price-list .btn[disabled] {opacity:0.24}


/*Forms*/
.form {display:flex; flex-direction:column; gap:var(--GapL); width:100%; box-sizing:border-box}
.field, .field-switch {display:flex; flex-direction:column; gap:var(--GapS); flex:0 0 100%; min-width:0}
.field label {display:block; width:100%; box-sizing:border-box; padding:0 var(--InsetL); font-size:var(--Small); line-height:var(--SmallLine); color:var(--TextSecondary)}
label.lightgray {color:var(--TextTertiary)}
.row-fieldes {display:flex; flex-wrap:wrap; gap:var(--GapS); align-items:flex-start}
.row-fieldes > label {flex:0 0 100%; min-width:0; box-sizing:border-box; padding:0 var(--InsetL); font-size:var(--Small); line-height:var(--SmallLine); color:var(--TextSecondary)}
.row-fieldes .field {flex:1 1 0; min-width:0}
.form button {margin-top:var(--OffsetL)}

.upload-avatar {justify-content:center; align-items:center; padding:0}
.avatar-btn {width:8rem; height:8rem; padding:0; border:0; border-radius:var(--RadiusMax); outline:none; overflow:hidden; display:block; background-color:var(--BackgroundSecondary); line-height:0; -webkit-appearance:none; appearance:none}
.avatar-btn img {display:block; width:100%; height:100%; object-fit:cover}

.settings-form {padding:0 var(--OffsetInBlock)}
.form-hint {padding:var(--InsetM) var(--InsetL); font-size:var(--Small); line-height:var(--SmallLine); border-radius:var(--RadiusL); background-color:var(--BackgroundBlueSecondary)}
.list-form {gap:0}

/*Toasts*/
.toast {position:fixed; top:var(--InsetS); left:50%; z-index:1000; padding:0 var(--InsetXL); height:var(--ControlM); display:inline-flex; align-items:center; justify-content:center; border-radius:var(--RadiusMax); font-size:var(--Base); line-height:var(--BaseLine); font-weight:var(--Medium); box-shadow:var(--ShadowDefault); pointer-events:none; opacity:0; transform:translate(-50%,-1.5rem); color:var(--TextOnBackground); white-space:nowrap; max-width:calc(100vw - (var(--InsetL) * 2)); overflow:hidden; visibility:hidden; text-overflow:ellipsis}
.toast.is-show {animation:toast-inout 2s ease forwards; visibility:visible}
.toast--success {background-color:var(--BackgroundGreen)}
.toast--error {background-color:var(--BackgroundRed)}
.toast--process {background-color:var(--BackgroundDark)}
@keyframes toast-inout {
  0% {opacity:0; transform:translate(-50%,-1.5rem)}
  12% {opacity:1; transform:translate(-50%,0)}
  85% {opacity:1; transform:translate(-50%,0)}
  100% {opacity:0; transform:translate(-50%,-1.5rem)}
}
@media (prefers-reduced-motion: reduce) {
  .toast.is-show {animation:none; opacity:1; visibility:visible; transform:translate(-50%,0)}
}

/*Tabs*/
.form-tabs {display:flex; flex-direction:column; gap:var(--GapM)}
.tab-radio {position:absolute; opacity:0; pointer-events:none}
.tabs {display:flex; flex-direction:row nowrap; justify-content:center; width:100%; box-shadow:inset 0 -0.0625rem 0 0 var(--StrokeSecondary)}
.tab {display:inline-flex; justify-content:center; align-items:center; text-align:center; height:var(--ControlM); padding:0 var(--InsetL); color:var(--TextSecondary); cursor:pointer; user-select:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.tab:hover {color:var(--TextPrimary)}
.tab-panels {display:block}
.tab-panel {display:none; flex-direction:column; gap:var(--GapL)}
#tab-1:checked ~ .tabs label[for="tab-1"],
#tab-2:checked ~ .tabs label[for="tab-2"],
#tab-3:checked ~ .tabs label[for="tab-3"] {color:var(--TextPrimary); box-shadow:inset 0 -0.1875rem 0 0 var(--StrokeAccent)}
#tab-1:checked ~ #settings-form .tab-panels .tab-panel:nth-child(1) {display:flex}
#tab-2:checked ~ #settings-form .tab-panels .tab-panel:nth-child(2) {display:flex}
#tab-3:checked ~ #settings-form .tab-panels .tab-panel:nth-child(3) {display:flex}


/*🟢 Slider*/
.slider {display:flex; gap:var(--GapS); overflow-x:auto; overflow-y:hidden; padding:0 var(--InsetBlock); scroll-snap-type:x mandatory; scroll-padding:0 var(--InsetBlock); scrollbar-width:none; -webkit-overflow-scrolling:touch}
.slider::-webkit-scrollbar {display:none}
.slider > .card {flex:0 0 auto; scroll-snap-align:start}

.slider--cards-XS > .card {flex:0 0 calc(33.333% - var(--GapS)); min-width:0; scroll-snap-align:start}
.slider--cards-S > .card {flex:0 0 calc(50% - var(--GapS))}
.slider--cards-M > .card {flex:0 0 calc(66.666% - (var(--GapS) / 3))}
.slider--cards-L > .card, .slider--banners > .banner, .slider--promo-blocks > .promo-block {flex:0 0 calc(100% - var(--GapS)); scroll-snap-align:start}

.slider--pills {box-sizing:border-box; width:100%; max-width:var(--WidthWideBlock); margin:0 var(--OffsetAuto); padding:var(--InsetM) var(--InsetL); gap:var(--GapS)}
.filters-bar.is-stuck .slider--pills {padding:var(--InsetS) var(--InsetL)}

.slider--benefits > .benefit-card {flex:0 0 calc(66.666% - (var(--GapS) / 3)); scroll-snap-align:start}

.slider--photos {gap:var(--GapS)}
.slider--photos > .img-box,
.slider--photos > form {flex:0 0 calc(75% - var(--GapS)); scroll-snap-align:start}
.slider--photos > form {display:flex}
.slider--photos > form .media-btn {position:relative; display:flex; flex:1 1 auto; flex-direction:column; align-items:center; justify-content:center; gap:var(--GapXS); width:100%; height:100%; overflow:hidden; border:none; outline:none; cursor:pointer; background:var(--BackgroundSecondary)}
.slider--photos > form .media-btn:hover {background:var(--BackgroundTertiary)}


/*Upload Photos*/
.media-btn > svg * {fill:var(--IconOrangeDeep); stroke:none}
.media-btn-plus {display:inline-flex; align-items:center; justify-content:center; gap:var(--GapXS); position:absolute; right:var(--OffsetS); top:var(--OffsetS); z-index:2; width:fit-content; height:var(--ControlS); padding:0 var(--InsetM); pointer-events:none; border-radius:var(--RadiusMax); background-color:var(--BackgroundGreen); box-shadow:var(--ShadowHover)}
.media-btn-plus svg * {fill:var(--IconOnBackground); stroke:none}
.media-btn-badge {font-size:var(--Base); line-height:var(--BaseLine); color:var(--TextOnBackground)}
.media-btn-text {font-size:var(--Large); line-height:var(--LargeLine); font-weight:var(--Medium)}
.media-btn-subtext {font-size:var(--Small); line-height:var(--SmallLIne); color:var(--TextSecondary)}
.media-hint {margin:0 var(--OffsetInBlock)}

/*Widgets*/
.map-preview:hover img {transform:scale(1.15)}
.map-preview span.btn, .map-preview span.vbtn {width:fit-content; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); z-index:2; color:var(--TextPrimary)}

.listing-price {align-items:center; justify-content:space-between; gap:var(--GapXL)}
.listing-price .btn {flex:1 1 auto; min-width:0}
.price-details {display:flex; flex-direction:column; gap:var(--GapXXS)}
.listing-description {margin-top:var(--OffsetL)}

.rent-profile {display:flex; flex-direction:column; gap:var(--GapXL)}
.rent-profile hr {margin:var(--OffsetS) 0}
.profile-info {display:flex; flex-direction:column; align-items:center; color:var(--TextPrimary); gap:var(--GapXXS)}
.profile-info .circle-img {margin-bottom:var(--OffsetS)}
.profile-disclamer {font-size:var(--Small); line-height:var(--SmallLine); color:var(--TextSecondary); text-align:center}
.profile-status {display:flex; flex-flow:row nowrap; gap:var(--GapM); padding:var(--InsetL); border-radius:var(--RadiusL); background-color:var(--BackgroundWhite)}
.check-list {display:flex; flex-direction:column; gap:0}
.check-list-item {display:flex; flex-direction:column; gap:var(--GapXS); padding:var(--InsetM) 0; border-bottom:var(--Stroke) solid var(--StrokePrimary)}
.check-list-item h3 {display:flex; flex-flow:row nowrap; gap:var(--GapS); align-items:center; justify-content:flex-start}
.check-list > .check-list-item:last-child {border-bottom:0}
.progress-bar {flex-flow:row nowrap; gap:var(--GapL); align-items:center; justify-content:space-between}
.progress-bar h1 {font-size:2.5rem; line-height:auto}
.progress-line {height:0.25rem; background:var(--BackgroundSecondary)}
.progress-line__bar {height:0.25rem; background:var(--BackgroundGreen); width:0}

/*🟢 Share QR*/
.qr-card {display:flex; flex-direction:column; align-items:center; gap:0.75rem; padding:var(--InsetL); border-radius:var(--RadiusXXL); background:var(--BackgroundWhite)}
.qr-card--elspal {margin:var(--OffsetL) auto}
#author-qr-slot svg {display:block; width:17.5rem; height:17.5rem}


/*🟢 Gallery*/
.gallery {display:flex; flex-direction:column}
.gallery-hero-wrap {position:relative}
.gallery-track {display:flex; gap:0; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; scroll-behavior:smooth; scrollbar-width:none; -ms-overflow-style:none; -webkit-overflow-scrolling:touch; border-radius:var(--RadiusXXL) var(--RadiusXXL) 0 0; background:var(--BackgroundSecondary)}
.gallery-track::-webkit-scrollbar {display:none}
.gallery-slide {flex:0 0 100%; width:100%; padding:0; border:0; background:none; cursor:pointer; scroll-snap-align:start}
.gallery-image {display:block; position:relative; width:100%; aspect-ratio:4/3; overflow:hidden; background:var(--BackgroundSecondary)}
.gallery-slide-img {display:block; width:100%; height:100%; object-fit:cover; background:var(--BackgroundSecondary)}
.gallery-slide-img--blur {position:absolute; inset:0; transform:scale(1.06); filter:blur(1rem); opacity:1; transition:opacity .24s ease}
.gallery-slide-img--main {position:absolute; inset:0; opacity:0; transition:opacity .24s ease}
.js-image.is-loaded .gallery-slide-img--main {opacity:1}
.js-image.is-loaded .gallery-slide-img--blur {opacity:0}
.gallery-meta {position:absolute; right:var(--InsetL); bottom:2.5rem; pointer-events:none}
.gallery-count {pointer-events:none}
.gallery-slide-img--empty {display:block}

/*🟠 Lightbox*/
.lightbox {position:fixed; inset:0; z-index:80; will-change:transform; background:var(--BackgroundWhite)}
.lightbox-panel {position:absolute; inset:0; width:100%; height:100%}
.lightbox-close {position:absolute; top:var(--InsetS); right:var(--InsetS); z-index:5}

.lightbox-stage {position:absolute; inset:0; display:flex; overflow-x:auto; overflow-y:hidden; touch-action:pan-x pinch-zoom; -webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory; scroll-behavior:smooth; scrollbar-width:none; -ms-overflow-style:none}
.lightbox-stage::-webkit-scrollbar {display:none}
.lightbox-slide {flex:0 0 100%; width:100%; min-width:0; height:100%; scroll-snap-align:start; display:flex; align-items:center; justify-content:center; padding:0}
.lightbox-image {display:block; position:relative; width:100%; height:100%}
.lightbox-img {display:block; width:auto; height:auto; max-width:100%; max-height:calc(100dvh - 4rem - (var(--InsetS) * 3)); object-fit:contain}
.lightbox-img--blur,.lightbox-img--main {position:absolute; top:50%; left:50%; width:auto; height:auto; max-width:100%; max-height:calc(100dvh - 4rem - (var(--InsetS) * 3)); object-fit:contain; transform:translate(-50%,-50%)}
.lightbox-img--blur {filter:blur(1rem); opacity:1; transition:opacity .24s ease}
.lightbox-img--main {opacity:0; transition:opacity .24s ease}
.js-image.is-loaded .lightbox-img--main {opacity:1}
.js-image.is-loaded .lightbox-img--blur {opacity:0}

.lightbox-thumbs {position:absolute; left:0; right:0; bottom:0; display:flex; align-items:center; justify-content:flex-start; gap:var(--GapS); overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory; padding:var(--InsetM); scroll-padding:var(--InsetM); background:var(--BackgroundWhite); scrollbar-width:none; -ms-overflow-style:none}
.lightbox-thumbs::-webkit-scrollbar {display:none}

.gallery-thumb {flex:0 0 auto; width:4rem; aspect-ratio:1/1; height:auto; border-radius:var(--RadiusM); border:0; padding:0; background:var(--BackgroundWhite); overflow:hidden; cursor:pointer; scroll-snap-align:start; opacity:.56; -webkit-tap-highlight-color:rgba(0,0,0,0); transition:opacity .18s ease, box-shadow .18s ease}
.gallery-thumb--active {opacity:1; box-shadow:var(--ShadowDefault)}
.gallery-thumb-image {display:block; position:relative; width:100%; height:100%; overflow:hidden; background:var(--BackgroundSecondary)}
.gallery-thumb-img {display:block; width:100%; height:100%; object-fit:cover; background:var(--BackgroundSecondary)}
.gallery-thumb-img--blur {position:absolute; inset:0; transform:scale(1.06); filter:blur(1rem); opacity:1; transition:opacity .24s ease}
.gallery-thumb-img--main {position:absolute; inset:0; transform:scale(1); opacity:0; transition:opacity .24s ease, transform .2s ease}
.js-image.is-loaded .gallery-thumb-img--main {opacity:1}
.js-image.is-loaded .gallery-thumb-img--blur {opacity:0}
.gallery-thumb:hover .gallery-thumb-img--main {transform:scale(1.15)}

/*🟢 Sheet*/
.sheet-backdrop {position:fixed; inset:0; z-index:50; opacity:0; visibility:hidden; background:var(--BackgroundOverlay); transition:opacity var(--SheetDur,.22s) var(--SheetEase,ease), visibility 0s linear var(--SheetDur,.22s)}
.sheet-backdrop.is-open {opacity:1; visibility:visible; transition:opacity var(--SheetDur,.22s) var(--SheetEase,ease), visibility 0s}

.sheet, .sheet-title, .sheet-content {display:flex; flex-direction:column}
.sheet {position:fixed; left:0; right:0; bottom:0; z-index:60; align-items:stretch; overflow:hidden; max-height:calc(100dvh - 2.75rem); will-change:transform; pointer-events:auto; transform:translateY(110%); transition:transform var(--SheetDur,.22s) var(--SheetEase,ease); border-radius:var(--RadiusXXL) var(--RadiusXXL) 0 0; background:var(--BackgroundWhite); touch-action:none}
.sheet.is-open {transform:translateY(0)}

.sheet-close {position:absolute; top:var(--InsetS); right:var(--InsetS); z-index:2}
.sheet-title {position:relative; z-index:1; gap:var(--GapXS); background:var(--BackgroundWhite)}
.sheet-title--center {text-align:center}
.sheet-content {position:relative; z-index:0; flex:1 1 auto; align-items:stretch; min-height:0; overflow:auto; overscroll-behavior:contain; gap:var(--GapM); padding:var(--InsetL); -webkit-overflow-scrolling:touch; overscroll-behavior:contain; touch-action:pan-y}

.sheet-actions--static {margin-top:var(--OffsetL)}
.sheet-actions--two {display:flex; flex-flow:row nowrap; gap:var(--GapL)}
.sheet-actions--two .btn {flex:1 1 0; min-width:0}

.sheet-dock {flex:0 0 auto; padding:var(--InsetM) var(--InsetL) calc(var(--InsetM) + env(safe-area-inset-bottom)); background:var(--BackgroundWhite)}
.sheet-dock:empty {display:none !important}


/*🟢 Map*/
.rent-map {position:relative; border-radius:var(--RadiusXL); background:var(--BackgroundPrimary)}
#map {position:relative; z-index:1; width:100%; height:calc(100dvh - 4rem); border-radius:var(--RadiusXL); opacity:0; transition:opacity .12s ease}
#map.is-ready {opacity:1}
.rent-map--full #map {height:100dvh}

.price-pin {position:relative; display:inline-flex; align-items:center; justify-content:center; padding:var(--InsetXS) var(--InsetM); font-size:var(--Base); line-height:var(--BaseLine); font-weight:var(--Medium); color:var(--TextPrimary); white-space:nowrap; cursor:pointer; user-select:none; border-radius:var(--RadiusMax); background:var(--BackgroundWhite); box-shadow:var(--ShadowDefault)}
.price-pin__dong {margin-left:var(--OffsetXS)}
.price-pin.is-active {color:var(--TextOnBackground); background:var(--BackgroundOrangeDeep)}

.card-map {position:absolute; z-index:10; left:var(--InsetL); right:var(--InsetL); bottom:var(--InsetXL); display:flex; flex-flow:row nowrap; justify-content:flex-start; gap:var(--GapL); overflow:visible; pointer-events:auto; padding:var(--InsetM); color:var(--TextPrimary); text-decoration:none; border-radius:var(--RadiusXXL); background:var(--BackgroundWhite); box-shadow:var(--ShadowHover)}
.card-map:hover,
.card-map:focus,
.card-map:active,
.card-map:visited {color:var(--TextPrimary); text-decoration:none}
.card-map .card-content {flex:1 1 auto; margin:0; padding:0}
.card-map > .label {position:absolute; top:calc(var(--InsetM) * -1); right:var(--InsetM); z-index:2}
.card-map--M {align-items:stretch}
.card-map--M .img-box {flex:0 0 7rem; width:7rem; height:7rem; min-width:7rem; min-height:7rem}
.card-map--M .card-details:last-of-type {margin-top:auto}
.card-map--S {align-items:center}
.card-map--S .img-box {flex:0 0 4rem; width:4rem; height:4rem; min-width:4rem; min-height:4rem}
.card-map--S .card-details:last-of-type {margin-top:0}


.card-map .img-box img {transform:scale(1); transition:transform .22s ease}
.card-map:hover .img-box img {transform:scale(1.15)}

#map-card-root {display:none}
#map-card-root.is-open {display:flex}
#map-card-root.is-loading {pointer-events:none}


/*Blog*/
.card-blog .card-content {gap:var(--GapXXS); padding:var(--InsetM) var(--InsetXS)}
.card-blog-title {font-size:var(--Large); line-height:var(--LargeLine); font-weight:var(--Medium)}

.post-cover {box-sizing:border-box; position:relative; overflow:hidden; width:100%; aspect-ratio:4 / 3; max-width:var(--WidthWideBlock); margin:0 auto; background-color:var(--BackgroundSecondary)}
.post-cover-blur,.post-cover-main {position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover}
.post-cover-blur {transform:scale(1.06); filter:blur(1rem); opacity:1; transition:opacity .24s ease}
.post-cover-main {opacity:0; transition:opacity .24s ease}
.post-cover.is-loaded .post-cover-main {opacity:1}
.post-cover.is-loaded .post-cover-blur {opacity:0}

.content--article {display:flex; flex-direction:column; gap:var(--GapM); font-size:var(--Base); line-height:var(--LargeLine)}
.content--article p,
.content--article li {font-size:var(--Base); line-height:var(--LargeLine)}
.content--article img {display:block; width:100%; height:auto; margin-bottom:var(--InsetS); border-radius:var(--RadiusL)}
.content--article ul, .content--article ol {padding-left:1.25rem; margin:0 0 var(--InsetS)}
.content--article li + li {margin-top:0.5rem}
.content--article a {color:var(--TextLink); text-decoration:none}
.content--article a:hover {color:var(--TextLinkHover)}

/*Dashboard*/
.dashboard {gap:var(--GapL)}
.dashboard-item {display:flex; flex:0 0 calc(50% - (var(--GapL) / 2)); min-width:0; flex-direction:column; justify-content:space-between; gap:var(--GapXS); padding:var(--InsetL); border-radius:var(--RadiusXL); background-color:var(--BackgroundWhite); text-decoration:none}
.dashboard-item-icon {display:flex; flex:0 0 auto; align-items:flex-start; justify-content:flex-start; margin-bottom:var(--OffsetXL)}
.dashboard-item-icon svg {display:block; width:var(--IconL); height:var(--IconL)}
.dashboard-item-icon svg * {fill:var(--IconSecondary); stroke:none}
.dashboard-item-counts {display:flex; flex-flow:row nowrap; gap:var(--GapM); align-items:baseline; justify-content:flex-start; margin-top:auto}
.all-count {font-size:var(--Title); line-height:var(--TitleLine); font-weight:var(--SemiBold); color:var(--TextPrimary)}
.today-count {font-size:var(--Headline); line-height:var(--HeadlineLine); font-weight:var(--Medium); color:var(--TextGreen)}
.dashboard-item-name {font-size:var(--Base); line-height:var(--BaseLine); color:var(--TextTertiary)}

/*Entity*/
.entity-list {display:flex; flex-direction:column; gap:var(--GapM)}
.entity-row {display:flex; flex-flow:row nowrap; align-items:flex-start; justify-content:space-between; gap:var(--GapL); padding:var(--InsetM); border-radius:var(--RadiusXL); background-color:var(--BackgroundWhite);}
.entity-row__content {display:flex; flex:1 1 auto; min-width:0; flex-direction:column; gap:var(--GapS)}
.entity-row__text {display:flex; flex-direction:column; gap:var(--GapXS); min-width:0}
.entity-row__text > * {min-width:0}
.entity-row__actions {display:flex; flex-flow:row nowrap; align-items:center; gap:var(--GapXS); margin-top:auto}
.entity-row__media {flex:0 0 auto; width:5rem; min-width:5rem; height:auto; aspect-ratio:1/1}