.planDetailPage {
            background: #f7f6f4;
        }

        .planDetailPage .perfDetailContent {
            background: #f7f6f4;
            overflow-x: hidden;
        }

        
        .planReveal {
            opacity: 0;
            transition: opacity .7s ease;
            will-change: opacity;
            overflow-anchor: none;
        }

        .planReveal.is-visible {
            opacity: 1;
            will-change: auto;
        }

        @media (prefers-reduced-motion: reduce) {
            .planReveal {
                opacity: 1;
                transition: none;
            }
        }

        .planDetailHero {
            width: 100%;
            background: linear-gradient(135deg, #eceae6 0%, #ffffff 42%, #ffffff 58%, #e8e6e2 100%);
        }

        .planDetailHero__slider {
            width: 100%;
            max-width: 1100px;
            margin-inline: auto;
        }

        .planDetailHero__media {
            position: relative;
            width: 100%;
            height: min(66.67vw, 750px);
            max-height: 750px;
            overflow: hidden;
        }

        .planDetailHero__stage {
            position: absolute;
            inset: 0;
        }

        .planDetailHero__img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center center;
        }

        .planDetailHero__placeholderSlide {
            display: grid;
            place-items: center;
            width: 100%;
            height: 100%;
            font-size: clamp(13px, 1.2vw, 14px);
            letter-spacing: .08em;
            color: rgba(17, 17, 17, .42);
            background: linear-gradient(135deg, #eceae6 0%, #e2dfda 100%);
        }

        .planDetailHero__placeholderSlide[hidden],
        .planDetailHero__img[hidden] {
            display: none;
        }

        .planDetailHero__fade {
            position: absolute;
            inset: 0;
            z-index: 2;
            background: #fff;
            opacity: 0;
            pointer-events: none;
            transition: opacity .4s ease;
        }

        .planDetailHero__fade.is-visible {
            opacity: 1;
        }

        .planDetailHero__label {
            position: absolute;
            left: clamp(16px, 3vw, 32px);
            top: clamp(18px, 2.8vw, 32px);
            bottom: auto;
            z-index: 3;
            margin: 0;
            font-family: "Inter", system-ui, sans-serif;
            font-size: clamp(11px, 1.1vw, 12px);
            font-weight: 500;
            letter-spacing: .16em;
            color: rgba(255, 255, 255, .95);
            pointer-events: none;
        }

        @media (min-width: 900px) {
            .planDetailHero__label {
                font-size: 15px;
            }
        }

        .planDetailHero__indicators {
            position: absolute;
            left: 50%;
            bottom: clamp(20px, 3vw, 36px);
            right: auto;
            z-index: 3;
            display: flex;
            align-items: center;
            gap: 8px;
            margin: 0;
            padding: 0;
            border: 0;
            transform: translateX(-50%);
        }

        .planDetailHero__bar {
            width: clamp(28px, 4vw, 40px);
            height: 3px;
            padding: 0;
            border: 0;
            border-radius: 2px;
            background: rgba(255, 255, 255, .32);
            cursor: pointer;
            transition: background .25s ease, transform .25s ease;
        }

        .planDetailHero__bar:hover {
            background: rgba(255, 255, 255, .55);
        }

        .planDetailHero__bar.is-active {
            background: rgba(255, 255, 255, .95);
        }

        .planDetailHero__bar:focus-visible {
            outline: 2px solid rgba(255, 255, 255, .9);
            outline-offset: 3px;
        }

        .planDetailHero__media.is-placeholder .planDetailHero__label {
            color: rgba(17, 17, 17, .55);
        }

        .planDetailHero__media.is-placeholder .planDetailHero__bar {
            background: rgba(17, 17, 17, .16);
        }

        .planDetailHero__media.is-placeholder .planDetailHero__bar:hover {
            background: rgba(17, 17, 17, .28);
        }

        .planDetailHero__media.is-placeholder .planDetailHero__bar.is-active {
            background: rgba(17, 17, 17, .72);
        }

        .planDetailHero__media.is-placeholder .planDetailHero__bar:focus-visible {
            outline-color: rgba(17, 17, 17, .55);
        }

        @media (prefers-reduced-motion: reduce) {
            .planDetailHero__fade {
                transition-duration: .01ms;
            }
        }

        .planDetailHero__placeholder {
            display: grid;
            place-items: center;
            width: 100%;
            height: min(66.67vw, 750px);
            max-height: 750px;
            font-size: clamp(13px, 1.2vw, 14px);
            letter-spacing: .08em;
            color: rgba(17, 17, 17, .42);
            background: linear-gradient(135deg, #eceae6 0%, #e2dfda 100%);
        }

        .planDetailIntro {
    width: 100%;
    margin: 0;
            padding: clamp(40px, 6vw, 72px) clamp(20px, 4vw, 40px) clamp(32px, 5vw, 56px);
        }

        .planDetailIntro__code {
            margin: 0;
            font-family: "Inter", system-ui, sans-serif;
    font-size: 11px;
            font-weight: 500;
            letter-spacing: .2em;
            text-transform: uppercase;
            color: rgba(17, 17, 17, .42);
        }

        .planDetailIntro__title {
            margin: clamp(12px, 1.6vw, 16px) 0 0;
    font-size: clamp(32px, 4.4vw, 46px);
            font-weight: 600;
            line-height: 1.25;
            letter-spacing: .04em;
            color: #0a0a0a;
        }

        .planDetailIntro__meta {
            margin: clamp(16px, 2vw, 22px) 0 0;
    font-size: clamp(15px, 1.45vw, 17px);
    line-height: 1.75;
            color: rgba(17, 17, 17, .55);
        }

        .planDetailIntro__metaItem {
            display: block;
        }

        .planDetailIntro__price {
            margin: clamp(28px, 3.5vw, 40px) 0 0;
            font-size: clamp(14px, 1.35vw, 16px);
            line-height: 1.7;
            color: #0a0a0a;
        }

        .planDetailIntro__priceLabel {
            display: block;
            margin-bottom: 6px;
            font-family: "Inter", system-ui, sans-serif;
            font-size: 10px;
            font-weight: 500;
            letter-spacing: .16em;
            text-transform: uppercase;
            color: rgba(17, 17, 17, .42);
        }

        .planDetailIntro__priceValue {
            font-size: clamp(22px, 2.8vw, 30px);
            font-weight: 600;
            letter-spacing: .02em;
        }

        .planDetailIntro__note {
            margin: clamp(10px, 1.2vw, 14px) 0 0;
            font-size: 12px;
            line-height: 1.75;
            color: rgba(17, 17, 17, .48);
        }

        .planDetailSection {
    width: 100%;
    margin: 0;
            padding: 0 clamp(20px, 4vw, 40px) clamp(56px, 8vw, 96px);
        }

        .planDetailSection__title {
            margin: 0 0 clamp(18px, 2.4vw, 28px);
            font-size: clamp(18px, 2vw, 22px);
            font-weight: 600;
            letter-spacing: .04em;
            color: #0a0a0a;
        }

        .planDetailSection__head .planDetailSection__title {
            margin-bottom: 6px;
        }

        .planDetailSection__tag {
            margin: 0 0 clamp(18px, 2.4vw, 28px);
            font-family: "Inter", system-ui, sans-serif;
            font-size: 11px;
            font-weight: 500;
            letter-spacing: .16em;
            text-transform: uppercase;
            color: rgba(17, 17, 17, .42);
        }

        #plan-detail-gallery-heading {
            font-size: clamp(24px, 3.2vw, 32px);
        }

        .planDetailSection__lede {
            margin: 0 0 clamp(28px, 4vw, 44px);
            max-width: 40em;
            font-size: clamp(14px, 1.35vw, 16px);
            line-height: 1.95;
            color: rgba(17, 17, 17, .68);
            line-break: strict;
            word-break: keep-all;
            overflow-wrap: anywhere;
            text-wrap: pretty;
        }

        .planDetailSection__ledeGroup {
            margin: 0 0 clamp(28px, 4vw, 44px);
            max-width: 40em;
        }

        .planDetailSection__ledeGroup .planDetailSection__lede {
            margin: 0;
            max-width: none;
        }

        .planDetailSection__ledeGroup .planDetailSection__lede + .planDetailSection__lede {
            margin-top: 1em;
        }

        .planDetailGallery {
            display: grid;
            gap: clamp(36px, 5vw, 56px);
            width: 100%;
            max-width: 1100px;
            margin-inline: auto;
        }

        .planDetailSection--overview {
            padding-bottom: clamp(28px, 4vw, 44px);
        }

        .planDetailSection--overview .planDetailSection__ledeGroup {
            margin-bottom: 0;
        }

        .planDetailSection--overview .planDetailPoints {
            margin-top: clamp(28px, 4vw, 40px);
        }

        .planDetailSection--floor {
            padding-bottom: clamp(28px, 4vw, 44px);
        }

        .planDetailSection--interiorGallery {
            padding-top: 0;
            padding-left: 0;
            padding-right: 0;
        }

        .planDetailSection--interiorGallery .planDetailSection__title {
            padding: 0 clamp(20px, 4vw, 40px);
        }

        .planDetailSection--interiorGallery .planDetailFigure__caption {
            padding: 0 clamp(20px, 4vw, 40px);
            max-width: none;
        }

        .planDetailGalleryGroup {
            margin: 0;
        }

        .planDetailGalleryStack {
            display: grid;
            gap: 0;
        }

        .planDetailGalleryStack .planDetailFigure__media + .planDetailFigure__media {
            border-top: 1px solid rgba(17, 17, 17, .06);
        }

        .planDetailGalleryPair {
            display: flex;
            justify-content: space-evenly;
            align-items: flex-start;
            background: transparent;
        }

        .planDetailGalleryPair .planDetailFigure__media--portrait {
            flex: 0 0 auto;
            width: min(calc(750px * 1000 / 1778), calc((100% - 2 * clamp(20px, 6vw, 40px)) / 2));
            aspect-ratio: 1000 / 1778;
            max-height: 750px;
            overflow: hidden;
            background: #e8e6e2;
        }

        .planDetailGalleryPair .planDetailFigure__media--portrait img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center center;
        }

        .planDetailSection--interiorGallery .planDetailFigure__media {
            border-radius: 0;
        }

        .planDetailFigure {
            margin: 0;
        }

        .planDetailFigure__media {
            overflow: hidden;
            border-radius: 4px;
            background: #e8e6e2;
            aspect-ratio: 16 / 10;
            max-height: 750px;
        }

        .planDetailFigure__media img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center center;
        }

        .planDetailFigure__caption {
            margin: clamp(14px, 1.8vw, 18px) 0 0;
            max-width: 42em;
            font-size: clamp(13px, 1.25vw, 15px);
            line-height: 1.85;
            color: rgba(17, 17, 17, .62);
        }

        .planDetailFigure__caption strong {
            display: block;
            margin-bottom: 6px;
            font-size: clamp(14px, 1.35vw, 16px);
            font-weight: 600;
            color: #0a0a0a;
        }

        .planDetailFloor {
            margin: 0;
        }

        .planDetailFloor__media {
            position: relative;
            max-width: 1100px;
            margin-inline: auto;
            overflow: hidden;
            border-radius: 4px;
            background: #eceae6;
        }

        .planDetailFloor__media:not(.planDetailFloor__media--modal) {
            max-height: 750px;
        }

        .planDetailFloor__media img {
            display: block;
            width: 100%;
            height: auto;
        }

        .planDetailFloor__media:not(.planDetailFloor__media--modal) img {
            max-height: 750px;
            object-fit: contain;
        }

        .planDetailFloor__label {
            position: absolute;
            display: inline-block;
            margin: 0;
            padding-bottom: 6px;
            border-bottom: 1px solid rgba(17, 17, 17, .28);
            color: rgba(17, 17, 17, .58);
            font-size: clamp(15px, 1.4vw, 18px);
            font-weight: 600;
            letter-spacing: .06em;
            line-height: 1;
            pointer-events: none;
        }

        .planDetailFloor__label--1f {
            top: 5.5%;
            left: 3.5%;
        }

        .planDetailFloor__label--loft {
            top: 5.5%;
            left: 55%;
        }

        .planDetailFloor__label--2f {
            top: 5.5%;
            left: 55%;
        }

        .planDetailFloor__zoom {
            display: none;
        }

        .planDetailFloorModal {
            position: fixed;
            inset: 0;
            z-index: 1200;
        }

        .planDetailFloorModal[hidden] {
            display: none;
        }

        .planDetailFloorModal__overlay {
            position: absolute;
            inset: 0;
            background: rgba(17, 17, 17, .72);
        }

        .planDetailFloorModal__panel {
            position: relative;
            z-index: 1;
            display: flex;
            flex-direction: column;
            width: 100%;
            height: 100%;
            padding: clamp(16px, 4vw, 28px);
            box-sizing: border-box;
        }

        .planDetailFloorModal__close {
            align-self: flex-end;
            flex: 0 0 auto;
            width: 40px;
            height: 40px;
            margin: 0 0 12px;
            padding: 0;
            border: 0;
            border-radius: 999px;
            background: rgba(255, 255, 255, .92);
            color: #0a0a0a;
            font-size: 24px;
            line-height: 1;
            cursor: pointer;
        }

        .planDetailFloorModal__scroll {
            flex: 1 1 auto;
            min-height: 0;
            overflow: auto;
            -webkit-overflow-scrolling: touch;
            border-radius: 4px;
            background: #f7f6f4;
        }

        .planDetailFloor__media--modal {
            max-width: none;
            width: 1100px;
            margin: 0 auto;
            border-radius: 0;
        }

        .planDetailFloor__media--modal .planDetailFloor__label {
            font-size: clamp(15px, 1.4vw, 18px);
            padding-bottom: 6px;
            border-bottom: 1px solid rgba(17, 17, 17, .28);
        }

        body.planDetailFloorModal-open {
            overflow: hidden;
        }

        .planDetailFigure__media--blank {
            background: #dcd9d4;
        }

        .planDetailFigure__media--portrait.planDetailFigure__media--blank {
            aspect-ratio: 10 / 17.78;
            max-height: 750px;
        }

        .planDetailFloor__media--blank {
            position: relative;
            aspect-ratio: 1300 / 731;
            max-width: 1100px;
            max-height: 750px;
            background: #dcd9d4;
            display: grid;
            place-items: center;
        }

        .planDetailFloor__media--blank .planDetailFloor__placeholder {
            aspect-ratio: auto;
            max-width: none;
            background: transparent;
        }

        .planDetailFloor__placeholder {
            display: grid;
            place-items: center;
            aspect-ratio: 4 / 3;
            max-width: 48rem;
            border-radius: 4px;
            background: #eceae6;
            font-size: 13px;
            letter-spacing: .06em;
            color: rgba(17, 17, 17, .42);
        }

        .planDetailPoints {
            display: grid;
            gap: clamp(20px, 2.8vw, 28px);
            margin: 0;
            padding: 0;
            list-style: none;
        }

        .planDetailPoints__item {
            padding-top: clamp(18px, 2.2vw, 24px);
            border-top: 1px solid rgba(17, 17, 17, .1);
        }

        .planDetailPoints__title {
            margin: 0 0 8px;
            font-size: clamp(15px, 1.4vw, 17px);
            font-weight: 600;
            color: #0a0a0a;
        }

        .planDetailPoints__text {
            margin: 0;
            max-width: 40em;
            font-size: clamp(13px, 1.25vw, 15px);
            line-height: 1.9;
            color: rgba(17, 17, 17, .65);
        }

        .planDetailCta {
    width: 100%;
    margin: 0;
            padding: 0 clamp(20px, 4vw, 40px) clamp(56px, 7vw, 88px);
        }

        .planDetailCta__inner {
            padding: clamp(28px, 4vw, 40px) 0 clamp(12px, 1.5vw, 20px);
            border-top: 1px solid rgba(17, 17, 17, .1);
        }

        .planDetailCta__text {
            margin: 0 0 clamp(18px, 2.4vw, 24px);
            font-size: clamp(14px, 1.35vw, 16px);
            line-height: 1.85;
            color: rgba(17, 17, 17, .62);
        }

        .planDetailCta__link {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            font-size: 13px;
            font-weight: 500;
            letter-spacing: .08em;
            color: rgba(17, 17, 17, .78);
            text-decoration: none;
            border-bottom: 1px solid rgba(17, 17, 17, .28);
            padding-bottom: 5px;
        }

        .planDetailCta__link:hover {
            color: #0a0a0a;
            border-color: rgba(17, 17, 17, .5);
        }

        .planDetailCta__backWrap {
            display: flex;
            justify-content: center;
            margin: clamp(44px, 5.5vw, 56px) 0 0;
        }

        .planDetailCta__back {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 200px;
            height: 42px;
            padding: 0 24px;
            border-radius: 999px;
            border: 1px solid var(--ui-blue);
            background: var(--ui-blue);
            color: #fff;
            font-size: 14px;
            font-weight: 500;
            letter-spacing: .06em;
            text-decoration: none;
            transition: background .2s ease, border-color .2s ease;
        }

        .planDetailCta__back:hover {
            background: var(--ui-blue-dark);
            border-color: var(--ui-blue-dark);
            color: #fff;
        }

        .planDetailCta__back:focus-visible {
            outline: 2px solid var(--ui-blue);
            outline-offset: 3px;
        }

        .planDetailBack {
            display: inline-flex;
            margin-bottom: clamp(20px, 3vw, 32px);
            font-size: 12px;
            letter-spacing: .06em;
            color: rgba(17, 17, 17, .52);
            text-decoration: none;
        }

        .planDetailBack:hover {
            color: #0a0a0a;
        }

        @media (max-width: 768px) {
            .planDetailHero__media {
                touch-action: pan-y pinch-zoom;
            }

            .planDetailGalleryPair {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 1px;
                background: #fff;
            }

            .planDetailGalleryPair .planDetailFigure__media--portrait {
                width: 100%;
            }

            .planDetailIntro__code {
        font-size: 10px;
                letter-spacing: .18em;
            }

            .planDetailIntro__title {
        font-size: 22px;
                margin-top: 10px;
            }

            .planDetailIntro__meta {
                margin-top: 10px;
        font-size: 13px;
        line-height: 1.75;
            }

            .planDetailFloor__label {
                font-size: 12px;
                padding-bottom: 0;
                border-bottom: none;
            }

            .planDetailFloor__zoom {
                display: flex;
                align-items: center;
                justify-content: center;
                position: absolute;
                right: 10px;
                bottom: 10px;
                z-index: 2;
                width: 40px;
                height: 40px;
                padding: 0;
                border: 0;
                border-radius: 999px;
                background: rgba(255, 255, 255, .92);
                color: rgba(17, 17, 17, .72);
                box-shadow: 0 2px 10px rgba(17, 17, 17, .12);
                cursor: pointer;
            }

            .planDetailFloor__zoomIcon {
                display: block;
                width: 20px;
                height: 20px;
                fill: currentColor;
            }

            .planDetailFloor__media--modal {
                width: min(1100px, 220vw);
            }
        }