

.mobile-menu-toggle,
.mobile-menu-drawer { display:none; }

@media (max-width: 991px) {
    html { scroll-padding-top: 78px; }
    body { overflow-x:hidden; }

    /* HEADER */
    .topbar.topbar-sticky {
        position: fixed;
        top: 10px;
        /* left: 12px; */
        /* right: 12px; */
        width: auto;
        height: 62px;
        padding: 0 10px 0 14px;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto auto;
        align-items: center;
        gap: 8px;
        border-radius: 18px;
        background: rgba(238, 233, 227, .90);
        border: 1px solid rgba(28, 54, 69, .08);
        box-shadow: 0 12px 36px rgba(14, 35, 46, .12);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
        z-index: 99;
        width: 85%;
        margin-left: -16px;
        
    }

    .topbar .logo { min-width:0; display:flex; align-items:center; }
    .topbar .logo img {
        width:auto!important;
        height:44px!important;
        max-width:138px;
        object-fit:contain;
        object-position:left center;
    }

    .topbar-nav,
    .header-socials,
    .top-actions > .request-call-btn { display:none!important; }

    .top-actions {
        display:flex!important;
        align-items:center;
        gap:7px;
        justify-self:end;
    }

    .language-switcher { position:relative; }
    .language-current {
        min-width:46px!important;
        height:42px!important;
        padding:0 10px!important;
        border-radius:13px!important;
        background:rgba(255,255,255,.58)!important;
        border:1px solid rgba(24,56,75,.08)!important;
    }
    .language-current svg { width:14px!important; }
    .language-menu {
        position:fixed!important;
        top:82px!important;
        left:12px!important;
        right:12px!important;
        width:auto!important;
        max-height:min(72dvh,430px);
        overflow:auto;
        border-radius:18px!important;
        padding:8px!important;
        box-shadow:0 22px 70px rgba(15,38,50,.22)!important;
    }
    .language-option { min-height:54px; border-radius:12px; }

    .mobile-menu-toggle {
        display:grid;
        place-items:center;
        position:relative;
        width:42px;
        height:42px;
        padding:0;
        border:1px solid rgba(24,56,75,.08);
        border-radius:13px;
        background:rgba(255,255,255,.62);
        cursor:pointer;
        z-index:2;
    }
    .mobile-menu-toggle span {
        position:absolute;
        width:17px;
        height:1.5px;
        background:#17384b;
        border-radius:10px;
        transition:transform .25s ease, top .25s ease;
    }
    .mobile-menu-toggle span:first-child { top:16px; }
    .mobile-menu-toggle span:last-child { top:24px; }
    .mobile-menu-toggle.active span:first-child { top:20px; transform:rotate(45deg); }
    .mobile-menu-toggle.active span:last-child { top:20px; transform:rotate(-45deg); }

    .mobile-menu-drawer {
        display:block;
        position:fixed;
        inset:0;
        z-index:9997;
        visibility:hidden;
        pointer-events:none;
    }
    .mobile-menu-drawer.open { visibility:visible; pointer-events:auto; }
    .mobile-menu-backdrop {
        position:absolute;
        inset:0;
        background:rgba(10,27,37,.36);
        backdrop-filter:blur(6px);
        -webkit-backdrop-filter:blur(6px);
        opacity:0;
        transition:opacity .28s ease;
    }
    .mobile-menu-drawer.open .mobile-menu-backdrop { opacity:1; }
    .mobile-menu-panel {
        position:absolute;
        top:0;
        right:0;
        width:min(88vw,390px);
        height:100dvh;
        padding:20px 18px max(22px,env(safe-area-inset-bottom));
        display:flex;
        flex-direction:column;
        background:#eee9e3;
        transform:translateX(102%);
        transition:transform .34s cubic-bezier(.2,.75,.2,1);
        box-shadow:-28px 0 80px rgba(10,31,42,.16);
    }
    .mobile-menu-drawer.open .mobile-menu-panel { transform:translateX(0); }
    body.mobile-menu-open { overflow:hidden!important; }
    .mobile-menu-head { display:flex; align-items:center; justify-content:space-between; }
    .mobile-menu-head img { width:128px; filter:brightness(.37) sepia(.18) saturate(.62); }
    .mobile-menu-close {
        width:42px;height:42px;border:0;border-radius:50%;background:rgba(255,255,255,.64);
        color:#17384b;font-size:24px;cursor:pointer;
    }
    .mobile-menu-nav { margin-top:54px; display:flex; flex-direction:column; }
    .mobile-menu-nav a {
        display:grid;
        grid-template-columns:38px 1fr;
        align-items:center;
        min-height:68px;
        border-bottom:1px solid rgba(23,56,75,.10);
        color:#17384b;
        text-decoration:none;
        font-family:Georgia,"Times New Roman",serif;
        font-size:27px;
        letter-spacing:-.03em;
    }
    .mobile-menu-nav a span {
        font-family:Arial,sans-serif;
        font-size:9px;
        letter-spacing:.12em;
        color:#a6805b;
    }
    .mobile-menu-call {
        margin-top:auto;
        min-height:58px;
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:16px;
        padding:6px 7px 6px 20px;
        border:0;
        border-radius:999px;
        background:#17394e;
        color:#fff;
        font:700 13px/1.2 inherit;
    }
    .mobile-menu-call i {
        width:44px;height:44px;display:grid;place-items:center;border-radius:50%;
        background:rgba(255,255,255,.12);font-style:normal;
    }
    .mobile-menu-socials { display:flex; gap:16px; flex-wrap:wrap; margin-top:18px; }
    .mobile-menu-socials a { color:#657983; text-decoration:none; font-size:11px; font-weight:700; }

    /* HERO */
    .selector-hero,
    .selector-hero-reference {
        height:100dvh!important;
        min-height:700px!important;
        max-height:none!important;
        overflow:hidden;
    }
    .hero-render {
        width:100%!important;
        height:100%!important;
        object-fit:cover!important;
        object-position:72% center!important;
        transform:none!important;
    }
    .hero-reference-light { background:linear-gradient(180deg,rgba(245,242,237,.12),rgba(245,242,237,0) 26%,rgba(13,43,59,.05) 68%,rgba(13,43,59,.32) 100%)!important; }
    .hero-reference-vignette { opacity:.22!important; }

    .intro-copy.intro-copy-reference {
        top:94px!important;
        left:18px!important;
        right:18px!important;
        width:auto!important;
        max-width:390px!important;
        z-index:18;
    }
    .intro-copy-reference .hero-kicker-row { margin-bottom:9px!important; }
    .intro-copy-reference .eyebrow { font-size:8px!important; letter-spacing:.14em!important; }
    .intro-copy-reference h1 {
        max-width:330px;
        margin:0!important;
        font-size:clamp(42px,11vw,58px)!important;
        line-height:.91!important;
        letter-spacing:-.055em!important;
        text-wrap:balance;
    }
    .intro-copy-reference p { display:block!important; max-width:270px; margin-top:12px!important; font-size:11px!important; line-height:1.55!important; }
    .hero-view-features { display:none!important; }

    .building-stage,
    .building-stage-reference {
        position:absolute!important;
        inset:0!important;
        width:100%!important;
        height:100%!important;
        pointer-events:none;
        margin-left: -63%!important;
    }
    .building-stage .floor-map { pointer-events:auto; }
    .floor-select-guide,
    .b-block-hover-info,
    .hover-label { display:none!important; }

    .selector-card.auto-card,
    .selector-card-reference {
        position:absolute!important;
        left:12px!important;
        right:12px!important;
        bottom:max(18px,env(safe-area-inset-bottom))!important;
        top:auto!important;
        width:auto!important;
        min-width:0!important;
        padding:12px!important;
        border-radius:20px!important;
        background:rgb(255 255 255 / 76%) !important;
        border:1px solid rgba(255,255,255,.16)!important;
        box-shadow:0 20px 60px rgba(7,26,38,.22)!important;
        backdrop-filter:blur(16px)!important;
        -webkit-backdrop-filter:blur(16px)!important;
        z-index:30!important;
    }
    .selector-card-head { display:none!important; }
    .selector-card-copy { display:block!important; margin:0 0 9px!important; color:rgba(255,255,255,.70)!important; font-size:9px!important; line-height:1.4!important; }
    .live-floor-card,
    .live-floor-card-reference {
        min-height:68px!important;
        display:grid!important;
        grid-template-columns:78px 1fr!important;
        align-items:center;
        margin:0!important;
        border:1px solid rgba(255,255,255,.14)!important;
        background:rgba(255,255,255,.06)!important;
        border-radius:15px!important;
        overflow:hidden;
    }
    .live-block-label {
        height:100%;
        display:grid!important;
        place-items:center;
        margin:0!important;
        padding:0 9px!important;
        border-right:1px solid rgba(255,255,255,.14);
        font-size:9px!important;
        line-height:1.25;
        text-align:center;
        letter-spacing:.12em!important;
    }
    .live-main-values { display:grid!important; grid-template-columns:1fr auto 1fr; align-items:center; padding:7px 10px!important; }
    .live-main-value { min-width:0!important; text-align:center; }
    .live-main-value strong { font-size:31px!important; line-height:1!important; }
    .live-main-value small { display:block!important; margin-top:3px; font-size:7px!important; line-height:1.15!important; letter-spacing:.08em!important; }
    .live-value-separator { height:32px!important; opacity:.25; }
    .availability-key-reference { display:none!important; }
    .scroll-explore { display:none!important; }

    /* SECTIONS */
    .project-section-v2,
    .gallery-showcase,
    .contact-section { scroll-margin-top:78px; }

    .project-section-v2 { padding:72px 16px!important; }
    .project-v2-head { gap:20px!important; margin-bottom:34px!important; }
    .project-v2-index { display:flex!important; align-items:baseline; gap:10px; }
    .project-v2-index span { font-size:30px!important; }
    .project-v2-index small { padding:0!important; }
    .project-v2-title h2 { font-size:clamp(40px,11vw,52px)!important; line-height:.98!important; }
    .project-v2-intro { max-width:none!important; }
    .project-v2-intro p { font-size:13px!important; line-height:1.7!important; }
    .project-v2-link { margin-top:5px!important; }
    .project-v2-visual { min-height:330px!important; border-radius:18px!important; }
    .project-v2-visual img { min-height:330px!important; object-position:center!important; }
    .project-v2-visual-tag { left:12px!important; bottom:12px!important; max-width:calc(100% - 24px); }
    .project-v2-features { margin-top:18px!important; }
    .project-feature { padding:18px 8px 18px 0!important; display:grid; grid-template-columns:42px 1fr 22px; gap:6px; align-items:start; }
    .project-feature-number { margin:0!important; font-size:15px!important; }
    .project-feature h3 { margin:0 0 5px!important; font-size:16px!important; }
    .project-feature p { font-size:11px!important; line-height:1.55!important; }
    .project-feature-arrow { position:static!important; justify-self:end; }

    .gallery-showcase { padding:72px 16px!important; }
    .gallery-showcase-head { margin-bottom:26px!important; align-items:flex-start!important; gap:16px!important; }
    .gallery-showcase-head h2 { font-size:clamp(40px,10vw,50px)!important; }
    .gallery-showcase-counter { flex:0 0 auto; padding-top:8px; }
    .gallery-showcase-counter strong { font-size:22px!important; }
    .gallery-showcase-counter i { width:22px!important; }
    .gallery-showcase-main { height:52dvh!important; min-height:390px!important; max-height:560px!important; border-radius:18px!important; }
    .gallery-showcase-caption { left:14px!important; right:14px!important; bottom:14px!important; }
    .gallery-showcase-caption h3 { font-size:26px!important; }
    .gallery-showcase-nav { left:12px!important; right:12px!important; bottom:12px!important; }
    .gallery-showcase-thumbs { margin-top:12px!important; gap:8px!important; overflow-x:auto!important; padding-bottom:6px!important; scrollbar-width:none; }
    .gallery-showcase-thumbs::-webkit-scrollbar { display:none; }
    .gallery-thumb { flex:0 0 84px!important; height:64px!important; border-radius:10px!important; }

    .contact-section { padding:72px 16px!important; }
    .contact-section-head { margin-bottom:34px!important; gap:18px!important; }
    .contact-section-number { align-items:baseline!important; }
    .contact-section-number span { font-size:30px!important; }
    .contact-section-title h2 { font-size:clamp(40px,10vw,50px)!important; }
    .contact-section-intro p { font-size:13px!important; line-height:1.65!important; }
    .contact-layout { gap:18px!important; }
    .contact-details { gap:9px!important; }
    .contact-info-card { min-height:86px!important; padding:14px!important; border-radius:15px!important; }
    .contact-map { height:300px!important; margin-top:12px!important; border-radius:18px!important; }
    .contact-map-badge { left:12px!important; bottom:12px!important; }
    .contact-form-wrap { padding:22px 16px!important; border-radius:18px!important; }
    .contact-form-heading h3 { font-size:36px!important; }
    .contact-form-heading p { margin:13px 0 22px!important; }
    .contact-form-grid { grid-template-columns:1fr!important; gap:14px!important; }
    .contact-field-full { grid-column:auto!important; }
    .contact-field input,
    .contact-field textarea,
    .call-request-form input,
    .call-request-form textarea { font-size:16px!important; }
    .contact-field input { height:54px!important; }
    .contact-form-bottom { margin-top:18px!important; gap:14px!important; }
    .contact-form-bottom p { max-width:none!important; }
    .contact-submit { width:100%!important; justify-content:space-between!important; min-height:56px!important; }

    footer { padding:38px 18px!important; gap:14px!important; }

    /* FLOOR MODAL */
    .floor-modal .modal-shell,
    .apartment-modal .apartment-shell {
        width:100vw!important;
        height:100dvh!important;
        max-width:none!important;
        max-height:none!important;
        border-radius:0!important;
    }
    .floor-modal .modal-head,
    .apartment-modal .modal-head {
        height:62px!important;
        min-height:62px!important;
        padding:0 10px!important;
        display:grid!important;
        grid-template-columns:auto 1fr auto!important;
        gap:8px!important;
    }
    .floor-modal .modal-brand img,
    .apartment-modal .modal-brand img { width:78px!important; height:40px!important; object-fit:contain!important; }
    .floor-modal .modal-brand span,
    .apartment-modal .modal-brand span { display:none!important; }
    .floor-modal .modal-breadcrumb,
    .apartment-modal .modal-breadcrumb {
        display:flex!important;
        min-width:0;
        gap:5px!important;
        overflow:hidden;
        white-space:nowrap;
        flex-wrap:nowrap!important;
        font-size:9px!important;
    }
    .floor-modal .modal-breadcrumb > *,
    .apartment-modal .modal-breadcrumb > * { flex:0 0 auto; }
    .floor-modal .modal-breadcrumb .modal-go-back,
    .apartment-modal .modal-breadcrumb .modal-go-back { display:none!important; }
    .floor-modal .modal-close,
    .apartment-modal .modal-close { width:40px!important; height:40px!important; min-width:40px!important; }

    .floor-modal .floor-modal-body {
        height:calc(100dvh - 62px)!important;
        display:grid!important;
        grid-template-columns:1fr!important;
        grid-template-rows:auto minmax(0,1fr) auto!important;
        overflow:hidden!important;
    }
    .floor-modal .modal-side-modern {
        min-height:0!important;
        padding:10px 14px!important;
        display:grid!important;
        grid-template-columns:minmax(0,1fr) auto!important;
        gap:10px!important;
        align-items:center!important;
        border-right:0!important;
        border-bottom:1px solid rgba(20,63,88,.07)!important;
    }
    .floor-modal .modal-side-top { gap:4px!important; min-width:0; }
    .floor-modal .step-pill,
    .floor-modal .modal-side-modern p,
    .floor-modal .legend-modern { display:none!important; }
    .floor-modal .modal-side-modern h2 { font-size:22px!important; line-height:1!important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .floor-modal .selected-summary-modern {
        margin:0!important;
        padding:8px 10px!important;
        border-radius:12px!important;
        min-width:128px;
        box-shadow:none!important;
    }
    .floor-modal .selected-summary-modern small { margin-bottom:3px!important; font-size:7px!important; }
    .floor-modal .selected-summary-modern strong { font-size:15px!important; white-space:nowrap; }
    .floor-modal #changeFloorBtn { margin-top:5px!important; font-size:10px!important; }

    .floor-modal .floor-plan-stage {
        padding:8px!important;
        min-height:0!important;
        overflow:hidden!important;
    }
    .floor-modal .plan-canvas {
        width:min(100%,72dvh)!important;
        height:auto!important;
        max-height:100%!important;
        aspect-ratio:5804/4762!important;
        margin:auto!important;
    }
    .floor-modal .plan-actions { bottom:8px!important; }
    .floor-modal .orientation { font-size:8px!important; }

    .floor-modal .apartment-list-panel {
        min-height:166px!important;
        max-height:184px!important;
        padding:10px 10px max(10px,env(safe-area-inset-bottom))!important;
        border-left:0!important;
        border-top:1px solid rgba(20,63,88,.07)!important;
        overflow:hidden!important;
    }
    .floor-modal .list-head { margin-bottom:7px!important; }
    .floor-modal .filter-tabs { gap:3px!important; overflow-x:auto; flex-wrap:nowrap!important; scrollbar-width:none; }
    .floor-modal .filter-tabs::-webkit-scrollbar { display:none; }
    .floor-modal .filter-tabs button { white-space:nowrap!important; min-height:30px!important; padding:0 10px!important; font-size:9px!important; }
    .floor-modal .apartment-list {
        height:100px!important;
        display:flex!important;
        gap:7px!important;
        overflow-x:auto!important;
        overflow-y:hidden!important;
        overscroll-behavior-x:contain;
        -webkit-overflow-scrolling:touch;
        scrollbar-width:none;
    }
    .floor-modal .apartment-list::-webkit-scrollbar { display:none; }
    .floor-modal .apartment-item {
        flex:0 0 150px!important;
        min-width:150px!important;
        min-height:78px!important;
        padding:10px!important;
        margin:0!important;
        border-radius:13px!important;
    }

    /* APARTMENT MODAL */
    .apartment-modal-body {
        height:calc(100dvh - 62px)!important;
        display:flex!important;
        flex-direction:column!important;
        overflow-y:auto!important;
        -webkit-overflow-scrolling:touch;
        overscroll-behavior:contain;
    }
    .apartment-modal .apartment-visual {
        flex:0 0 46dvh!important;
        min-height:300px!important;
        padding:8px 10px 0!important;
        border-right:0!important;
        position:relative!important;
    }
    .apartment-modal .apartment-plan-wrap {
        width:100%!important;
        height:calc(100% - 42px)!important;
        overflow:hidden!important;
    }
    .apartment-modal #apartmentPlan { padding:8px!important; }
    .apartment-modal .apartment-plan-wrap::after { right:9px!important; bottom:9px!important; min-height:28px!important; padding:0 9px!important; font-size:7px!important; }
    .apartment-modal .visual-label {
        position:static!important;
        height:40px!important;
        padding:0 2px!important;
        display:flex!important;
        align-items:center!important;
        justify-content:space-between!important;
        display: none!important;
    }
    .apartment-modal .apartment-info {
        flex:0 0 auto!important;
        max-height:none!important;
        padding:18px 16px max(20px,env(safe-area-inset-bottom))!important;
        border-left:0!important;
        border-top:1px solid rgba(45,60,68,.06)!important;
    }
    .apartment-modal .apartment-info h2 { margin:12px 0 6px!important; font-size:36px!important; }
    .apartment-modal .apt-area { margin-bottom:16px!important; }
    .apartment-modal .apt-area b { font-size:44px!important; }
    .apartment-modal .apt-spec-grid { margin:14px 0!important; gap:8px!important; }
    .apartment-modal .apt-spec-grid > div { min-height:68px!important; padding:11px!important; border-radius:13px!important; }
    .apartment-modal .apt-spec-grid strong { font-size:17px!important; }
    .apartment-modal .apt-description { display:block!important; margin-top:14px!important; font-size:12px!important; line-height:1.6!important; }
    .apartment-modal .apt-contact { margin-top:16px!important; min-height:58px!important; padding:12px 14px!important; }
    .apartment-modal .apt-nav { position:sticky; bottom:0; z-index:4; padding-top:10px; background:linear-gradient(180deg,rgba(247,244,240,0),#f7f4f0 26%); }
    .apartment-modal .apt-nav button { min-height:48px!important; }

    .apt-image-zoom-modal { padding:0!important; }
    .apt-image-zoom-dialog { width:100vw!important; height:100dvh!important; border-radius:0!important; border:0!important; }
    .apt-image-zoom-stage { padding:54px 12px 76px!important; }
    .apt-image-zoom-controls { bottom:max(12px,env(safe-area-inset-bottom))!important; max-width:calc(100vw - 24px); }

    /* CALL MODALS */
    .call-modal-card,
    .call-request-box {
        width:calc(100vw - 20px)!important;
        max-width:none!important;
        max-height:calc(100dvh - 20px)!important;
        overflow-y:auto!important;
        padding:28px 18px max(20px,env(safe-area-inset-bottom))!important;
        border-radius:20px!important;
    }
    .call-request-fields { grid-template-columns:1fr!important; }
    .call-request-field.full { grid-column:auto!important; }
    .call-modal input,
    .call-request-box input { font-size:16px!important; }
}

@media (max-width: 560px) {
    .selector-hero,
    .selector-hero-reference { min-height:660px!important; }
    .intro-copy.intro-copy-reference { top:90px!important; }
    .intro-copy-reference h1 { max-width:290px; font-size:42px!important; }
    .intro-copy-reference p { max-width:235px; font-size:10px!important; }

    .selector-card-copy { display:none!important; }
    .selector-card.auto-card { padding:10px!important; }
    .live-floor-card { min-height:62px!important; }
    .live-main-value strong { font-size:28px!important; }

    .gallery-showcase-head { display:grid!important; grid-template-columns:1fr auto!important; }
    .gallery-showcase-head > div:first-child { min-width:0; }
    .gallery-showcase-counter { gap:7px!important; }
    .gallery-showcase-counter i { display:none!important; }
    .gallery-showcase-main { min-height:350px!important; height:48dvh!important; }

    .contact-info-card { grid-template-columns:38px 1fr auto!important; gap:10px!important; }
    .contact-info-icon { width:38px!important; height:38px!important; }

    .floor-modal .modal-breadcrumb i:nth-of-type(2),
    .floor-modal .modal-breadcrumb > span,
    .apartment-modal .modal-breadcrumb i:nth-of-type(2) { display:none!important; }

    .floor-modal .modal-side-modern { grid-template-columns:1fr auto!important; }
    .floor-modal .modal-side-modern h2 { font-size:19px!important; }
    .floor-modal .selected-summary-modern { min-width:112px; }
    .floor-modal .apartment-list-panel { min-height:158px!important; }
    .floor-modal .apartment-item { flex-basis:142px!important; min-width:142px!important; }

    .apartment-modal .apartment-visual { flex-basis:42dvh!important; min-height:275px!important; }
    .apartment-modal .apartment-info h2 { font-size:33px!important; }
    .apartment-modal .apt-area b { font-size:40px!important; }
}

@media (max-width: 380px) {
    .topbar.topbar-sticky { left:8px; right:8px; padding-left:10px; }
    .topbar .logo img { max-width:112px; }
    .intro-copy-reference h1 { font-size:38px!important; }
    .project-v2-title h2,
    .gallery-showcase-head h2,
    .contact-section-title h2 { font-size:38px!important; }
    .mobile-menu-panel { width:94vw; }
    .floor-modal .modal-breadcrumb { font-size:8px!important; }
}

@media (hover:none) and (pointer:coarse) {
    .floor-poly,
    .apt-polygon { -webkit-tap-highlight-color:transparent; }
    .floor-poly:hover { fill:transparent; stroke:transparent; filter:none; }
    .floor-poly.selected { fill:rgba(30,194,255,.34); stroke:rgba(223,249,255,.98); filter:drop-shadow(0 0 15px rgba(0,190,255,.96)); }
    button,a { -webkit-tap-highlight-color:transparent; }
}
