.home-page { background: #f7f8fb; }
.home-hero { padding: 62px 18px 78px; overflow: hidden; background: radial-gradient(circle at 80% 15%, rgba(89,125,225,.2), transparent 29%), linear-gradient(135deg, #111b3d, #1d316c 65%, #294c99); color: #fff; }
.home-hero-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(410px, .95fr); align-items: center; gap: 56px; }
.home-eyebrow { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 16px; color: #b9c8f2; font-size: .74rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.home-hero h1 { max-width: 720px; margin: 0; font-family: "Montserrat", sans-serif; font-size: clamp(2.65rem, 5.4vw, 4.8rem); font-weight: 780; line-height: 1.02; letter-spacing: -.06em; }
.home-hero-copy > p { max-width: 660px; margin: 22px 0 26px; color: #d9e1f7; font-size: 1rem; line-height: 1.75; }
.home-hero-actions { display: flex; flex-wrap: wrap; gap: 11px; }
.home-primary-button, .home-secondary-button { min-height: 47px; padding: 12px 18px; border-radius: 10px; font-size: .82rem; font-weight: 750; }
.home-primary-button { border: 0; background: linear-gradient(135deg, #ffd45d, #efb02a); color: #243052; box-shadow: 0 9px 22px rgba(234,171,35,.22); }
.home-primary-button:hover { background: linear-gradient(135deg, #ffe17d, #f5bf43); color: #17213e; transform: translateY(-1px); }
.home-secondary-button { border: 1px solid rgba(255,255,255,.38); background: rgba(255,255,255,.08); color: #fff; }
.home-secondary-button:hover { border-color: #fff; background: rgba(255,255,255,.15); color: #fff; }
.home-hero-proof { display: flex; gap: 24px; margin-top: 29px; }
.home-hero-proof span, .home-hero-proof strong, .home-hero-proof small { display: block; }
.home-hero-proof span { padding-right: 24px; border-right: 1px solid rgba(255,255,255,.18); }
.home-hero-proof span:last-child { padding-right: 0; border-right: 0; }
.home-hero-proof strong { font-size: .86rem; }
.home-hero-proof small { margin-top: 3px; color: #abb9dc; font-size: .65rem; }
.home-visual-grid { position: relative; display: grid; grid-template-columns: 1.15fr .85fr; grid-template-rows: 1fr 1fr; gap: 11px; height: 470px; }
.home-visual-grid > img { width: 100%; height: 100%; min-height: 0; border: 1px solid rgba(255,255,255,.18); border-radius: 15px; object-fit: cover; }
.home-visual-main { grid-row: span 2; }
.home-visual-badge { position: absolute; bottom: 16px; left: 16px; display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1px solid rgba(255,255,255,.25); border-radius: 12px; background: rgba(10,20,49,.75); backdrop-filter: blur(9px); }
.home-visual-badge > i { color: #ffd15a; font-size: 1.2rem; }
.home-visual-badge span, .home-visual-badge small, .home-visual-badge strong { display: block; }
.home-visual-badge small { color: #b8c4e4; font-size: .6rem; }
.home-visual-badge strong { margin-top: 2px; font-size: .76rem; }

.home-search-wrap { position: relative; z-index: 3; margin-top: -35px; padding: 0 18px; }
.home-search-wrap.is-filter-floating { z-index: 1040; }
.home-search-wrap.is-filter-floating > .container-xl { position: fixed; z-index: 1040; top: 14px; left: 50%; width: calc(100% - 36px); padding: 0; transform: translateX(-50%); animation: home-filter-slide-down .34s cubic-bezier(.2,.72,.24,1) both; }
.home-search-wrap.is-filter-floating .home-search-panel { grid-template-columns: 1.4fr 1fr .8fr auto; padding: 12px; border-color: rgba(190,202,226,.92); box-shadow: 0 18px 45px rgba(20,35,72,.2); }
.home-search-wrap.is-filter-floating .home-search-title { display: none; }
.home-search-panel { display: grid; grid-template-columns: 1.15fr 1.4fr 1fr .8fr auto; align-items: end; gap: 13px; padding: 18px; border: 1px solid #dfe4ef; border-radius: 17px; background: #fff; box-shadow: 0 16px 38px rgba(27,42,82,.12); }
.home-search-title { display: flex; align-items: center; gap: 11px; }
.home-search-title > span { display: grid; width: 41px; height: 41px; flex: 0 0 auto; place-items: center; border-radius: 10px; background: #e9efff; color: #3159bd; }
.home-search-title strong, .home-search-title small { display: block; }
.home-search-title strong { font-size: .78rem; }
.home-search-title small { margin-top: 3px; color: #7d879a; font-size: .63rem; }
.home-search-field { position: relative; }
.home-search-field label { display: block; margin-bottom: 6px; color: #626d82; font-size: .65rem; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.home-search-field .form-control, .home-search-field .form-select { min-height: 43px; border-color: #dae0ea; border-radius: 9px; background-color: #fafbfd; font-size: .78rem; }
.home-search-text > i { position: absolute; bottom: 12px; left: 12px; color: #8994a7; }
.home-search-text .form-control { padding-left: 36px; }
.home-clear-button { width: 43px; height: 43px; padding: 0; border: 1px solid #d9e0eb; border-radius: 9px; color: #52617e; }
.home-clear-button span { display: none; }
.home-clear-button:hover { border-color: #3159b6; background: #3159b6; color: #fff; }

@keyframes home-filter-slide-down {
  from { opacity: 0; transform: translate(-50%,-24px); }
  to { opacity: 1; transform: translate(-50%,0); }
}

.home-intro { display: grid; grid-template-columns: .75fr 1.25fr; gap: 35px 65px; padding-top: 85px; padding-bottom: 78px; }
.home-section-kicker { display: block; margin-bottom: 8px; color: #315bc4; font-size: .69rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.home-intro h2, .home-section-header h2, .home-skylink-copy h2, .home-process h2 { margin: 0; color: #1d2942; font-family: "Montserrat", sans-serif; font-size: clamp(1.7rem,3.2vw,2.45rem); font-weight: 760; letter-spacing: -.04em; }
.home-intro > p { margin: 0; color: #69748a; font-size: .89rem; line-height: 1.8; }
.home-benefits { grid-column: span 2; display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.home-benefits > span { padding: 18px; border: 1px solid #e0e5ef; border-radius: 13px; background: #fff; }
.home-benefits i { display: block; margin-bottom: 11px; color: #315abb; font-size: 1.2rem; }
.home-benefits strong, .home-benefits small { display: block; }
.home-benefits strong { color: #303a50; font-size: .76rem; }
.home-benefits small { margin-top: 4px; color: #7c8698; font-size: .66rem; line-height: 1.45; }

.home-residences { padding: 78px 18px; background: #eef2f8; }
.home-section-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 27px; }
.home-section-header p { margin: 8px 0 0; color: #717b8e; font-size: .82rem; }
.home-result-count { padding: 8px 12px; border: 1px solid #d3ddf2; border-radius: 999px; background: #fff; color: #3156ad; font-size: .7rem; font-weight: 750; white-space: nowrap; }
.home-room-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.home-room-card { position: relative; min-width: 0; height: 410px; overflow: hidden; border-radius: 20px; background: #202b43; color: #fff; box-shadow: 0 12px 30px rgba(24,37,70,.12); isolation: isolate; transition: transform .25s ease, box-shadow .25s ease; }
.home-room-card::after { position: absolute; z-index: 1; inset: 0; background: linear-gradient(180deg,rgba(8,16,35,.03) 26%,rgba(8,16,35,.18) 52%,rgba(8,15,31,.92) 100%); content: ""; pointer-events: none; transition: background .35s ease; }
.home-room-card:hover { transform: translateY(-5px); box-shadow: 0 22px 45px rgba(24,37,70,.2); }
.home-room-card:hover::after { background: linear-gradient(180deg,rgba(8,16,35,.02) 20%,rgba(8,16,35,.14) 47%,rgba(8,15,31,.95) 100%); }
.home-room-hidden, .home-room-pending { display: none; }
.home-room-image { position: absolute; z-index: 0; inset: 0; display: block; overflow: hidden; background: #dce2ec; }
.home-room-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.home-room-card:hover .home-room-image img { transform: scale(1.045); }
.home-room-badges { position: absolute; z-index: 3; top: 18px; right: 18px; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; max-width: calc(100% - 36px); }
.home-room-tag { display: inline-flex; min-height: 32px; align-items: center; gap: 6px; padding: 7px 11px; border-radius: 999px; background: rgba(22,66,51,.88); color: #fff; box-shadow: 0 7px 18px rgba(12,21,41,.13); backdrop-filter: blur(8px); font-size: .67rem; font-weight: 760; }
.home-room-tag i { color: #75e0ad; }
.home-room-content { position: absolute; z-index: 2; right: 0; bottom: 0; left: 0; padding: 24px; }
.home-room-heading { min-width: 0; }
.home-room-heading small { display: block; overflow: hidden; color: rgba(255,255,255,.72); font-size: .67rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.home-room-heading h3 { margin: 4px 0 0; font-family: "Montserrat",sans-serif; font-size: 1.08rem; line-height: 1.35; }
.home-room-heading h3 a { color: #fff; text-decoration: none; }
.home-room-heading h3 a::after { position: absolute; inset: 0; content: ""; }
.home-room-prices { display: flex; align-items: flex-end; gap: 18px; margin-top: 11px; }
.home-price-box { position: relative; z-index: 1; min-width: 0; }
.home-price-box + .home-price-box { padding-left: 18px; border-left: 1px solid rgba(255,255,255,.35); }
.home-price-box small, .home-price-box strong, .home-price-box del { display: block; }
.home-price-box small { margin-bottom: 2px; color: rgba(255,255,255,.65); font-size: .56rem; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; }
.home-price-box strong { color: #fff; font-size: clamp(1.22rem,2vw,1.62rem); font-weight: 800; letter-spacing: -.025em; white-space: nowrap; }
.home-price-box del { margin-top: 1px; color: rgba(255,255,255,.58); font-size: .63rem; }
.home-price-box.promotion strong { color: #ffd45d; }
.home-price-box.daily strong { color: #8ee3b8; font-size: 1rem; }
.home-room-card-lower { position: relative; z-index: 3; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-top: 15px; }
.home-room-features { display: flex; min-width: 0; align-items: center; color: #fff; font-size: .68rem; font-weight: 650; }
.home-room-features span { min-width: 0; padding: 0 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.home-room-features span:first-child { padding-left: 0; }
.home-room-features span:last-child { padding-right: 0; }
.home-room-features span + span { border-left: 1px solid rgba(255,255,255,.42); }
.home-room-features i { margin-right: 6px; color: #fff; }
.home-room-footer { position: relative; z-index: 4; display: flex; flex: 0 0 auto; gap: 6px; }
.home-room-footer .btn { display: grid; width: 39px; height: 39px; min-height: 39px; padding: 0; border: 1px solid rgba(255,255,255,.3); border-radius: 10px; place-items: center; background: rgba(255,255,255,.14); color: #fff; backdrop-filter: blur(8px); font-size: .72rem; }
.home-room-footer .btn:hover { border-color: #fff; background: #fff; color: #1f3f89; }
.home-room-primary { background: rgba(255,255,255,.22) !important; opacity: 0; pointer-events: none; transform: translateX(8px); transition: opacity .22s ease, transform .22s ease, background-color .22s ease, color .22s ease; }
.home-room-primary:hover { background: #ffd45d !important; color: #17233e !important; }
.home-room-card:hover .home-room-primary, .home-room-card:focus-within .home-room-primary { opacity: 1; pointer-events: auto; transform: translateX(0); }
.home-empty { display: none; padding: 55px 20px; text-align: center; }
.home-empty-visible { display: block; }
.home-empty > i { color: #99a5ba; font-size: 2.3rem; }
.home-empty h3 { margin: 12px 0 5px; color: #303a4f; font-size: 1rem; }
.home-empty p { margin: 0 0 16px; color: #7b8597; font-size: .78rem; }
.home-load-more { margin-top: 25px; text-align: center; }
.home-outline-button { min-height: 44px; padding: 10px 17px; border: 1px solid #b9c8e7; border-radius: 9px; color: #3156ad; font-size: .75rem; font-weight: 720; }
.home-outline-button:hover { border-color: #3156ad; background: #3156ad; color: #fff; }

.home-skylink { padding: 84px 18px; background: #fff; }
.home-skylink-grid { display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: 55px; }
.home-skylink-image { position: relative; }
.home-skylink-image img { width: 100%; height: 440px; border-radius: 20px; object-fit: cover; box-shadow: 0 19px 42px rgba(28,43,80,.16); }
.home-skylink-image span { position: absolute; top: 16px; left: 16px; padding: 8px 11px; border-radius: 999px; background: rgba(16,29,65,.84); color: #fff; font-size: .67rem; font-weight: 750; }
.home-skylink-image span i { margin-right: 5px; color: #ffd45e; }
.home-skylink-copy > p { margin: 15px 0 18px; color: #6d778a; font-size: .86rem; line-height: 1.75; }
.home-skylink-copy ul { display: grid; gap: 8px; margin: 0 0 23px; padding: 0; list-style: none; color: #566176; font-size: .76rem; }
.home-skylink-copy li i { margin-right: 7px; color: #1b9564; }

.home-process { padding-top: 80px; padding-bottom: 80px; }
.home-process header { max-width: 660px; margin-bottom: 27px; }
.home-process-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; }
.home-process-grid > div { position: relative; padding: 24px; overflow: hidden; border: 1px solid #e0e5ed; border-radius: 15px; background: #fff; }
.home-process-grid > div > span { position: absolute; top: 13px; right: 16px; color: #e6eaf1; font-size: 2.2rem; font-weight: 800; }
.home-process-grid > div > i { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 11px; background: #eaf0ff; color: #3158b8; }
.home-process-grid h3 { margin: 17px 0 7px; color: #283349; font-size: .88rem; }
.home-process-grid p { margin: 0; color: #758094; font-size: .73rem; line-height: 1.6; }

.home-final-cta { padding: 49px 18px; background: #1a2b60; color: #fff; }
.home-final-cta .container-xl { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.home-final-cta span { color: #aebbe1; font-size: .68rem; font-weight: 750; text-transform: uppercase; letter-spacing: .07em; }
.home-final-cta h2 { margin: 6px 0 0; font-family: "Montserrat", sans-serif; font-size: clamp(1.35rem,3vw,2.05rem); font-weight: 750; }
.home-final-cta .btn { flex: 0 0 auto; min-height: 47px; padding: 12px 18px; border-radius: 10px; background: #fff; color: #23448f; font-size: .79rem; font-weight: 750; }
.home-final-cta .btn:hover { background: #ffd45d; }

@media (max-width: 991.98px) {
  .home-hero-grid, .home-skylink-grid { grid-template-columns: 1fr; }
  .home-search-panel { grid-template-columns: 1fr 1fr; }
  .home-search-title { grid-column: span 2; }
  .home-clear-button { width: auto; }
  .home-clear-button span { display: inline; margin-left: 6px; }
  .home-room-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 767.98px) {
  .home-hero { padding: 41px 12px 67px; }
  .home-hero-grid { gap: 35px; }
  .home-hero h1 { font-size: 2.6rem; }
  .home-visual-grid { height: 350px; }
  .home-hero-proof { gap: 13px; }
  .home-hero-proof span { padding-right: 13px; }
  .home-search-wrap { padding: 0 10px; }
  .home-search-panel { grid-template-columns: 1fr; }
  .home-search-title { grid-column: auto; }
  .home-search-wrap.is-filter-floating > .container-xl { top: 8px; width: calc(100% - 20px); }
  .home-search-wrap.is-filter-floating .home-search-panel { grid-template-columns: 1fr 1fr; gap: 8px; padding: 10px; border-radius: 14px; }
  .home-search-wrap.is-filter-floating .home-search-text { grid-column: span 2; }
  .home-search-wrap.is-filter-floating .home-clear-button { grid-column: span 2; width: 100%; height: 36px; }
  .home-search-wrap.is-filter-floating .home-search-field label { margin-bottom: 3px; font-size: .55rem; }
  .home-search-wrap.is-filter-floating .home-search-field .form-control, .home-search-wrap.is-filter-floating .home-search-field .form-select { min-height: 38px; }
  .home-search-wrap.is-filter-floating .home-search-text > i { bottom: 10px; }
  .home-intro { grid-template-columns: 1fr; padding: 65px 14px 58px; }
  .home-benefits { grid-column: auto; grid-template-columns: repeat(2,1fr); }
  .home-residences { padding: 58px 12px; }
  .home-section-header { align-items: flex-start; flex-direction: column; }
  .home-room-grid { grid-template-columns: 1fr; }
  .home-room-card { height: 390px; }
  .home-skylink { padding: 60px 12px; }
  .home-skylink-image img { height: 330px; }
  .home-process { padding: 60px 14px; }
  .home-process-grid { grid-template-columns: 1fr; }
  .home-final-cta .container-xl { align-items: stretch; flex-direction: column; }
  .home-final-cta .btn { width: 100%; }
}

@media (max-width: 420px) {
  .home-hero h1 { font-size: 2.2rem; }
  .home-hero-actions .btn { width: 100%; }
  .home-visual-grid { grid-template-columns: 1fr; grid-template-rows: 1fr; height: 300px; }
  .home-visual-grid > img:not(.home-visual-main) { display: none; }
  .home-benefits { grid-template-columns: 1fr; }
  .home-room-card { height: 380px; border-radius: 17px; }
  .home-room-badges { top: 14px; right: 14px; }
  .home-room-content { padding: 18px; }
  .home-room-prices { gap: 12px; }
  .home-price-box + .home-price-box { padding-left: 12px; }
  .home-room-card-lower { gap: 8px; }
  .home-room-features { font-size: .62rem; }
  .home-room-features span { padding: 0 8px; }
  .home-room-footer { gap: 4px; }
  .home-room-footer .btn { width: 35px; height: 35px; min-height: 35px; }
}
