:root {
            /* Brand palette — see docs/brand.md */
            --brand-gray-9:  #44424A;
            --brand-gray-11: #323038;
            --brand-gray-6:  #DEDEDE;
            --brand-gray-1:  #F9F8F8;
            --brand-blue:    #A1BBCA;

            --bg:        var(--brand-gray-11);
            --bg-card:   var(--brand-gray-9);
            --bg-card-2: #3a3840;
            --fg:        var(--brand-gray-1);
            --fg-muted:  #b8b6bd;
            --accent:    var(--brand-blue);
            --border:    rgba(249,248,248,0.06);
            --glass:     rgba(249,248,248,0.06);
            --glass-strong: rgba(249,248,248,0.09);
            --glass-dark: rgba(50,48,56,0.44);
            --shadow-soft: 0 24px 80px rgba(0,0,0,0.28);

            --grad-dark:  linear-gradient(180deg, #44424A 0%, #323038 100%);
            --grad-light: linear-gradient(180deg, #DEDEDE 0%, #F9F8F8 80%);
            --grad-ambient:
                linear-gradient(135deg, rgba(161,187,202,0.22) 0%, rgba(68,66,74,0) 42%),
                linear-gradient(215deg, rgba(249,248,248,0.12) 0%, rgba(50,48,56,0) 48%),
                var(--brand-gray-11);

            --radius: 20px;
            --max: 1280px;

            --font-sans: "Manrope", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
        }
        * { box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        body {
            margin: 0;
            background: var(--grad-ambient);
            color: var(--fg);
            font-family: var(--font-sans);
            font-weight: 400;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            line-height: 1.5;
            text-align: left;
        }
        body::before {
            content: "";
            position: fixed;
            inset: 0;
            pointer-events: none;
            background:
                linear-gradient(90deg, rgba(249,248,248,0.035) 1px, transparent 1px),
                linear-gradient(180deg, rgba(249,248,248,0.03) 1px, transparent 1px);
            background-size: 72px 72px;
            mask-image: linear-gradient(to bottom, transparent 0%, #000 18%, #000 82%, transparent 100%);
            z-index: -1;
        }
        a { color: inherit; text-decoration: none; }
        img { max-width: 100%; display: block; }
        .container { max-width: var(--max); margin: 0 auto; padding: 0 24px; }
        .visually-hidden {
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0,0,0,0);
            white-space: nowrap;
            border: 0;
        }

        .brand {
            display: inline-flex;
            align-items: center;
            width: 132px;
            height: 32px;
        }
        .brand img,
        .footer-brand img {
            display: block;
            width: 100%;
            height: auto;
        }
        .btn {
            display: inline-flex; align-items: center; gap: 8px;
            padding: 12px 22px; border-radius: 999px;
            background: rgba(249,248,248,0.78); color: var(--brand-gray-11);
            font-family: var(--font-sans);
            font-size: 14px; font-weight: 600;
            border: 1px solid rgba(249,248,248,0.56);
            box-shadow: 0 14px 34px rgba(0,0,0,0.16), inset 0 1px 0 rgba(255,255,255,0.48);
            backdrop-filter: blur(18px);
            -webkit-backdrop-filter: blur(18px);
            transition: transform .15s ease, background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
            cursor: pointer;
        }
        .btn:hover {
            transform: translateY(-1px);
            background: rgba(161,187,202,0.84);
            border-color: rgba(161,187,202,0.86);
            color: var(--brand-gray-11);
            box-shadow: 0 18px 44px rgba(0,0,0,0.20), inset 0 1px 0 rgba(255,255,255,0.48);
        }
        .btn.ghost {
            background: rgba(249,248,248,0.06); color: var(--fg); border-color: rgba(249,248,248,0.14);
        }
        .btn.ghost:hover { background: rgba(249,248,248,0.10); color: var(--fg); border-color: var(--accent); }

        header.hero {
            position: relative;
            min-height: 100vh;
            display: flex;
            align-items: stretch;
            overflow: hidden;
            background: var(--brand-gray-11);
        }
        header.hero .bg {
            position: absolute; inset: 0;
            background-image: url('/assets/alistera-coworking-cover.webp');
            background-size: cover; background-position: center;
            transform: scale(1.02);
        }
        header.hero .bg::after {
            content: ""; position: absolute; inset: 0;
            background:
                linear-gradient(to bottom, rgba(50,48,56,0.08) 0%, rgba(50,48,56,0.03) 48%, rgba(50,48,56,0.50) 100%),
                linear-gradient(to right, rgba(50,48,56,0.14) 0%, rgba(50,48,56,0.05) 48%, rgba(50,48,56,0.10) 100%);
        }
        header.hero .content {
            position: relative;
            z-index: 2;
            width: 100%;
            max-width: none;
            margin: 0;
            min-height: 100vh;
            padding: 96px 20px 32px;
            display: flex;
            align-items: stretch;
        }
        .hero-panel {
            width: clamp(300px, 25vw, 420px);
            min-width: 0;
            min-height: calc(100vh - 128px);
            padding: clamp(26px, 3.5vh, 42px) clamp(24px, 2.5vw, 34px);
            border-radius: 28px;
            background:
                linear-gradient(145deg, rgba(68,66,74,0.62) 0%, rgba(50,48,56,0.48) 100%);
            border: 1px solid rgba(249,248,248,0.09);
            box-shadow: 0 28px 90px rgba(0,0,0,0.24), inset 0 1px 0 rgba(255,255,255,0.10);
            backdrop-filter: blur(30px) saturate(140%);
            -webkit-backdrop-filter: blur(30px) saturate(140%);
            display: flex;
            flex-direction: column;
        }
        .hero-logo {
            width: clamp(132px, 10vw, 180px);
            margin-bottom: clamp(46px, 8vh, 78px);
        }
        .hero-kicker {
            width: 48px;
            height: 1px;
            background: rgba(249,248,248,0.46);
            margin: 28px 0 24px;
        }
        .hero-statement {
            margin: 0 0 24px;
            font-size: clamp(42px, 3.6vw, 68px);
            line-height: 1.05; font-weight: 300; letter-spacing: 0.02em;
            text-transform: uppercase;
            max-width: 920px;
        }
        .hero-statement em {
            font-style: normal; color: var(--fg); font-weight: 300;
        }
        .lede {
            max-width: 330px;
            font-size: 19px;
            line-height: 1.45;
            color: var(--fg-muted);
            margin: 0 0 28px;
        }
        .hero-meta {
            display: flex;
            flex-wrap: wrap;
            gap: 14px;
            font-size: 15px;
            color: rgba(249,248,248,0.78);
            margin: auto 0 0;
            padding-top: 32px;
        }
        .hero-meta span { display: inline-flex; align-items: center; gap: 8px; }
        .hero-meta span + span {
            border-left: 1px solid rgba(249,248,248,0.18);
            padding-left: 14px;
        }
        .hero-cta { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 24px; }

        section { padding: 96px 0; border-top: 1px solid var(--border); scroll-margin-top: 88px; }
        section .container { position: relative; }
        section .eyebrow {
            font-size: 12px; letter-spacing: 0.20em; text-transform: uppercase;
            color: var(--fg-muted); font-weight: 600; margin-bottom: 16px;
        }
        section h2 {
            margin: 0 0 24px;
            font-size: clamp(32px, 4vw, 52px);
            line-height: 1.12; font-weight: 300; letter-spacing: 0.08em;
            text-transform: uppercase;
        }
        section .intro { max-width: 760px; color: var(--fg-muted); font-size: 18px; line-height: 1.55; margin: 0 0 56px; }
        .web-content section .container {
            padding-right: min(300px, 22vw);
        }
        .site-toc {
            position: fixed;
            right: 24px;
            top: 112px;
            z-index: 40;
            width: 224px;
            max-height: calc(100vh - 144px);
            overflow: auto;
            padding: 16px;
            border: 1px solid rgba(249,248,248,0.08);
            border-radius: 22px;
            background: linear-gradient(145deg, rgba(68,66,74,0.40) 0%, rgba(50,48,56,0.28) 100%);
            box-shadow: 0 20px 70px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.08);
            backdrop-filter: blur(28px) saturate(140%);
            -webkit-backdrop-filter: blur(28px) saturate(140%);
        }
        .site-toc .toc-title {
            font-size: 11px;
            letter-spacing: 0.18em;
            text-transform: uppercase;
            color: var(--fg-muted);
            font-weight: 600;
            margin-bottom: 12px;
        }
        .site-toc a {
            display: block;
            padding: 9px 10px;
            border-radius: 12px;
            color: rgba(249,248,248,0.62);
            font-size: 13px;
            line-height: 1.25;
            transition: color .18s ease, background .18s ease, transform .18s ease;
        }
        .site-toc a:hover,
        .site-toc a.is-active {
            color: var(--fg);
            background: rgba(249,248,248,0.06);
            transform: translateX(-2px);
        }
        .section-split {
            display: grid;
            grid-template-columns: minmax(0, 0.95fr) minmax(320px, 1.05fr);
            gap: 32px;
            align-items: stretch;
        }
        .section-split.reverse {
            grid-template-columns: minmax(320px, 1.05fr) minmax(0, 0.95fr);
        }
        .feature-list {
            display: grid;
            gap: 1px;
            overflow: hidden;
            border: 1px solid rgba(249,248,248,0.08);
            border-radius: var(--radius);
            background: rgba(249,248,248,0.045);
            box-shadow: 0 18px 54px rgba(0,0,0,0.18);
        }
        .feature-row {
            display: grid;
            grid-template-columns: minmax(180px, 0.8fr) minmax(0, 1.2fr);
            gap: 24px;
            padding: 22px 24px;
            background: rgba(249,248,248,0.03);
            backdrop-filter: blur(22px);
            -webkit-backdrop-filter: blur(22px);
        }
        .feature-row strong {
            font-size: 13px;
            letter-spacing: 0.12em;
            text-transform: uppercase;
            color: var(--fg);
            font-weight: 600;
        }
        .feature-row span {
            color: var(--fg-muted);
            font-size: 15px;
            line-height: 1.55;
        }
        .media-panel {
            min-height: 420px;
            border-radius: var(--radius);
            border: 1px solid rgba(249,248,248,0.12);
            background-size: cover;
            background-position: center;
            box-shadow: var(--shadow-soft);
            overflow: hidden;
            position: relative;
        }
        .media-panel::after {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(to bottom, rgba(0,0,0,0.04), rgba(0,0,0,0.48));
        }
        .media-panel .cap {
            position: absolute;
            left: 24px;
            right: 24px;
            bottom: 22px;
            z-index: 1;
            color: var(--fg);
            font-size: 14px;
        }
        .floor-plan {
            background: rgba(249,248,248,0.92);
            border-radius: var(--radius);
            padding: 18px;
            border: 1px solid rgba(249,248,248,0.14);
            box-shadow: var(--shadow-soft);
        }
        .floor-plan img {
            width: 100%;
            border-radius: 14px;
        }

        .stats {
            display: grid; gap: 1px;
            grid-template-columns: repeat(4, 1fr);
            background: rgba(249,248,248,0.045);
            border: 1px solid rgba(249,248,248,0.08);
            border-radius: var(--radius);
            overflow: hidden;
            box-shadow: var(--shadow-soft);
            backdrop-filter: blur(24px);
            -webkit-backdrop-filter: blur(24px);
        }
        .stat { background: rgba(249,248,248,0.04); padding: 32px; }
        .stat .n { font-size: clamp(32px, 3.5vw, 44px); font-weight: 300; letter-spacing: -0.02em; line-height: 1; }
        .stat .l { color: var(--fg-muted); font-size: 13px; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; margin-top: 12px; }

        .grid {
            display: grid; gap: 16px;
            grid-template-columns: repeat(3, 1fr);
        }
        .card {
            background:
                linear-gradient(145deg, rgba(249,248,248,0.10) 0%, rgba(249,248,248,0.03) 100%);
            border: 1px solid rgba(249,248,248,0.09);
            border-radius: var(--radius);
            padding: 28px;
            display: flex; flex-direction: column; gap: 12px;
            box-shadow: 0 18px 54px rgba(0,0,0,0.16), inset 0 1px 0 rgba(255,255,255,0.08);
            backdrop-filter: blur(26px) saturate(145%);
            -webkit-backdrop-filter: blur(26px) saturate(145%);
        }
        .card.large { grid-column: span 2; }
        .card .label {
            font-size: 11px; letter-spacing: 0.20em; text-transform: uppercase; color: var(--fg-muted); font-weight: 600;
        }
        .card h3 {
            margin: 0;
            font-size: 21px;
            font-weight: 600;
            letter-spacing: 0.08em;
            line-height: 1.25;
            text-transform: uppercase;
        }
        .card p { margin: 0; color: var(--fg-muted); font-size: 15px; line-height: 1.55; }
        .card.image {
            padding: 0; min-height: 320px;
            background-size: cover; background-position: center;
            position: relative; overflow: hidden;
        }
        .card.image::after {
            content: ""; position: absolute; inset: 0;
            background: linear-gradient(to bottom, transparent 40%, rgba(0,0,0,0.7) 100%);
        }
        .card.image .cap {
            position: absolute; bottom: 20px; left: 24px; right: 24px; z-index: 1;
            font-size: 14px; color: #fff;
        }

        .pricing {
            display: grid; gap: 16px;
            grid-template-columns: repeat(3, 1fr);
        }
        .price-card {
            background: linear-gradient(145deg, rgba(249,248,248,0.10) 0%, rgba(249,248,248,0.03) 100%);
            border: 1px solid rgba(249,248,248,0.09);
            border-radius: var(--radius);
            padding: 32px;
            box-shadow: 0 18px 54px rgba(0,0,0,0.16), inset 0 1px 0 rgba(255,255,255,0.08);
            backdrop-filter: blur(26px) saturate(145%);
            -webkit-backdrop-filter: blur(26px) saturate(145%);
        }
        .price-card .name { font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--fg-muted); font-weight: 600; }
        .price-card .amt { font-size: 40px; font-weight: 300; letter-spacing: -0.02em; line-height: 1; margin: 16px 0 4px; }
        .price-card .amt small { font-size: 14px; color: var(--fg-muted); font-weight: 400; letter-spacing: 0; }
        .price-card p { margin: 20px 0 0; color: var(--fg-muted); font-size: 15px; line-height: 1.55; }
        .price-card.featured { border-color: var(--accent); }

        .location {
            display: grid; gap: 32px;
            grid-template-columns: 1fr 1fr; align-items: center;
        }
        .location .pic {
            aspect-ratio: 4/3;
            border-radius: var(--radius);
            background-image: url('/assets/exterior.jpg');
            background-size: cover; background-position: center;
        }
        .location ul { list-style: none; padding: 0; margin: 24px 0 0; }
        .location li {
            display: flex; justify-content: space-between;
            padding: 16px 0; border-bottom: 1px solid var(--border);
            font-size: 16px;
        }
        .location li:last-child { border-bottom: none; }
        .location li span { color: var(--fg-muted); }

        .download {
            background:
                linear-gradient(135deg, rgba(161,187,202,0.14) 0%, rgba(249,248,248,0.06) 34%, rgba(50,48,56,0.62) 100%);
            border: 1px solid rgba(249,248,248,0.09);
            border-radius: var(--radius);
            padding: 56px 48px;
            display: grid;
            grid-template-columns: 1.4fr 1fr;
            gap: 48px;
            align-items: center;
            box-shadow: var(--shadow-soft), inset 0 1px 0 rgba(255,255,255,0.10);
            backdrop-filter: blur(28px) saturate(145%);
            -webkit-backdrop-filter: blur(28px) saturate(145%);
        }
        .download .text h2 {
            margin: 0 0 16px;
            font-size: clamp(28px, 3.5vw, 40px);
            line-height: 1.12;
            font-weight: 300;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }
        .download .text p { color: var(--fg-muted); margin: 0 0 28px; font-size: 17px; line-height: 1.55; }
        .download .meta { font-size: 12px; letter-spacing: 0.10em; text-transform: uppercase; color: var(--fg-muted); font-weight: 600; margin-top: 16px; }
        .download .preview {
            aspect-ratio: 16/9;
            background-image: url('/assets/og-image.jpg');
            background-size: cover; background-position: center;
            border-radius: 12px;
            border: 1px solid var(--border);
        }

        .contact {
            display: grid; gap: 32px;
            grid-template-columns: 1fr 1fr;
        }
        .lead-block {
            display: grid;
            grid-template-columns: minmax(0, 0.9fr) minmax(340px, 1.1fr);
            gap: 40px;
            align-items: start;
            padding: 48px;
            border-radius: var(--radius);
            border: 1px solid rgba(249,248,248,0.09);
            background:
                linear-gradient(135deg, rgba(161,187,202,0.10) 0%, rgba(249,248,248,0.06) 34%, rgba(50,48,56,0.60) 100%);
            box-shadow: var(--shadow-soft), inset 0 1px 0 rgba(255,255,255,0.10);
            backdrop-filter: blur(28px) saturate(145%);
            -webkit-backdrop-filter: blur(28px) saturate(145%);
        }
        .lead-form {
            display: grid;
            gap: 14px;
        }
        .lead-form .field {
            display: grid;
            gap: 8px;
        }
        .lead-form label {
            color: var(--fg-muted);
            font-size: 11px;
            font-weight: 600;
            letter-spacing: 0.16em;
            text-transform: uppercase;
        }
        .lead-form input,
        .lead-form textarea {
            width: 100%;
            border: 1px solid rgba(249,248,248,0.12);
            border-radius: 16px;
            background: rgba(249,248,248,0.06);
            color: var(--fg);
            font: inherit;
            padding: 15px 16px;
            outline: none;
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
            backdrop-filter: blur(18px);
            -webkit-backdrop-filter: blur(18px);
            transition: border-color .15s ease, background .15s ease;
        }
        .lead-form textarea {
            min-height: 118px;
            resize: vertical;
        }
        .lead-form input:focus,
        .lead-form textarea:focus {
            border-color: rgba(161,187,202,0.80);
            background: rgba(249,248,248,0.08);
        }
        .lead-form .hp {
            position: absolute;
            left: -9999px;
            width: 1px;
            height: 1px;
            overflow: hidden;
        }
        .lead-form .btn,
        .lead-form button[type="submit"] {
            width: auto;
            max-width: fit-content;
            justify-self: start;
            padding: 13px 28px;
            font-size: 14px;
            font-weight: 600;
        }
        .lead-form .btn:disabled {
            opacity: 0.6;
            cursor: not-allowed;
            transform: none;
        }
        .form-status {
            min-height: 22px;
            color: var(--fg-muted);
            font-size: 14px;
        }
        .form-status.is-success { color: var(--accent); }
        .form-status.is-error { color: #f3b4b4; }
        .contact-card {
            background: linear-gradient(145deg, rgba(249,248,248,0.10) 0%, rgba(249,248,248,0.03) 100%);
            border: 1px solid rgba(249,248,248,0.09);
            border-radius: var(--radius);
            padding: 32px;
            box-shadow: 0 18px 54px rgba(0,0,0,0.16), inset 0 1px 0 rgba(255,255,255,0.08);
            backdrop-filter: blur(26px) saturate(145%);
            -webkit-backdrop-filter: blur(26px) saturate(145%);
        }
        .contact-card .role { color: var(--fg-muted); font-size: 11px; letter-spacing: 0.20em; text-transform: uppercase; font-weight: 600; }
        .contact-card .name { font-size: 24px; font-weight: 600; margin: 8px 0 24px; letter-spacing: -0.01em; }
        .contact-card a { display: block; padding: 14px 0; border-top: 1px solid var(--border); color: var(--fg); font-size: 16px; transition: color .15s; }
        .contact-card a:hover { color: var(--accent); }
        .contact-card a span { color: var(--fg-muted); margin-right: 12px; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 600; }

        footer {
            border-top: 1px solid var(--border);
            padding: 32px 0;
            color: var(--fg-muted);
            font-size: 13px;
            display: flex; justify-content: space-between; flex-wrap: wrap; gap: 16px;
        }
        .footer-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
            flex-wrap: wrap;
            gap: 18px;
            width: 100%;
        }
        .footer-brand {
            display: inline-flex;
            width: 118px;
            opacity: 0.86;
        }

        @media (max-width: 1024px) {
            .stats { grid-template-columns: repeat(2, 1fr); }
            .grid, .pricing, .location, .contact, .lead-block, .section-split, .section-split.reverse { grid-template-columns: 1fr; }
            .card.large { grid-column: span 1; }
            .download { grid-template-columns: 1fr; gap: 32px; padding: 40px 28px; }
            nav.top .links { display: none; }
            .lang-menu .lang-panel { left: 50%; transform: translateX(-50%); right: auto; top: calc(100% + 8px); }
            .hero-panel { width: clamp(300px, 42vw, 400px); min-width: 0; }
            .hero-statement { font-size: clamp(40px, 5vw, 56px); }
            .site-toc { display: none; }
            .web-content section .container { padding-right: 24px; }
        }

        @media (max-width: 768px) {
            .container { padding: 0 20px; }
            section { padding: 64px 0; }
            section .intro { font-size: 16px; margin-bottom: 40px; }
            header.hero { min-height: 100vh; }
            header.hero .bg { background-position: 58% center; }
            header.hero .content { padding: 92px 20px 24px; }
            .hero-panel {
                width: 100%;
                min-width: 0;
                min-height: calc(100vh - 116px);
                padding: 28px 24px;
                border-radius: 24px;
            }
            .hero-logo {
                width: 150px;
                margin-bottom: 54px;
            }
            .hero-statement { font-size: 40px; line-height: 1.08; letter-spacing: 0.02em; }
            .lede { font-size: 16px; }
            .hero-meta { gap: 12px; font-size: 13px; }
            .hero-meta span + span { padding-left: 12px; }
            .hero-cta { flex-direction: column; align-items: stretch; }
            .hero-cta .btn { justify-content: center; width: 100%; }
            .btn { padding: 14px 22px; font-size: 15px; min-height: 48px; }
            .stat { padding: 24px 20px; }
            .card { padding: 24px 22px; }
            .card.image { min-height: 240px !important; }
            .feature-row { grid-template-columns: 1fr; gap: 8px; padding: 20px; }
            .media-panel { min-height: 300px; }
            .price-card { padding: 24px 22px; }
            .price-card .amt { font-size: 34px; }
            .contact-card { padding: 24px 22px; }
            .contact-card .name { font-size: 22px; }
            .lead-block { padding: 32px 22px; }
            .download .preview { display: none; }
            footer .container { font-size: 12px; }
        }

        @media (max-width: 480px) {
            .container { padding: 0 16px; }
            section { padding: 56px 0; }
            section h2 { font-size: 28px; letter-spacing: 0.06em; }
            .hero-statement { font-size: 39px; }
            .stats { grid-template-columns: 1fr; }
            .stats { border-radius: 14px; }
            .stat .n { font-size: 30px; }
            .stat .l { font-size: 12px; }
            nav.top .row { padding: 12px 0; }
            nav.top .row .btn { padding: 10px 16px; font-size: 13px; min-height: 40px; }
            .brand { width: 112px; }
            .hero-panel { padding: 24px 20px; border-radius: 22px; }
            .hero-logo { width: 136px; margin-bottom: 44px; }
            .download { padding: 32px 20px; }
            .download .text h2 { font-size: 26px; }
            footer { padding: 24px 0; }
            .footer-row { flex-direction: column; align-items: flex-start; }
        }

        @supports (padding: max(0px)) {
            .container { padding-left: max(20px, env(safe-area-inset-left)); padding-right: max(20px, env(safe-area-inset-right)); }
            footer { padding-bottom: max(32px, env(safe-area-inset-bottom)); }
        }

        @media (hover: none) {
            .btn:hover { transform: none; }
            .card.image:hover { transform: none; }
        }

        /* Presentation-style web sections. Asset files in assets/figma/ are intentionally stable
           so production WebP exports can replace the temporary placeholders one-for-one. */
        body::before { display: none; }
        body { background: #f4f2ef; }
        nav.top {
            opacity: 0;
            transform: translateY(-100%);
            pointer-events: none;
            transition: opacity .28s ease, transform .28s ease;
        }
        nav.top.is-visible {
            opacity: 1;
            transform: translateY(0);
            pointer-events: auto;
        }
        header.hero .content { padding: 20px; }
        .hero-panel {
            min-height: calc(100vh - 40px);
            width: clamp(300px, 25vw, 430px);
        }
        .slide-deck {
            background: #f4f2ef;
            color: #323038;
        }
        .deck-section {
            min-height: 100vh;
            padding: 20px;
            border-top: 0;
            scroll-margin-top: 0;
            display: flex;
        }
        .deck-frame {
            position: relative;
            width: 100%;
            min-height: calc(100vh - 40px);
            border-radius: 20px;
            overflow: hidden;
            background: #f9f8f8;
            box-shadow: 0 20px 70px rgba(50,48,56,.12);
        }
        .deck-bg {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        .deck-vignette {
            position: absolute;
            inset: 0;
            background:
                linear-gradient(to bottom, rgba(0,0,0,.06), rgba(0,0,0,.18)),
                linear-gradient(to right, rgba(0,0,0,.12), rgba(0,0,0,0) 55%);
            pointer-events: none;
        }
        .slide-logo {
            position: absolute;
            top: 28px;
            left: 32px;
            z-index: 4;
            width: 132px;
        }
        .slide-tagline {
            position: absolute;
            top: 32px;
            left: 50%;
            z-index: 4;
            transform: translateX(-50%);
            color: rgba(255,255,255,.92);
            font-size: 18px;
            line-height: 1;
            white-space: nowrap;
        }
        .slide-num {
            position: absolute;
            top: 28px;
            right: 32px;
            z-index: 4;
            color: rgba(255,255,255,.92);
            font-size: 16px;
        }
        .light .slide-tagline,
        .light .slide-num { color: #323038; }
        .light .slide-logo { filter: invert(1); }
        .glass-panel,
        .glass-card {
            background: linear-gradient(145deg, rgba(68,66,74,.64), rgba(50,48,56,.56));
            border: 1px solid rgba(255,255,255,.12);
            box-shadow: 0 24px 80px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.12);
            backdrop-filter: blur(28px) saturate(140%);
            -webkit-backdrop-filter: blur(28px) saturate(140%);
            color: #fff;
        }
        .glass-panel {
            position: absolute;
            top: 0;
            left: 0;
            z-index: 3;
            width: min(49vw, 920px);
            min-height: 32vh;
            padding: clamp(64px, 8vh, 104px) 32px 44px;
            border-radius: 0 0 18px 0;
        }
        .glass-panel h2,
        .light-title h2 {
            margin: 0;
            font-size: clamp(44px, 5.5vw, 82px);
            line-height: 1.04;
            font-weight: 300;
            letter-spacing: .08em;
            text-transform: uppercase;
        }
        .glass-card h3,
        .tile h3 {
            margin: 0;
            font-size: clamp(24px, 2vw, 34px);
            line-height: 1.2;
            font-weight: 600;
            letter-spacing: .08em;
            text-transform: uppercase;
        }
        .glass-card p,
        .tile p,
        .light-copy p,
        .feature-table {
            margin: 0;
            font-size: clamp(17px, 1.45vw, 24px);
            line-height: 1.38;
        }
        .card-row {
            position: absolute;
            left: 32px;
            right: 32px;
            bottom: 32px;
            z-index: 3;
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 20px;
        }
        .glass-card {
            min-height: 190px;
            border-radius: 16px;
            padding: 26px 30px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            gap: 34px;
        }
        .light-grid {
            position: relative;
            z-index: 2;
            min-height: calc(100vh - 40px);
            display: grid;
            grid-template-columns: minmax(360px, .9fr) minmax(0, 1.8fr);
            gap: 20px;
            padding: 0;
        }
        .light-copy {
            display: flex;
            flex-direction: column;
            background: linear-gradient(180deg, #f9f8f8, #efeeee);
            border-radius: 18px;
            overflow: hidden;
        }
        .light-copy .pad { padding: 104px 32px 32px; }
        .light-copy p { color: #323038; font-size: clamp(26px, 3vw, 48px); line-height: 1.35; }
        .light-title {
            min-height: 290px;
            padding: 104px 32px 28px;
            border-bottom: 1px solid rgba(50,48,56,.12);
        }
        .feature-table {
            display: grid;
            gap: 0;
            padding: 32px;
            color: #323038;
        }
        .feature-table div {
            display: grid;
            grid-template-columns: minmax(170px, .9fr) minmax(0, 1.2fr);
            gap: 24px;
            padding: 18px 0;
            border-bottom: 1px solid rgba(50,48,56,.12);
        }
        .feature-table div:last-child { border-bottom: 0; }
        .feature-table strong {
            font-weight: 700;
            letter-spacing: .02em;
        }
        .visual-stack {
            display: grid;
            grid-template-rows: minmax(360px, 1fr) auto;
            gap: 20px;
        }
        .landscape-img {
            width: 100%;
            height: 100%;
            min-height: 320px;
            object-fit: cover;
            border-radius: 18px;
        }
        .tile-row {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 20px;
        }
        .tile {
            min-height: 250px;
            border-radius: 16px;
            padding: 28px 32px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            background: linear-gradient(145deg, #323038, #3e3c44);
            color: #fff;
        }
        .tile.light {
            background: linear-gradient(145deg, #f9f8f8, #eeeeee);
            color: #323038;
        }
        .split-light {
            min-height: calc(100vh - 40px);
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 20px;
        }
        .split-light .media {
            position: relative;
            overflow: hidden;
            border-radius: 18px;
            background: #dedede;
        }
        .split-light .media img {
            width: 100%;
            height: 100%;
            min-height: calc(100vh - 40px);
            object-fit: cover;
        }
        .chips {
            position: absolute;
            top: 96px;
            right: 32px;
            z-index: 3;
            display: grid;
            gap: 10px;
            justify-items: end;
        }
        .chips span {
            padding: 6px 18px;
            border-radius: 999px;
            background: rgba(50,48,56,.38);
            color: #fff;
            backdrop-filter: blur(14px);
            -webkit-backdrop-filter: blur(14px);
            font-size: 18px;
        }
        .gallery-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 20px;
            padding: 58vh 32px 32px;
            min-height: calc(100vh - 40px);
        }
        .gallery-grid img {
            width: 100%;
            aspect-ratio: 16 / 9;
            object-fit: cover;
            border-radius: 16px;
        }
        .plan-frame {
            padding: 120px 32px 32px;
            min-height: calc(100vh - 40px);
            display: grid;
            grid-template-rows: auto 1fr;
            gap: 26px;
        }
        .plan-frame h2 {
            margin: 0;
            font-size: clamp(46px, 5vw, 80px);
            line-height: 1;
            font-weight: 300;
            letter-spacing: .08em;
            text-transform: uppercase;
        }
        .plan-frame img {
            width: 100%;
            max-height: 68vh;
            object-fit: contain;
        }
        .location-layout {
            min-height: calc(100vh - 40px);
            padding: 120px 32px 32px;
            display: grid;
            grid-template-columns: 1fr 1.35fr 1fr;
            gap: 20px;
            align-items: end;
            background: linear-gradient(180deg, #f9f8f8, #f1f1f1);
        }
        .location-layout h2 {
            align-self: start;
            margin: 0;
            font-size: clamp(42px, 5vw, 78px);
            line-height: 1;
            font-weight: 300;
            letter-spacing: .08em;
            text-transform: uppercase;
        }
        .location-layout img {
            width: 100%;
            aspect-ratio: 4 / 5;
            object-fit: cover;
            border-radius: 16px;
        }
        .walk-list {
            align-self: start;
            font-size: clamp(20px, 2vw, 30px);
            line-height: 1.45;
        }
        .contact-glass {
            position: absolute;
            right: 32px;
            bottom: 32px;
            z-index: 4;
            width: min(560px, calc(100% - 64px));
            border-radius: 16px;
            padding: 28px 32px;
            background:
                linear-gradient(145deg, rgba(68,66,74,.60), rgba(50,48,56,.50)),
                radial-gradient(circle at 72% 12%, rgba(161,187,202,.10), transparent 16vw);
            border: 1px solid rgba(255,255,255,.10);
            box-shadow: 0 24px 80px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.10);
            backdrop-filter: blur(28px) saturate(145%);
            -webkit-backdrop-filter: blur(28px) saturate(145%);
        }
        .contact-glass .name {
            font-size: clamp(26px, 2.3vw, 38px);
            letter-spacing: .08em;
            text-transform: uppercase;
            font-weight: 600;
            margin-bottom: 4px;
        }
        .contact-glass a {
            display: block;
            color: #fff;
            text-decoration: underline;
            text-underline-offset: 3px;
        }
        .lead-form.compact {
            margin-top: 22px;
            grid-template-columns: 1fr 1fr;
        }
        .lead-form.compact .field.message,
        .lead-form.compact button,
        .lead-form.compact .form-status { grid-column: 1 / -1; }
        footer {
            background: #323038;
        }
        @media (max-width: 1024px) {
            .deck-section { padding: 12px; }
            .deck-frame,
            .light-grid,
            .split-light,
            .plan-frame,
            .location-layout { min-height: calc(100vh - 24px); }
            .glass-panel { width: min(86vw, 720px); }
            .card-row,
            .tile-row,
            .gallery-grid,
            .light-grid,
            .split-light,
            .location-layout { grid-template-columns: 1fr; }
            .card-row {
                position: relative;
                left: auto;
                right: auto;
                bottom: auto;
                padding: 44vh 20px 20px;
            }
            .glass-card { min-height: 150px; }
            .visual-stack { grid-template-rows: auto auto; }
            .split-light .media img { min-height: 520px; }
            .gallery-grid { padding: 360px 20px 20px; }
            .location-layout { padding-top: 104px; }
            .location-layout img { aspect-ratio: 16 / 10; }
        }
        @media (max-width: 680px) {
            header.hero .content { padding: 12px; }
            .hero-panel {
                width: 100%;
                min-height: calc(100vh - 24px);
            }
            .slide-logo { width: 108px; top: 22px; left: 22px; }
            .slide-tagline { display: none; }
            .slide-num { top: 22px; right: 22px; }
            .glass-panel {
                width: 100%;
                min-height: 230px;
                padding: 74px 22px 28px;
            }
            .glass-panel h2,
            .light-title h2,
            .plan-frame h2,
            .location-layout h2 { font-size: 38px; }
            .card-row { padding: 38vh 12px 12px; gap: 12px; }
            .glass-card,
            .tile { padding: 22px; }
            .light-copy .pad,
            .light-title { padding: 84px 22px 24px; }
            .light-copy p { font-size: 26px; }
            .feature-table { padding: 22px; font-size: 17px; }
            .feature-table div { grid-template-columns: 1fr; gap: 8px; }
            .plan-frame,
            .location-layout { padding: 92px 18px 18px; }
            .contact-glass {
                left: 12px;
                right: 12px;
                bottom: 12px;
                width: auto;
                padding: 22px;
            }
            .lead-form.compact { grid-template-columns: 1fr; }
        }

        /* Final polish pass: premium slide system */
        :root {
            --slide-gap: clamp(12px, 1.25vw, 24px);
            --slide-radius: clamp(18px, 1.8vw, 30px);
            --slide-inset: clamp(18px, 2.8vw, 52px);
        }
        .slide-deck {
            background:
                radial-gradient(circle at 18% 0%, rgba(161,187,202,.18), transparent 28vw),
                radial-gradient(circle at 86% 32%, rgba(68,66,74,.14), transparent 30vw),
                linear-gradient(180deg, #f9f8f8 0%, #ecebea 100%);
        }
        .deck-section {
            position: relative;
            padding: var(--slide-gap);
            perspective: 1400px;
        }
        .deck-frame {
            border-radius: var(--slide-radius);
            box-shadow:
                0 34px 120px rgba(50,48,56,.18),
                0 2px 0 rgba(255,255,255,.72) inset,
                0 0 0 1px rgba(50,48,56,.08);
            transform: translateY(18px) scale(.992);
            opacity: .72;
            transition: transform .9s cubic-bezier(.2,.8,.2,1), opacity .9s ease;
        }
        .deck-section.is-visible .deck-frame,
        .deck-section:first-child .deck-frame {
            transform: translateY(0) scale(1);
            opacity: 1;
        }
        .deck-frame::after {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 7;
            pointer-events: none;
            border-radius: inherit;
            box-shadow: inset 0 0 0 1px rgba(255,255,255,.38);
        }
        .deck-frame.dark {
            background: #323038;
        }
        .deck-frame.light {
            background:
                radial-gradient(circle at 75% 12%, rgba(161,187,202,.20), transparent 32vw),
                linear-gradient(180deg, #f9f8f8 0%, #efeeee 100%);
        }
        .deck-bg {
            transform: scale(1.035);
            filter: saturate(1.05) contrast(1.02);
            transition: transform 1.6s cubic-bezier(.2,.8,.2,1), filter 1.2s ease;
        }
        .deck-section.is-visible .deck-bg {
            transform: scale(1.01);
            filter: saturate(1.12) contrast(1.04);
        }
        .deck-vignette {
            z-index: 1;
            background:
                radial-gradient(circle at 62% 28%, rgba(249,248,248,.10), transparent 28vw),
                linear-gradient(to bottom, rgba(50,48,56,.03), rgba(50,48,56,.36)),
                linear-gradient(to right, rgba(50,48,56,.30), rgba(50,48,56,0) 58%, rgba(50,48,56,.18));
        }
        .slide-logo {
            width: clamp(112px, 7.4vw, 150px);
            top: var(--slide-inset);
            left: var(--slide-inset);
            filter: drop-shadow(0 10px 22px rgba(0,0,0,.18));
        }
        .light .slide-logo {
            filter: invert(1) drop-shadow(0 10px 22px rgba(50,48,56,.08));
        }
        .slide-tagline {
            top: calc(var(--slide-inset) + 4px);
            font-size: clamp(16px, 1.25vw, 24px);
            letter-spacing: -.02em;
            text-shadow: 0 10px 24px rgba(0,0,0,.20);
        }
        .slide-num {
            top: var(--slide-inset);
            right: var(--slide-inset);
            font-size: clamp(15px, 1.25vw, 22px);
            letter-spacing: .02em;
        }
        .glass-panel {
            width: min(49vw, 900px);
            min-height: clamp(260px, 31vh, 360px);
            padding: clamp(90px, 9.4vh, 132px) var(--slide-inset) clamp(34px, 4vw, 62px);
            border-radius: 0 0 24px 0;
            background:
                linear-gradient(145deg, rgba(68,66,74,.72), rgba(50,48,56,.52)),
                radial-gradient(circle at 18% 24%, rgba(255,255,255,.12), transparent 22vw);
            overflow: hidden;
        }
        .glass-panel::before,
        .glass-card::before,
        .contact-glass::before {
            content: "";
            position: absolute;
            inset: 1px;
            pointer-events: none;
            border-radius: inherit;
            background:
                linear-gradient(130deg, rgba(255,255,255,.18), rgba(255,255,255,0) 28%),
                radial-gradient(circle at 78% 18%, rgba(161,187,202,.12), transparent 18vw);
            opacity: .68;
        }
        .glass-panel h2,
        .light-title h2,
        .plan-frame h2,
        .location-copy h2 {
            position: relative;
            z-index: 1;
            letter-spacing: .09em;
            text-wrap: balance;
        }
        .glass-card {
            position: relative;
            min-height: clamp(176px, 20vh, 230px);
            border-radius: clamp(16px, 1.35vw, 24px);
            padding: clamp(24px, 2vw, 34px);
            background:
                linear-gradient(145deg, rgba(68,66,74,.68), rgba(50,48,56,.56)),
                radial-gradient(circle at 80% 18%, rgba(161,187,202,.12), transparent 16vw);
            overflow: hidden;
        }
        .glass-card::after,
        .tile::after {
            content: "+";
            position: absolute;
            top: clamp(18px, 1.8vw, 28px);
            right: clamp(20px, 2vw, 34px);
            color: rgba(249,248,248,.62);
            font-size: clamp(24px, 2vw, 36px);
            font-weight: 300;
            line-height: 1;
        }
        .glass-card h3,
        .glass-card p,
        .tile h3,
        .tile p {
            position: relative;
            z-index: 1;
        }
        .glass-card h3,
        .tile h3 {
            max-width: 78%;
            letter-spacing: .1em;
        }
        .glass-card p,
        .tile p {
            max-width: 92%;
            color: rgba(249,248,248,.88);
        }
        .card-row {
            left: var(--slide-inset);
            right: var(--slide-inset);
            bottom: var(--slide-inset);
            gap: clamp(14px, 1.4vw, 24px);
        }
        .light-grid,
        .split-light {
            gap: var(--slide-gap);
            padding: var(--slide-gap);
        }
        .light-copy {
            border: 1px solid rgba(50,48,56,.08);
            background:
                linear-gradient(180deg, rgba(249,248,248,.92), rgba(239,238,238,.88)),
                radial-gradient(circle at 14% 8%, rgba(255,255,255,.92), transparent 24vw);
            box-shadow: inset 0 1px 0 rgba(255,255,255,.82), 0 24px 70px rgba(50,48,56,.08);
        }
        .light-title {
            min-height: clamp(250px, 27vh, 330px);
            padding: clamp(88px, 9vh, 126px) clamp(28px, 3vw, 52px) 34px;
        }
        .light-copy .pad,
        .feature-table {
            padding-left: clamp(28px, 3vw, 52px);
            padding-right: clamp(28px, 3vw, 52px);
        }
        .feature-table div {
            align-items: start;
            padding: clamp(16px, 1.7vh, 24px) 0;
        }
        .feature-table strong {
            letter-spacing: .04em;
            text-transform: uppercase;
        }
        .visual-stack {
            grid-template-rows: minmax(400px, 1fr) minmax(210px, .36fr);
        }
        .landscape-img,
        .gallery-grid img,
        .location-photo,
        .location-map img {
            box-shadow: 0 24px 70px rgba(50,48,56,.12);
        }
        .landscape-img {
            border: 1px solid rgba(50,48,56,.08);
            aspect-ratio: 16 / 9;
            min-height: 0;
        }
        .tile-row.triple,
        .pricing-cards {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: var(--slide-gap);
        }
        .tile {
            position: relative;
            min-height: clamp(210px, 25vh, 300px);
            overflow: hidden;
            box-shadow: 0 24px 70px rgba(50,48,56,.12), inset 0 1px 0 rgba(255,255,255,.14);
        }
        .tile.light {
            border: 1px solid rgba(50,48,56,.08);
            box-shadow: inset 0 1px 0 rgba(255,255,255,.82), 0 24px 70px rgba(50,48,56,.08);
        }
        .tile.light::after {
            color: rgba(50,48,56,.56);
        }
        .tile.light p {
            color: rgba(50,48,56,.62);
        }
        .split-light .media {
            border: 1px solid rgba(50,48,56,.08);
            box-shadow: inset 0 1px 0 rgba(255,255,255,.82), 0 28px 90px rgba(50,48,56,.12);
        }
        .split-light .media img {
            filter: saturate(1.03) contrast(1.02);
        }
        .media.contain {
            display: grid;
            place-items: center;
            background:
                radial-gradient(circle at 64% 34%, rgba(255,255,255,.95), transparent 24vw),
                linear-gradient(145deg, #dedede, #f9f8f8);
        }
        .media.contain img {
            width: min(78%, 620px);
            height: auto;
            min-height: 0;
            object-fit: contain;
            filter: drop-shadow(0 34px 70px rgba(50,48,56,.28));
        }
        .gallery-grid {
            align-items: end;
            padding: min(48vh, 510px) var(--slide-inset) var(--slide-inset);
        }
        .gallery-grid img {
            aspect-ratio: 16 / 9;
            border: 1px solid rgba(50,48,56,.08);
        }
        .plan-frame {
            padding: clamp(96px, 10vh, 132px) var(--slide-inset) var(--slide-inset);
            gap: clamp(20px, 3vh, 36px);
        }
        .plan-visual {
            display: grid;
            grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
            gap: clamp(18px, 2vw, 34px);
            align-items: center;
            min-height: 0;
        }
        .plan-legend {
            display: grid;
            gap: 0;
            font-size: clamp(16px, 1.5vw, 24px);
        }
        .plan-legend span {
            display: flex;
            align-items: center;
            gap: 14px;
            padding: 13px 0;
            border-bottom: 1px solid rgba(50,48,56,.12);
        }
        .plan-legend i {
            width: 14px;
            height: 14px;
            border-radius: 50%;
            flex: 0 0 auto;
            background: var(--dot, #a1bbca);
        }
        .plan-frame img {
            max-height: none;
            align-self: center;
            filter: drop-shadow(0 18px 38px rgba(50,48,56,.10));
        }
        .location-layout {
            padding: clamp(96px, 10vh, 132px) var(--slide-inset) var(--slide-inset);
            grid-template-columns: .95fr 1.45fr .95fr;
            grid-template-rows: auto minmax(0, 1fr);
            align-items: stretch;
        }
        .location-copy {
            align-self: start;
            grid-column: 1;
            grid-row: 1;
        }
        .location-copy h2 {
            margin: 0;
            font-size: clamp(44px, 5vw, 80px);
            line-height: 1;
            font-weight: 300;
            letter-spacing: .09em;
            text-transform: uppercase;
        }
        .location-copy p {
            margin: 32px 0 0;
            font-size: clamp(24px, 2.3vw, 40px);
            line-height: 1.2;
        }
        .location-photo {
            width: 100%;
            height: 100%;
            min-height: 420px;
            aspect-ratio: 4 / 5;
            object-fit: cover;
            border-radius: 18px;
            border: 1px solid rgba(50,48,56,.08);
        }
        .location-photo.left {
            grid-column: 1;
            grid-row: 2;
        }
        .location-photo.right {
            grid-column: 3;
            grid-row: 2;
        }
        .location-map {
            grid-row: 1 / 3;
            grid-column: 2;
            align-self: end;
            display: grid;
            place-items: center;
            min-height: 58vh;
            border-radius: 18px;
            overflow: hidden;
            background: #f1f1f1;
        }
        .location-map img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        .walk-list {
            align-self: start;
            grid-column: 3;
            grid-row: 1;
            padding: clamp(22px, 2vw, 34px);
            border-radius: 18px;
            background: rgba(249,248,248,.58);
            border: 1px solid rgba(50,48,56,.06);
            box-shadow: inset 0 1px 0 rgba(255,255,255,.82), 0 24px 70px rgba(50,48,56,.08);
        }
        .lounge-note {
            position: absolute;
            top: 74px;
            right: var(--slide-inset);
            z-index: 4;
            width: min(580px, 42vw);
            background: transparent;
            color: #323038;
        }
        .lounge-note p {
            margin: 0;
            font-size: clamp(22px, 1.9vw, 32px);
            line-height: 1.28;
        }
        .contact-glass {
            width: min(620px, calc(100% - 64px));
            background:
                linear-gradient(145deg, rgba(68,66,74,.70), rgba(50,48,56,.60)),
                radial-gradient(circle at 72% 12%, rgba(161,187,202,.12), transparent 16vw);
        }
        .lead-form.compact input,
        .lead-form.compact textarea {
            background: rgba(249,248,248,.06);
            border-color: rgba(249,248,248,.12);
        }
        @media (max-width: 1180px) {
            .glass-panel { width: min(78vw, 820px); }
            .card-row,
            .tile-row.triple,
            .pricing-cards {
                grid-template-columns: 1fr;
            }
            .card-row {
                position: relative;
                left: auto;
                right: auto;
                bottom: auto;
                padding: min(43vh, 430px) var(--slide-gap) var(--slide-gap);
            }
            .plan-visual,
            .location-layout {
                grid-template-columns: 1fr;
            }
            .location-map {
                grid-row: auto;
                grid-column: auto;
                min-height: 360px;
            }
            .location-copy,
            .location-photo.left,
            .location-photo.right,
            .walk-list {
                grid-column: auto;
                grid-row: auto;
            }
        }
        @media (max-width: 760px) {
            .deck-frame {
                border-radius: 18px;
            }
            .glass-panel {
                min-height: 220px;
                padding: 78px 22px 30px;
            }
            .glass-panel h2,
            .light-title h2,
            .plan-frame h2,
            .location-copy h2 {
                font-size: clamp(34px, 10vw, 48px);
                letter-spacing: .07em;
            }
            .slide-logo { width: 108px; }
            .light-grid,
            .split-light {
                padding: 12px;
            }
            .light-title,
            .light-copy .pad,
            .feature-table {
                padding-left: 22px;
                padding-right: 22px;
            }
            .visual-stack,
            .tile-row,
            .tile-row.triple,
            .pricing-cards,
            .gallery-grid {
                grid-template-columns: 1fr;
            }
            .gallery-grid {
                padding-top: 300px;
            }
            .split-light .media img {
                min-height: 360px;
            }
            .media.contain img {
                width: min(88%, 420px);
            }
            .plan-legend {
                font-size: 16px;
            }
            .location-layout {
                padding: 86px 12px 12px;
            }
            .location-photo {
                aspect-ratio: 16 / 10;
                min-height: 0;
            }
            .walk-list {
                font-size: 18px;
            }
            .lounge-note {
                position: relative;
                top: auto;
                right: auto;
                width: auto;
                padding: 0 22px;
            }
        }

        /* Web landing system: calm, consistent, image-led sections after the first screen. */
        .web-deck {
            background:
                radial-gradient(circle at 82% 4%, rgba(161,187,202,.16), transparent 34vw),
                linear-gradient(180deg, #323038 0%, #2b2930 46%, #323038 100%);
            color: var(--brand-gray-1);
            overflow: hidden;
        }
        .web-section {
            position: relative;
            padding: clamp(74px, 8vw, 128px) 0;
            border-top: 1px solid rgba(249,248,248,.10);
            scroll-margin-top: 88px;
        }
        .web-section:first-child {
            border-top: 0;
            padding-top: 0;
        }
        .web-media {
            position: relative;
            width: 100vw;
            margin-left: calc(50% - 50vw);
            aspect-ratio: 16 / 9;
            min-height: min(72vh, 760px);
            max-height: 88vh;
            overflow: hidden;
            background: #242229;
        }
        .web-media img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            filter: saturate(1.03) contrast(1.02);
        }
        .web-media.contain img {
            object-fit: contain;
            padding: clamp(24px, 4vw, 64px);
            background:
                radial-gradient(circle at 58% 38%, rgba(249,248,248,.18), transparent 30vw),
                linear-gradient(145deg, #dedede, #f9f8f8);
        }
        .web-media::after {
            display: none;
        }
        .web-title-box {
            position: absolute !important;
            left: clamp(20px, 5vw, 84px);
            bottom: clamp(20px, 5vw, 72px);
            z-index: 2;
            width: min(640px, calc(100vw - 40px));
            padding: clamp(24px, 3vw, 44px);
            border: 1px solid rgba(249,248,248,.09);
            border-radius: 24px;
            background:
                linear-gradient(145deg, rgba(68,66,74,.56), rgba(50,48,56,.46)),
                radial-gradient(circle at 100% 0%, rgba(161,187,202,.10), transparent 20vw);
            box-shadow: 0 30px 90px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.10);
            backdrop-filter: blur(28px) saturate(140%);
            -webkit-backdrop-filter: blur(28px) saturate(140%);
        }
        .web-title-box h2 {
            margin: 0;
            font-size: clamp(34px, 4.8vw, 68px);
            line-height: 1.04;
            font-weight: 300;
            letter-spacing: .12em;
            text-transform: uppercase;
            text-wrap: balance;
        }
        .web-title-box p {
            margin: 18px 0 0;
            max-width: 520px;
            color: rgba(249,248,248,.74);
            font-size: clamp(15px, 1.25vw, 18px);
            line-height: 1.55;
        }
        .web-body {
            max-width: var(--max);
            margin: clamp(28px, 4vw, 56px) auto 0;
            padding: 0 24px;
        }
        .web-intro {
            display: grid;
            grid-template-columns: minmax(240px, .75fr) minmax(0, 1.25fr);
            gap: clamp(20px, 4vw, 72px);
            align-items: start;
            margin-bottom: clamp(22px, 3vw, 40px);
        }
        .web-kicker {
            margin: 0;
            color: rgba(249,248,248,.52);
            font-size: 12px;
            font-weight: 600;
            letter-spacing: .22em;
            text-transform: uppercase;
        }
        .web-lede {
            margin: 0;
            color: rgba(249,248,248,.72);
            font-size: clamp(18px, 1.7vw, 24px);
            line-height: 1.46;
        }
        .web-cards {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 16px;
        }
        .web-cards.two {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
        .web-card {
            min-height: 220px;
            padding: 28px;
            border: 1px solid rgba(249,248,248,.08);
            border-radius: 22px;
            background: linear-gradient(145deg, rgba(68,66,74,.58), rgba(50,48,56,.46));
            box-shadow: 0 20px 70px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.08);
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            gap: 28px;
            backdrop-filter: blur(20px);
            -webkit-backdrop-filter: blur(20px);
        }
        .web-card.light {
            background: linear-gradient(145deg, rgba(249,248,248,.76), rgba(222,222,222,.64));
            color: var(--brand-gray-11);
            border-color: rgba(249,248,248,.18);
        }
        .web-card.blue {
            background: linear-gradient(145deg, rgba(161,187,202,.76), rgba(222,222,222,.64));
            color: var(--brand-gray-11);
            border-color: rgba(161,187,202,.28);
        }
        .web-card h3 {
            margin: 0;
            max-width: 92%;
            font-size: clamp(17px, 1.5vw, 22px);
            line-height: 1.22;
            font-weight: 600;
            letter-spacing: .13em;
            text-transform: uppercase;
        }
        .web-card p {
            margin: 0;
            color: rgba(249,248,248,.70);
            font-size: 16px;
            line-height: 1.55;
        }
        .web-card.light p,
        .web-card.blue p {
            color: rgba(50,48,56,.66);
        }
        .web-list {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 1px;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid rgba(249,248,248,.08);
            background: rgba(249,248,248,.06);
        }
        .web-list div {
            min-height: 108px;
            padding: 22px 24px;
            background: rgba(249,248,248,.03);
            color: rgba(249,248,248,.72);
        }
        .web-list strong {
            display: block;
            margin-bottom: 8px;
            color: var(--brand-gray-1);
            font-size: 13px;
            letter-spacing: .14em;
            text-transform: uppercase;
        }
        .web-gallery {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 16px;
            margin-top: 16px;
        }
        .web-gallery img {
            width: 100%;
            aspect-ratio: 16 / 9;
            object-fit: cover;
            display: block;
        }
        .web-plan {
            background: transparent;
            color: var(--brand-gray-1);
        }
        .web-plan .web-kicker {
            color: var(--brand-blue);
        }
        .web-plan .web-lede {
            color: rgba(249,248,248,.75);
        }
        .web-plan h2 {
            margin: 0;
            font-size: clamp(34px, 5vw, 76px);
            line-height: 1;
            font-weight: 300;
            letter-spacing: .12em;
            text-transform: uppercase;
            color: var(--brand-gray-1);
        }
        .web-plan-media {
            width: min(1200px, calc(100vw - 40px));
            margin: clamp(24px, 4vw, 44px) auto 0;
            padding: clamp(18px, 3vw, 36px);
            background: linear-gradient(150deg, rgba(255, 255, 255, 0.96), rgba(245, 245, 248, 0.94));
            border-radius: 24px;
            border: 1px solid rgba(249, 248, 248, 0.14);
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
            display: flex;
            align-items: center;
            justify-content: center;
            box-sizing: border-box;
        }
        .web-plan-media img {
            width: 100%;
            max-height: 74vh;
            object-fit: contain;
            display: block;
            border-radius: 12px;
        }
        .web-contact .web-title-box {
            width: min(860px, calc(100vw - 40px));
        }
        .web-contact-panel {
            display: grid;
            grid-template-columns: minmax(280px, .8fr) minmax(320px, 1.2fr);
            gap: 16px;
        }
        .web-contact-panel .web-card {
            min-height: auto;
        }
        .web-contact-panel a {
            color: inherit;
            text-decoration: underline;
            text-underline-offset: 4px;
        }
        .web-contact-panel .lead-form {
            gap: 12px;
        }
        .web-contact-panel .lead-form input,
        .web-contact-panel .lead-form textarea {
            background: rgba(249,248,248,.08);
        }
        @media (max-width: 980px) {
            .web-intro,
            .web-cards,
            .web-cards.two,
            .web-list,
            .web-gallery,
            .web-contact-panel {
                grid-template-columns: 1fr;
            }
            .web-media {
                min-height: 56vh;
            }
        }
        @media (max-width: 640px) {
            .web-section {
                padding: 64px 0;
            }
            .web-media {
                min-height: 470px;
            }
            .web-title-box {
                left: 14px;
                right: 14px;
                bottom: 14px;
                width: auto;
                border-radius: 20px;
            }
            .web-body {
                padding: 0 16px;
            }
            .web-card {
                min-height: 190px;
                padding: 24px;
            }
        }

        /* Requested refinement: quieter scale, no image cropping, split layout for square assets. */
        .web-section {
            padding: clamp(60px, 6vw, 96px) 0;
        }
        .web-media {
            min-height: auto;
            max-height: none;
            background:
                linear-gradient(180deg, rgba(249,248,248,.04), rgba(50,48,56,.30)),
                #2b2930;
        }
        .web-media img {
            object-fit: cover;
        }
        .web-media::after {
            display: none;
        }
        .web-title-box {
            width: min(500px, calc(100vw - 40px));
            padding: clamp(20px, 2.2vw, 30px);
            border-radius: 20px;
            bottom: clamp(18px, 3.2vw, 48px);
        }
        .web-title-box h2 {
            font-size: clamp(26px, 3.05vw, 46px);
            line-height: 1.08;
            letter-spacing: .09em;
        }
        .web-title-box p {
            margin-top: 12px;
            font-size: clamp(14px, 1vw, 16px);
            line-height: 1.5;
        }
        .web-body {
            margin-top: clamp(22px, 3vw, 40px);
        }
        .web-lede {
            font-size: clamp(16px, 1.32vw, 20px);
        }
        .web-card {
            min-height: 165px;
            padding: 22px;
            border-radius: 18px;
            gap: 20px;
        }
        .web-card h3 {
            font-size: clamp(14px, 1.16vw, 18px);
            letter-spacing: .12em;
        }
        .web-card p {
            font-size: 14px;
            line-height: 1.5;
        }
        .web-list div {
            min-height: 86px;
            padding: 18px 20px;
            font-size: 14px;
            line-height: 1.5;
        }
        .web-list strong {
            font-size: 12px;
        }
        .web-gallery img {
            aspect-ratio: auto;
            height: auto;
            object-fit: contain;
            background: rgba(249,248,248,.03);
        }
        .web-plan h2 {
            font-size: clamp(30px, 3.8vw, 56px);
            letter-spacing: .09em;
        }
        .web-plan-media {
            padding-top: clamp(18px, 3vw, 42px);
            padding-bottom: clamp(18px, 3vw, 42px);
        }
        .web-split-section {
            background:
                radial-gradient(circle at 80% 16%, rgba(161,187,202,.10), transparent 28vw),
                linear-gradient(180deg, rgba(249,248,248,.02), rgba(249,248,248,0));
        }
        .web-split {
            max-width: var(--max);
            margin: 0 auto;
            padding: 0 24px;
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(360px, .92fr);
            gap: clamp(28px, 5vw, 72px);
            align-items: center;
        }
        .web-copy h2 {
            margin: 14px 0 18px;
            max-width: 680px;
            font-size: clamp(30px, 3.6vw, 52px);
            line-height: 1.08;
            font-weight: 300;
            letter-spacing: .09em;
            text-transform: uppercase;
        }
        .web-copy .web-lede {
            max-width: 640px;
            margin-bottom: 28px;
        }
        .web-copy .web-cards,
        .web-copy .web-list {
            margin-top: 22px;
        }
        .web-copy .web-cards,
        .web-copy .web-cards.two {
            grid-template-columns: 1fr;
            gap: 10px;
        }
        .web-copy .web-card {
            min-height: auto;
            padding: 18px 20px;
            gap: 12px;
        }
        .web-copy .web-card p {
            max-width: 54ch;
        }
        .web-copy .web-list {
            grid-template-columns: 1fr;
            border-radius: 18px;
        }
        .web-copy .web-list div {
            min-height: auto;
        }
        .web-split-visual {
            margin: 0;
            justify-self: stretch;
            display: grid;
            place-items: center;
        }
        .web-split-visual img {
            width: 100%;
            max-height: min(72vh, 760px);
            object-fit: contain;
            display: block;
            box-shadow: 0 30px 90px rgba(0,0,0,.20);
        }
        .web-split-visual.square img {
            aspect-ratio: auto;
        }
        @media (max-width: 980px) {
            .web-split {
                grid-template-columns: 1fr;
            }
            .web-split-visual {
                order: -1;
            }
            .web-split-visual img {
                max-height: 620px;
                max-width: min(100%, 640px);
            }
        }
        @media (max-width: 640px) {
            .web-section {
                padding: 54px 0;
            }
            .web-title-box h2,
            .web-copy h2 {
                font-size: clamp(26px, 8vw, 38px);
                letter-spacing: .07em;
            }
            .web-media {
                min-height: 0;
            }
            .web-card {
                min-height: 150px;
            }
            .web-split {
                padding: 0 16px;
            }
        }
        /* Final glass pass: keep blur, reduce material opacity across the landing page. */
        nav.top {
            background: rgba(50,48,56,.24);
            border-bottom-color: rgba(249,248,248,.08);
        }
        .hero-panel,
        .site-toc,
        .glass-panel,
        .glass-card,
        .contact-glass,
        .web-title-box,
        .web-card,
        .download,
        .lead-block,
        .contact-card {
            border-color: rgba(249,248,248,.08);
            box-shadow: 0 22px 70px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.08);
        }
        .hero-panel {
            background: linear-gradient(145deg, rgba(68,66,74,.56), rgba(50,48,56,.42));
        }
        .site-toc {
            background: linear-gradient(145deg, rgba(68,66,74,.34), rgba(50,48,56,.22));
        }
        .glass-panel,
        .contact-glass,
        .web-title-box {
            background:
                linear-gradient(145deg, rgba(68,66,74,.54), rgba(50,48,56,.42)),
                radial-gradient(circle at 80% 16%, rgba(161,187,202,.08), transparent 22vw);
        }
        .glass-card,
        .web-card {
            background: linear-gradient(145deg, rgba(68,66,74,.52), rgba(50,48,56,.42));
        }
        .web-card.light {
            background: linear-gradient(145deg, rgba(249,248,248,.72), rgba(222,222,222,.58));
            border-color: rgba(249,248,248,.16);
        }
        .web-card.blue {
            background: linear-gradient(145deg, rgba(161,187,202,.70), rgba(222,222,222,.56));
            border-color: rgba(161,187,202,.24);
        }
        .download,
        .lead-block {
            background: linear-gradient(135deg, rgba(161,187,202,.10), rgba(249,248,248,.05) 34%, rgba(50,48,56,.52));
        }
        .card,
        .price-card,
        .contact-card,
        .stats,
        .feature-list,
        .web-list {
            background-color: rgba(249,248,248,.035);
            border-color: rgba(249,248,248,.07);
        }
        .feature-row,
        .stat,
        .web-list div,
        .lead-form input,
        .lead-form textarea,
        .lead-form.compact input,
        .lead-form.compact textarea {
            background-color: rgba(249,248,248,.045);
        }
        .glass-panel::before,
        .glass-card::before,
        .contact-glass::before {
            opacity: .52;
        }

        /* Right-image editorial sections: image column goes flush to the viewport edge. */
        @media (min-width: 981px) {
            .web-split-section {
                padding: 0;
                min-height: clamp(720px, 86vh, 980px);
                overflow: hidden;
            }
            .web-split-section .web-split {
                width: 100%;
                max-width: none;
                min-height: inherit;
                margin: 0;
                padding-left: max(24px, calc((100vw - var(--max)) / 2 + 24px));
                padding-right: 0;
                grid-template-columns: minmax(0, 1fr) 50vw;
                gap: clamp(28px, 4vw, 64px);
                align-items: stretch;
            }
            .web-split-section .web-copy {
                align-self: center;
                max-width: 760px;
                padding: clamp(64px, 6vw, 96px) 0;
            }
            .web-split-section .web-split-visual {
                width: 50vw;
                min-height: inherit;
                height: 100%;
                align-self: stretch;
                justify-self: end;
                display: block;
                overflow: hidden;
                background: transparent;
            }
            .web-split-section .web-split-visual img {
                width: 100%;
                height: 100%;
                min-height: inherit;
                max-width: none;
                max-height: none;
                object-fit: cover;
                border-radius: 0;
                box-shadow: none;
                filter: none;
                background: transparent;
            }
        }
        @media (max-width: 980px) {
            .web-split-section .web-split-visual img {
                width: 100%;
                max-width: none;
                max-height: none;
                border-radius: 0;
                box-shadow: none;
                filter: none;
                background: transparent;
            }
        }

html[lang^="ar"] { --font-sans: "Noto Sans Arabic", "Manrope", sans-serif; }

[lang^="ar"] .hero-statement { unicode-bidi: isolate; text-align: right; }