* {
            font-family: 'Geist', system-ui, sans-serif;
        }

        html {
            scroll-behavior: smooth;
        }

        body {
            background: #f5f1e8;
            color: #0a0a08;
        }

        ::selection {
            background: #8a5a2b;
            color: #f5f1e8;
        }

        .no-underline {
            text-decoration: none;
        }

        .grain::before {
            content: '';
            position: fixed;
            inset: 0;
            pointer-events: none;
            opacity: 0.06;
            z-index: 1;
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
        }
    

/* ========================================= */


        :root {
            --ink: #0a0a08;
            --ink-2: #14140f;
            --ink-3: #1f1e18;
            --paper: #f5f1e8;
            --paper-2: #ece7d9;
            --paper-3: #e0dac8;
            --cognac: #8a5a2b;
            --cognac-deep: #5a3a18;
            --cognac-light: #c9a078;
            --line: rgba(10, 10, 8, 0.12);
            --line-strong: rgba(10, 10, 8, 0.22);
            --muted: #545048;
            --muted-2: #78746a;
            --display: 'Fraunces', 'Didot', 'Bodoni MT', serif;
            --editorial: 'Instrument Serif', Georgia, serif;
            --body: 'Geist', -apple-system, 'Helvetica Neue', sans-serif;
        }

        *,
        *::before,
        *::after {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        html {
            scroll-behavior: smooth;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

        body {
            font-family: var(--body);
            background: var(--paper);
            color: var(--ink);
            font-weight: 400;
            line-height: 1.5;
            overflow-x: hidden;
        }

        img {
            display: block;
            max-width: 100%;
        }

        a {
            color: inherit;
            text-decoration: none;
        }

        button {
            font-family: inherit;
            background: none;
            border: none;
            cursor: pointer;
            color: inherit;
        }

        ::selection {
            background: var(--ink);
            color: var(--paper);
        }

        /* GRAIN OVERLAY */
        body::before {
            content: '';
            position: fixed;
            inset: 0;
            pointer-events: none;
            z-index: 1000;
            opacity: 0.4;
            mix-blend-mode: multiply;
            background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.08 0 0 0 0 0.08 0 0 0 0 0.08 0 0 0 0.09 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
        }

        /* ============================== NAV ============================== */
        .nav {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            z-index: 9999;
            padding: 22px 48px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            transition: background 0.5s cubic-bezier(0.2, 0.8, 0.2, 1), padding 0.5s, color 0.5s;
            color: var(--paper);
        }

        .nav.scrolled {
            background: rgba(245, 241, 232, 0.94);
            backdrop-filter: blur(20px) saturate(1.2);
            -webkit-backdrop-filter: blur(20px) saturate(1.2);
            padding: 14px 48px;
            border-bottom: 1px solid var(--line);
            color: var(--ink);
        }

        .nav-left,
        .nav-right {
            display: flex;
            gap: 34px;
            align-items: center;
            font-size: 11.5px;
            letter-spacing: 0.18em;
            text-transform: uppercase;
            font-weight: 500;
        }

        .nav-right {
            justify-content: flex-end;
        }

        .nav a {
            transition: opacity 0.3s;
            position: relative;
        }

        .nav a:not(.nav-logo):not(.nav-cta)::after {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            bottom: -6px;
            height: 1px;
            background: currentColor;
            transform-origin: left;
            transform: scaleX(0);
            transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
        }

        .nav a:not(.nav-logo):not(.nav-cta):hover::after {
            transform: scaleX(1);
        }

        .nav-logo {
            font-family: var(--display);
            font-weight: 300;
            font-size: 24px;
            font-style: italic;
            white-space: nowrap;
            letter-spacing: -0.01em;
        }

        .nav-logo sup {
            font-style: normal;
            font-size: 0.4em;
            letter-spacing: 0.15em;
            vertical-align: super;
            margin: 0 1px;
            opacity: 0.7;
        }

        .nav-cta {
            padding: 10px 22px;
            border: 1px solid currentColor;
            border-radius: 100px;
            transition: background 0.35s, color 0.35s;
            font-size: 11px;
        }

        .nav.scrolled .nav-cta:hover {
            background: var(--ink);
            color: var(--paper);
        }

        .nav:not(.scrolled) .nav-cta:hover {
            background: var(--paper);
            color: var(--ink);
        }

        .lang-switch {
            display: flex;
            align-items: center;
            gap: 6px;
            font-size: 11px;
            letter-spacing: 0.2em;
            padding: 8px 12px;
            border: 1px solid rgba(245, 241, 232, 0.25);
            border-radius: 100px;
            transition: border-color 0.3s;
        }

        .lang-switch:hover {
            border-color: currentColor;
        }

        .lang-switch .dot {
            width: 4px;
            height: 4px;
            background: currentColor;
            border-radius: 50%;
            opacity: 0.7;
        }

        .hero-mobile-top {
            display: none;
        }

        .menu-toggle {
            display: none;
        }

        .mobile-menu {
            display: none;
            position: fixed;
            top: 60px;
            left: 0;
            right: 0;
            background: #fff;
            backdrop-filter: blur(24px);
            border-bottom: 1px solid #000;
            padding: 24px;
            z-index: 999;
            flex-direction: column;
            gap: 4px;
        }

        .mobile-toggle span {
            display: block;
            width: 22px;
            height: 2px;
            background: #999;
            border-radius: 2px;
        }

        .mobile-toggle {
            display: none;
            background: none;
            border: none;
            color: #fff;
            cursor: pointer;
            flex-direction: column;
            gap: 5px;
        }

        .mobile-menu a {
            display: block;
        }

        .mobile-menu a.nav-cta {
            display: inline-block;
        }

        /* ============================== HERO ============================== */
        .videos::after {
            display: block;
            content: '';
            clear: both;
            position: absolute;
            top: 0;
            left: 0;
            background: rgba(0, 0, 0, 0.7);
            height: 100%;
            width: 100%;
        }

        .videos {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            z-index: -1;
        }

        .videos #background {
            -o-object-fit: cover;
            object-fit: cover;
            display: block;
            top: 0;
            left: 0;
            right: 0;
            width: 100%;
            height: 100vh;
            z-index: 1;
        }

        .hero {
            position: relative;
            min-height: 100vh;
            height: 100vh;
            background: var(--ink);
            color: var(--paper);
            overflow: hidden;
        }

        /* Cinematic atmospheric backdrop - coastal dusk */
        .hero-bg {
            position: absolute;
            inset: 0;
            z-index: 1;
            background:
                radial-gradient(ellipse 700px 500px at 65% 35%, rgba(255, 230, 190, 0.4) 0%, rgba(255, 180, 120, 0.12) 35%, transparent 65%),
                radial-gradient(ellipse 1400px 700px at 50% 25%, rgba(200, 130, 85, 0.45) 0%, transparent 65%),
                linear-gradient(to bottom,
                    #0b1220 0%, #1a1a28 12%, #3e2a32 22%, #6e3d30 32%,
                    #96502e 42%, #a65a2e 52%, #7a3e22 66%, #2a160e 82%, #050302 100%);
        }

        .hero-bg::after {
            content: '';
            position: absolute;
            inset: 0;
            background:
                radial-gradient(ellipse 60% 40% at 50% 110%, rgba(0, 0, 0, 0.7), transparent 60%),
                radial-gradient(ellipse 40% 80% at 0% 50%, rgba(0, 0, 0, 0.4), transparent 60%);
        }

        /* Mountain layers */
        .hero-mountains {
            position: absolute;
            left: 0;
            right: 0;
            top: 45%;
            height: 22%;
            z-index: 2;
        }

        .hero-mtn {
            position: absolute;
            bottom: 0;
            width: 100%;
        }

        .hero-mtn.far {
            height: 100%;
            background: linear-gradient(to bottom, rgba(85, 60, 65, 0.45), rgba(55, 38, 42, 0.7));
            clip-path: polygon(0 75%, 8% 55%, 20% 68%, 32% 48%, 45% 62%, 58% 42%, 70% 58%, 82% 44%, 94% 56%, 100% 52%, 100% 100%, 0 100%);
            filter: blur(0.5px);
        }

        .hero-mtn.near {
            height: 90%;
            background: linear-gradient(to bottom, rgba(15, 10, 8, 0.92), rgba(4, 3, 2, 1));
            clip-path: polygon(0 88%, 5% 75%, 13% 80%, 22% 65%, 32% 78%, 42% 60%, 52% 72%, 62% 58%, 72% 72%, 82% 62%, 92% 76%, 100% 68%, 100% 100%, 0 100%);
        }

        /* Sea / horizon */
        .hero-sea {
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            height: 30%;
            z-index: 2;
            background:
                radial-gradient(ellipse 35% 30% at 65% 0%, rgba(255, 180, 120, 0.45), transparent 70%),
                linear-gradient(to bottom,
                    rgba(50, 55, 75, 0.35) 0%, rgba(22, 28, 48, 0.85) 50%, rgba(4, 6, 14, 1) 100%);
        }

        .hero-sea::before {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(to bottom,
                    transparent 4%, rgba(245, 200, 150, 0.22) 5.5%, transparent 7%,
                    transparent 14%, rgba(245, 200, 150, 0.15) 15.5%, transparent 17%,
                    transparent 26%, rgba(245, 200, 150, 0.1) 27%, transparent 28.5%,
                    transparent 42%, rgba(245, 200, 150, 0.06) 43%, transparent 44%);
        }

        .hero-sea::after {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
            height: 1px;
            background: linear-gradient(to right, transparent, rgba(255, 210, 160, 0.6) 50%, transparent);
        }

        /* Villa architectural silhouette */
        .hero-arch {
            position: absolute;
            left: 0;
            right: 0;
            bottom: 26%;
            height: 12%;
            z-index: 3;
            background: linear-gradient(to bottom, rgba(8, 6, 4, 0.8), rgba(2, 1, 1, 0.98));
            clip-path: polygon(0 58%, 15% 58%, 15% 38%, 30% 38%, 30% 22%, 52% 22%, 52% 10%, 72% 10%, 72% 30%, 88% 30%, 88% 58%, 100% 58%, 100% 100%, 0 100%);
        }

        .hero-arch-glow {
            position: absolute;
            left: 0;
            right: 0;
            bottom: 26%;
            height: 12%;
            z-index: 4;
            pointer-events: none;
            background:
                radial-gradient(ellipse 5% 32% at 20% 72%, rgba(255, 195, 140, 0.6), transparent 65%),
                radial-gradient(ellipse 6% 40% at 41% 55%, rgba(255, 195, 140, 0.62), transparent 62%),
                radial-gradient(ellipse 6% 40% at 62% 40%, rgba(255, 195, 140, 0.55), transparent 62%),
                radial-gradient(ellipse 5% 32% at 84% 72%, rgba(255, 195, 140, 0.6), transparent 65%);
            mix-blend-mode: screen;
        }

        /* Palm */
        .hero-palm {
            position: absolute;
            right: -4%;
            top: 14%;
            width: 280px;
            height: 340px;
            z-index: 5;
            pointer-events: none;
            opacity: 0.85;
        }

        .hero-palm .trunk {
            position: absolute;
            left: 48%;
            top: 38%;
            width: 5px;
            height: 62%;
            background: linear-gradient(to bottom, rgba(6, 4, 2, 0.95), #000);
            transform: rotate(-5deg);
            transform-origin: top;
            border-radius: 2px;
        }

        .hero-palm .frond {
            position: absolute;
            left: 48%;
            top: 38%;
            width: 190px;
            height: 12px;
            background: rgba(5, 3, 2, 0.92);
            border-radius: 100px 4px 4px 100px;
            transform-origin: 0 50%;
            filter: blur(0.4px);
        }

        .hero-palm .f1 {
            transform: rotate(-115deg);
            width: 135px;
            height: 10px;
        }

        .hero-palm .f2 {
            transform: rotate(-82deg);
            width: 170px;
        }

        .hero-palm .f3 {
            transform: rotate(-52deg);
            width: 195px;
            height: 14px;
        }

        .hero-palm .f4 {
            transform: rotate(-22deg);
            width: 200px;
            height: 14px;
        }

        .hero-palm .f5 {
            transform: rotate(12deg);
            width: 195px;
            height: 13px;
        }

        .hero-palm .f6 {
            transform: rotate(42deg);
            width: 180px;
        }

        .hero-palm .f7 {
            transform: rotate(72deg);
            width: 165px;
            height: 11px;
        }

        .hero-palm .f8 {
            transform: rotate(102deg);
            width: 140px;
            height: 10px;
        }

        /* Dark left-side gradient for text legibility */
        .hero-bg-vignette {
            position: absolute;
            inset: 0;
            z-index: 6;
            pointer-events: none;
            background:
                linear-gradient(to right, rgba(5, 5, 4, 0.7) 0%, rgba(5, 5, 4, 0.35) 30%, transparent 55%, transparent 100%),
                linear-gradient(to bottom, rgba(5, 5, 4, 0.4) 0%, transparent 20%, transparent 70%, rgba(5, 5, 4, 0.5) 100%);
        }

        /* Hero content */
        .hero-content {
            position: relative;
            z-index: 10;
            height: 100%;
            display: flex;
            flex-direction: column;
            justify-content: center;
            padding: 100px 48px 80px 48px;
        }

        .hero-top {
            position: absolute;
            top: 120px;
            left: 48px;
            right: 48px;
            z-index: 10;
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
        }

        .hero-eyebrow {
            display: flex;
            align-items: center;
            gap: 16px;
            font-size: 11px;
            letter-spacing: 0.32em;
            text-transform: uppercase;
            font-weight: 500;
            color: rgba(245, 241, 232, 0.85);
            animation: fadeUp 1s 0.3s both;
        }

        .hero-eyebrow::before {
            content: '';
            width: 40px;
            height: 1px;
            background: currentColor;
            opacity: 0.6;
        }

        .hero-location {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 14px;
            color: rgba(245, 241, 232, 0.7);
            animation: fadeUp 1s 0.4s both;
        }

        .hero-headline {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(56px, 9vw, 148px);
            line-height: 0.92;
            letter-spacing: -0.035em;
            max-width: 14ch;
            animation: fadeUp 1.2s 0.5s both;
        }

        .hero-headline em {
            font-style: italic;
            font-weight: 300;
            color: var(--cognac-light);
        }

        .hero-bottom {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            margin-top: 60px;
            gap: 40px;
            animation: fadeUp 1s 0.9s both;
        }

        .hero-lede {
            max-width: 420px;
            font-size: 16px;
            line-height: 1.6;
            color: rgba(245, 241, 232, 0.82);
            font-weight: 300;
        }

        .hero-actions {
            display: flex;
            align-items: center;
            gap: 24px;
        }

        .hero-cta {
            display: inline-flex;
            align-items: center;
            gap: 14px;
            padding: 20px 36px;
            background: var(--paper);
            color: var(--ink);
            border-radius: 100px;
            font-size: 12px;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            font-weight: 500;
            transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), background 0.3s, box-shadow 0.4s;
            box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset;
        }

        .hero-cta:hover {
            transform: translateY(-2px);
            box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
        }

        .hero-cta .arr {
            display: inline-block;
            transition: transform 0.3s;
        }

        .hero-cta:hover .arr {
            transform: translateX(4px);
        }

        .hero-cta-text {
            font-size: 11px;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            font-weight: 500;
            color: rgba(245, 241, 232, 0.75);
            transition: color 0.3s;
            display: inline-flex;
            align-items: center;
            gap: 10px;
        }

        .hero-cta-text:hover {
            color: var(--paper);
        }

        .hero-cta-text::before {
            content: '';
            width: 28px;
            height: 1px;
            background: currentColor;
            opacity: 0.5;
        }

        /* Scroll indicator */
        .hero-scroll {
            position: absolute;
            bottom: 32px;
            left: 50%;
            transform: translateX(-50%);
            z-index: 10;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 10px;
            font-size: 10px;
            letter-spacing: 0.35em;
            text-transform: uppercase;
            color: rgba(245, 241, 232, 0.55);
            font-weight: 500;
            animation: fadeUp 1s 1.2s both;
        }

        .hero-scroll .line {
            width: 1px;
            height: 30px;
            background: rgba(245, 241, 232, 0.3);
            position: relative;
            overflow: hidden;
        }

        .hero-scroll .line::before {
            content: '';
            position: absolute;
            top: -30px;
            left: 0;
            right: 0;
            height: 30px;
            background: linear-gradient(to bottom, transparent, var(--paper));
            animation: scrollLine 2.5s ease-in-out infinite;
        }

        @keyframes scrollLine {
            0% {
                top: -30px;
            }

            100% {
                top: 30px;
            }
        }

        /* Hero meta (corner labels) */
        .hero-corner-tl,
        .hero-corner-bl,
        .hero-corner-br {
            position: absolute;
            z-index: 10;
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            font-weight: 500;
            color: rgba(245, 241, 232, 0.55);
        }

        .hero-corner-tl {
            top: 32px;
            left: 48px;
            display: none;
        }

        .hero-corner-br {
            bottom: 48px;
            right: 48px;
            font-family: var(--editorial);
            font-style: italic;
            text-transform: none;
            font-size: 13px;
            letter-spacing: 0.02em;
            text-align: right;
            color: rgba(245, 241, 232, 0.75);
            animation: fadeUp 1s 1.1s both;
        }

        .hero-corner-br strong {
            display: block;
            font-family: var(--body);
            font-style: normal;
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            font-weight: 500;
            margin-bottom: 5px;
            opacity: 0.85;
        }

        @keyframes fadeUp {
            from {
                opacity: 0;
                transform: translateY(24px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* ============================== PRESS ============================== */
        .press {
            background: var(--ink);
            color: var(--paper);
            padding: 48px 48px;
            border-top: 1px solid rgba(245, 241, 232, 0.08);
            border-bottom: 1px solid rgba(245, 241, 232, 0.08);
        }

        .press-inner {
            max-width: 1640px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: auto 1fr;
            gap: 60px;
            align-items: center;
        }

        .press-label {
            font-size: 10px;
            letter-spacing: 0.35em;
            text-transform: uppercase;
            font-weight: 500;
            color: rgba(245, 241, 232, 0.55);
            white-space: nowrap;
            display: flex;
            align-items: center;
            gap: 14px;
        }

        .press-label::after {
            content: '';
            width: 40px;
            height: 1px;
            background: currentColor;
            opacity: 0.4;
        }

        .press-items {
            display: flex;
            align-items: center;
            gap: 64px;
            overflow: hidden;
            position: relative;
        }

        .press-items::before,
        .press-items::after {
            content: '';
            position: absolute;
            top: 0;
            bottom: 0;
            width: 60px;
            z-index: 2;
            pointer-events: none;
        }

        .press-items::before {
            left: 0;
            background: linear-gradient(to right, var(--ink), transparent);
        }

        .press-items::after {
            right: 0;
            background: linear-gradient(to left, var(--ink), transparent);
        }

        .press-track {
            display: flex;
            gap: 64px;
            align-items: center;
            animation: press-scroll 45s linear infinite;
            white-space: nowrap;
        }

        @keyframes press-scroll {
            from {
                transform: translateX(0);
            }

            to {
                transform: translateX(-50%);
            }
        }

        .press-item {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 24px;
            color: rgba(245, 241, 232, 0.7);
            letter-spacing: -0.01em;
            display: inline-flex;
            align-items: center;
            gap: 64px;
        }

        .press-item::after {
            content: '✦';
            font-size: 10px;
            opacity: 0.4;
            font-style: normal;
        }

        /* ============================== INTRO ============================== */
        .intro {
            padding: 180px 48px 140px 48px;
            position: relative;
        }

        .intro-inner {
            max-width: 1640px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1fr 2fr;
            gap: 80px;
            align-items: start;
        }

        .intro-meta {
            display: flex;
            flex-direction: column;
            gap: 16px;
            padding-top: 12px;
        }

        .section-label {
            font-size: 10px;
            letter-spacing: 0.35em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
            display: flex;
            align-items: center;
            gap: 14px;
        }

        .section-label::before {
            content: '';
            width: 40px;
            height: 1px;
            background: currentColor;
        }

        .section-folio {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 14px;
            color: var(--muted-2);
            letter-spacing: 0.02em;
        }

        .intro-headline {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(44px, 5vw, 88px);
            line-height: 1.02;
            letter-spacing: -0.03em;
            max-width: 20ch;
        }

        .intro-headline em {
            font-style: italic;
            font-weight: 300;
            color: var(--cognac-deep);
        }

        .intro-body {
            margin-top: 48px;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 48px;
            max-width: 900px;
            font-size: 16px;
            line-height: 1.7;
            color: var(--muted);
            font-weight: 400;
        }

        .intro-body p+p {
            margin-top: 18px;
        }

        .intro-signature {
            margin-top: 64px;
            font-family: var(--editorial);
            font-style: italic;
            font-size: 20px;
            color: var(--ink);
            display: flex;
            align-items: center;
            gap: 24px;
        }

        .intro-signature::before {
            content: '';
            width: 60px;
            height: 1px;
            background: var(--ink);
        }

        /* Huge typographic moment */
        .marque-type {
            padding: 120px 48px 80px 48px;
            text-align: center;
            overflow: hidden;
        }

        .marque-type .word {
            font-family: var(--display);
            font-weight: 200;
            font-style: italic;
            font-size: clamp(120px, 24vw, 380px);
            line-height: 0.85;
            letter-spacing: -0.05em;
            color: var(--ink);
            display: block;
        }

        .marque-type .sub {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 18px;
            color: var(--muted);
            margin-top: 24px;
            letter-spacing: 0.02em;
        }

        /* ============================== STATS BAND ============================== */
        .stats-band {
            background: var(--ink);
            color: var(--paper);
            padding: 120px 48px;
            position: relative;
            overflow: hidden;
        }

        .stats-band-grid {
            max-width: 1640px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 0;
            border-top: 1px solid rgba(245, 241, 232, 0.14);
        }

        .stat-cell {
            padding: 56px 40px 0 0;
            border-right: 1px solid rgba(245, 241, 232, 0.14);
            display: flex;
            flex-direction: column;
            gap: 20px;
        }

        .stat-cell:last-child {
            border-right: none;
            padding-right: 0;
        }

        .stat-cell:not(:first-child) {
            padding-left: 40px;
        }

        .stat-num {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(56px, 6vw, 96px);
            line-height: 1;
            letter-spacing: -0.03em;
        }

        .stat-num em {
            font-style: italic;
            font-weight: 300;
            color: var(--cognac-light);
        }

        .stat-label {
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            color: rgba(245, 241, 232, 0.6);
            font-weight: 500;
        }

        .stat-note {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 14px;
            line-height: 1.55;
            color: rgba(245, 241, 232, 0.7);
            margin-top: 4px;
        }

        .stats-band-head {
            max-width: 1640px;
            margin: 0 auto 64px auto;
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            gap: 60px;
        }

        .stats-band-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(40px, 4vw, 64px);
            line-height: 1;
            letter-spacing: -0.03em;
            max-width: 14ch;
        }

        .stats-band-head h2 em {
            font-style: italic;
            color: var(--cognac-light);
        }

        .stats-band-head .meta {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 14px;
            color: rgba(245, 241, 232, 0.55);
            text-align: right;
            line-height: 1.5;
            max-width: 280px;
        }

        .stats-band-head .meta strong {
            display: block;
            font-family: var(--body);
            font-style: normal;
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            margin-bottom: 8px;
            opacity: 0.8;
        }

        /* ============================== PROPERTIES ============================== */
        .properties-section {
            padding: 160px 48px 140px 48px;
            background: var(--paper);
        }

        .properties-head {
            max-width: 1640px;
            margin: 0 auto 80px auto;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 80px;
            align-items: end;
        }

        .properties-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(52px, 6vw, 96px);
            line-height: 0.95;
            letter-spacing: -0.035em;
            margin-top: 24px;
        }

        .properties-head h2 em {
            font-style: italic;
        }

        .properties-filters {
            display: flex;
            gap: 10px;
            flex-wrap: wrap;
            justify-content: flex-end;
        }

        .filter-chip {
            padding: 10px 20px;
            border: 1px solid var(--line-strong);
            border-radius: 100px;
            font-size: 11px;
            letter-spacing: 0.15em;
            text-transform: uppercase;
            font-weight: 500;
            transition: background 0.3s, color 0.3s, border-color 0.3s;
            color: var(--muted);
        }

        .filter-chip.active {
            background: var(--ink);
            color: var(--paper);
            border-color: var(--ink);
        }

        .filter-chip:hover:not(.active) {
            border-color: var(--ink);
            color: var(--ink);
        }

        .property-grid {
            max-width: 1640px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(6, 1fr);
            gap: 48px 32px;
        }

        .property {
            cursor: pointer;
        }

        .property.wide {
            grid-column: span 3;
        }

        .property.narrow {
            grid-column: span 2;
        }

        .property.full {
            grid-column: span 6;
        }

        .property-img-wrap {
            position: relative;
            overflow: hidden;
            aspect-ratio: 4/5;
            margin-bottom: 28px;
        }

        .property.wide .property-img-wrap {
            aspect-ratio: 5/6;
        }

        .property.full .property-img-wrap {
            aspect-ratio: 21/9;
        }

        .property-img {
            position: absolute;
            inset: 0;
            transition: transform 1s cubic-bezier(0.2, 0.8, 0.2, 1);
        }

        .property:hover .property-img {
            transform: scale(1.04);
        }

        .property-top {
            position: absolute;
            top: 20px;
            left: 20px;
            right: 20px;
            z-index: 5;
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
        }

        .property-badge {
            padding: 7px 14px;
            background: var(--paper);
            color: var(--ink);
            font-size: 10px;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            font-weight: 500;
        }

        .property-num {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 13px;
            color: rgba(245, 241, 232, 0.85);
            letter-spacing: 0.02em;
        }

        .property-bottom-overlay {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            padding: 24px;
            z-index: 5;
            color: var(--paper);
            background: linear-gradient(to top, rgba(0, 0, 0, 0.55), transparent);
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
        }

        .property-price-overlay {
            font-family: var(--display);
            font-style: italic;
            font-weight: 300;
            font-size: 28px;
            letter-spacing: -0.01em;
        }

        .property-view {
            font-size: 10px;
            letter-spacing: 0.25em;
            text-transform: uppercase;
            font-weight: 500;
            display: inline-flex;
            align-items: center;
            gap: 8px;
        }

        .property-meta {
            display: flex;
            justify-content: space-between;
            align-items: baseline;
            font-size: 10px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--muted);
            margin-bottom: 12px;
            font-weight: 500;
        }

        .property h3 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 30px;
            line-height: 1.12;
            letter-spacing: -0.015em;
            margin-bottom: 16px;
        }

        .property h3 em {
            font-style: italic;
        }

        .property-specs {
            display: flex;
            gap: 16px;
            font-size: 13px;
            color: var(--muted);
            font-family: var(--editorial);
            font-style: italic;
        }

        .property-specs span:not(.dot) {
            font-feature-settings: "tnum";
        }

        .property-specs .dot {
            color: var(--line-strong);
        }

        /* Property image compositions - atmospheric gradient meshes */

        /* P1: Villa Aloha - Sierra Blanca golden hour */
        .pimg-1 {
            background:
                radial-gradient(ellipse 350px 220px at 65% 25%, rgba(255, 240, 200, 0.5) 0%, transparent 65%),
                linear-gradient(to bottom,
                    #1e2840 0%, #3c3448 14%, #6e4832 28%, #a6603a 42%,
                    #c47244 52%, #a85230 66%, #4a2614 80%, #0a0604 100%);
        }

        .pimg-1::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 38%;
            height: 14%;
            background: linear-gradient(to bottom, rgba(55, 38, 42, 0.5), rgba(25, 18, 20, 0.85));
            clip-path: polygon(0 75%, 10% 50%, 22% 62%, 35% 42%, 48% 58%, 62% 38%, 75% 55%, 88% 42%, 100% 52%, 100% 100%, 0 100%);
        }

        .pimg-1::after {
            content: '';
            position: absolute;
            left: 8%;
            right: 8%;
            bottom: 14%;
            height: 32%;
            background:
                radial-gradient(ellipse 5% 30% at 10% 65%, rgba(255, 195, 140, 0.65), transparent 60%),
                radial-gradient(ellipse 5% 30% at 24% 65%, rgba(255, 195, 140, 0.55), transparent 60%),
                radial-gradient(ellipse 6% 40% at 50% 50%, rgba(255, 195, 140, 0.65), transparent 60%),
                radial-gradient(ellipse 5% 30% at 76% 65%, rgba(255, 195, 140, 0.55), transparent 60%),
                radial-gradient(ellipse 5% 30% at 90% 65%, rgba(255, 195, 140, 0.65), transparent 60%),
                linear-gradient(to bottom, transparent 30%, rgba(8, 6, 4, 0.88) 35%, rgba(2, 1, 1, 0.98) 100%);
            clip-path: polygon(0 30%, 15% 30%, 15% 10%, 45% 10%, 45% 0, 75% 0, 75% 30%, 100% 30%, 100% 100%, 0 100%);
        }

        /* P2: Casa del Mirador - La Zagaleta terracotta dusk */
        .pimg-2 {
            background:
                radial-gradient(ellipse 400px 220px at 50% 25%, rgba(245, 215, 175, 0.55) 0%, transparent 70%),
                linear-gradient(to bottom,
                    #c8ae8a 0%, #d8b090 22%, #b08460 44%, #6a4228 66%, #2a1a10 100%);
        }

        .pimg-2::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 38%;
            height: 10%;
            background: linear-gradient(to bottom, rgba(88, 92, 58, 0.65), rgba(55, 58, 38, 0.88));
            clip-path: polygon(0 100%, 18% 35%, 42% 65%, 66% 28%, 88% 55%, 100% 42%, 100% 100%);
        }

        /* P3: Marina Duplex - Puerto Banús sunset terrace */
        .pimg-3 {
            background:
                radial-gradient(ellipse 380px 200px at 58% 28%, rgba(255, 228, 180, 0.68) 0%, transparent 70%),
                radial-gradient(ellipse 240px 120px at 58% 28%, rgba(255, 255, 220, 0.75) 0%, transparent 50%),
                linear-gradient(to bottom,
                    #263a52 0%, #7a5450 16%, #c87248 30%, #e69058 44%,
                    #4a687e 58%, #2a3a4e 72%, #152238 90%, #060a18 100%);
        }

        .pimg-3::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 58%;
            height: 2%;
            background: linear-gradient(to right, transparent, rgba(255, 200, 140, 0.9), rgba(255, 175, 115, 0.7), transparent);
        }

        .pimg-3::after {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            height: 36%;
            background: linear-gradient(to bottom,
                    rgba(215, 198, 172, 0.92) 0%, rgba(170, 150, 120, 1) 40%, rgba(92, 74, 50, 1) 100%);
        }

        /* P4: Beach Club Residence - wide featured */
        .pimg-4 {
            background:
                radial-gradient(ellipse 50% 70% at 30% 0%, rgba(100, 140, 170, 0.5), transparent 70%),
                linear-gradient(to bottom,
                    #6a8aa0 0%, #a8c0ce 22%, #d4dfde 42%,
                    #c8bfa8 58%, #8aa2b4 78%, #446478 100%);
        }

        .pimg-4::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 48%;
            height: 6%;
            background: linear-gradient(to bottom, rgba(60, 95, 118, 0.6), rgba(40, 65, 82, 0.85));
        }

        .pimg-4::after {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            height: 44%;
            background:
                radial-gradient(ellipse 80% 100% at 50% 60%, rgba(240, 232, 212, 0.7), transparent 70%),
                linear-gradient(to bottom,
                    rgba(200, 190, 168, 0.95) 0%, rgba(168, 150, 120, 0.98) 50%, rgba(92, 75, 50, 1) 100%);
        }

        /* P5: Modern Estate - Nueva Andalucía */
        .pimg-5 {
            background:
                radial-gradient(ellipse 300px 180px at 55% 22%, rgba(255, 248, 228, 0.5) 0%, transparent 65%),
                linear-gradient(to bottom,
                    #aec0c8 0%, #c8d0cc 20%, #d8ccb0 38%, #7e8a78 56%,
                    #4a6476 72%, #284860 88%, #10202e 100%);
        }

        .pimg-5::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 36%;
            height: 10%;
            background: linear-gradient(to bottom, rgba(80, 92, 108, 0.55), rgba(48, 60, 75, 0.82));
            clip-path: polygon(0 85%, 14% 32%, 26% 60%, 40% 22%, 54% 55%, 68% 28%, 82% 50%, 94% 32%, 100% 42%, 100% 100%, 0 100%);
        }

        .pimg-5::after {
            content: '';
            position: absolute;
            left: 6%;
            right: 6%;
            bottom: 18%;
            height: 28%;
            background: linear-gradient(to bottom, rgba(6, 4, 2, 0.94), rgba(2, 1, 1, 1));
            clip-path: polygon(0 52%, 18% 52%, 18% 14%, 42% 14%, 42% 0, 74% 0, 74% 52%, 100% 52%, 100% 100%, 0 100%);
        }

        /* P6: Contemporary Penthouse - El Paraíso */
        .pimg-6 {
            background:
                radial-gradient(ellipse 280px 160px at 62% 28%, rgba(255, 222, 188, 0.55) 0%, transparent 65%),
                linear-gradient(to bottom,
                    #4a5878 0%, #8a6050 18%, #c87048 34%, #d87848 48%,
                    #7a5a58 64%, #3a4058 80%, #101825 100%);
        }

        .pimg-6::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 60%;
            height: 2%;
            background: linear-gradient(to right, transparent, rgba(255, 195, 140, 0.85), transparent);
        }

        .pimg-6::after {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            height: 32%;
            background: linear-gradient(to bottom,
                    rgba(212, 198, 170, 0.9) 0%, rgba(168, 148, 118, 0.98) 45%, rgba(82, 65, 42, 1) 100%);
        }

        .properties-footer {
            max-width: 1640px;
            margin: 80px auto 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding-top: 48px;
            border-top: 1px solid var(--line);
        }

        .properties-footer-note {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 16px;
            color: var(--muted);
            max-width: 40ch;
            line-height: 1.5;
        }

        .btn-outline {
            display: inline-flex;
            align-items: center;
            gap: 12px;
            padding: 18px 32px;
            border: 1px solid var(--ink);
            border-radius: 100px;
            font-size: 11px;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            font-weight: 500;
            transition: background 0.35s, color 0.35s;
        }

        .btn-outline:hover {
            background: var(--ink);
            color: var(--paper);
        }

        /* ============================== NEIGHBORHOODS ============================== */
        .neighborhoods {
            padding: 160px 48px;
            background: var(--paper-2);
            position: relative;
        }

        .nbh-head {
            max-width: 1640px;
            margin: 0 auto 80px auto;
            display: grid;
            grid-template-columns: 1fr 1.2fr;
            gap: 80px;
            align-items: end;
        }

        .nbh-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(48px, 5.5vw, 88px);
            line-height: 0.96;
            letter-spacing: -0.035em;
            margin-top: 24px;
        }

        .nbh-head h2 em {
            font-style: italic;
        }

        .nbh-head p {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 20px;
            line-height: 1.55;
            color: var(--muted);
            max-width: 500px;
        }

        .nbh-grid {
            max-width: 1640px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 1px;
            background: var(--line-strong);
            border: 1px solid var(--line-strong);
        }

        .nbh-cell {
            background: var(--paper-2);
            padding: 44px 32px 36px 32px;
            min-height: 260px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            transition: background 0.4s;
            position: relative;
        }

        .nbh-cell:hover {
            background: var(--paper);
        }

        .nbh-cell-num {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 13px;
            color: var(--muted-2);
            letter-spacing: 0.02em;
        }

        .nbh-cell h3 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 32px;
            line-height: 1.05;
            letter-spacing: -0.02em;
            margin: 48px 0 12px 0;
        }

        .nbh-cell h3 em {
            font-style: italic;
        }

        .nbh-cell-desc {
            font-size: 13px;
            color: var(--muted);
            line-height: 1.55;
            max-width: 28ch;
        }

        .nbh-cell-stats {
            display: flex;
            gap: 24px;
            margin-top: 24px;
            font-size: 10px;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
        }

        .nbh-cell-stats strong {
            display: block;
            font-family: var(--display);
            font-style: italic;
            font-weight: 300;
            font-size: 22px;
            letter-spacing: -0.01em;
            color: var(--ink);
            margin-bottom: 4px;
        }

        .nbh-cell-tag {
            margin-top: 20px;
            font-family: var(--editorial);
            font-style: italic;
            font-size: 13px;
            color: var(--cognac);
            letter-spacing: 0.02em;
            padding-top: 16px;
            border-top: 1px solid var(--line);
        }

        .nbh-cell-arr {
            position: absolute;
            top: 44px;
            right: 32px;
            font-size: 18px;
            color: var(--muted-2);
            transition: transform 0.4s, color 0.3s;
        }

        .nbh-cell:hover .nbh-cell-arr {
            transform: translateX(4px);
            color: var(--cognac);
        }

        /* ============================== TEAM ============================== */
        .team {
            padding: 180px 48px;
            background: var(--paper);
        }

        .team-head {
            max-width: 1640px;
            margin: 0 auto 100px auto;
            display: grid;
            grid-template-columns: 1fr 1.4fr;
            gap: 80px;
            align-items: start;
        }

        .team-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(52px, 6vw, 96px);
            line-height: 0.95;
            letter-spacing: -0.035em;
            margin-top: 24px;
        }

        .team-head h2 em {
            font-style: italic;
        }

        .team-head-body {
            font-size: 17px;
            line-height: 1.7;
            color: var(--muted);
            max-width: 56ch;
            margin-top: 24px;
        }

        .team-grid {
            max-width: 1640px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 40px;
        }

        .team-grid.team-solo {
            grid-template-columns: 1fr;
            max-width: 1200px;
            gap: 0;
        }

        .team-solo .member {
            display: grid;
            grid-template-columns: 1fr 1.5fr;
            gap: 80px;
            align-items: center;
        }

        .team-solo .member .portrait {
            aspect-ratio: 3/4;
            margin-bottom: 0;
        }

        .team-solo .member-content {
            display: flex;
            flex-direction: column;
        }

        .team-solo .member h3 {
            font-size: 56px;
            font-weight: 200;
            margin-bottom: 24px;
            line-height: 0.95;
        }

        .team-solo .member-role {
            font-size: 11px;
            margin-bottom: 16px;
        }

        .team-solo .member-bio {
            font-size: 18px;
            line-height: 1.65;
            max-width: 52ch;
            color: var(--muted);
            margin-bottom: 32px;
        }

        .team-solo .member-meta {
            font-size: 13px;
            gap: 12px;
            padding-top: 28px;
            border-top: 1px solid var(--line);
        }

        .member .portrait {
            position: relative;
            aspect-ratio: 3/4;
            overflow: hidden;
            margin-bottom: 28px;
            background: var(--paper-3);
        }

        .member .portrait::after {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(to bottom, transparent 50%, rgba(10, 10, 8, 0.25) 100%);
        }

        /* Portrait SVG-stylized compositions */
        .p-portrait-1 {
            background:
                radial-gradient(ellipse 55% 50% at 50% 35%, rgba(200, 175, 145, 0.95), rgba(150, 118, 85, 0.8) 55%, rgba(80, 55, 30, 0.9) 90%),
                linear-gradient(to bottom, #d4c4a8 0%, #a88862 30%, #4a3420 70%, #1a1008 100%);
        }

        .p-portrait-1::before {
            content: '';
            position: absolute;
            left: 25%;
            right: 25%;
            top: 18%;
            bottom: 30%;
            background:
                radial-gradient(ellipse 60% 70% at 50% 35%, rgba(230, 200, 170, 0.95), transparent 68%);
            filter: blur(2px);
        }

        .p-portrait-1::after {
            content: '';
            position: absolute;
            left: 15%;
            right: 15%;
            bottom: 0;
            height: 42%;
            background: linear-gradient(to bottom, rgba(40, 28, 18, 0.9) 0%, rgba(15, 10, 6, 1) 100%);
            clip-path: polygon(25% 0, 75% 0, 95% 100%, 5% 100%);
        }

        .p-portrait-2 {
            background:
                radial-gradient(ellipse 55% 50% at 50% 35%, rgba(195, 168, 140, 0.95), rgba(128, 98, 72, 0.85) 55%, rgba(50, 32, 18, 0.95) 92%),
                linear-gradient(to bottom, #c8b498 0%, #8a6a48 32%, #3a2818 72%, #120b04 100%);
        }

        .p-portrait-2::before {
            content: '';
            position: absolute;
            left: 28%;
            right: 28%;
            top: 20%;
            bottom: 32%;
            background: radial-gradient(ellipse 60% 70% at 50% 35%, rgba(215, 185, 155, 0.95), transparent 68%);
            filter: blur(2px);
        }

        .p-portrait-2::after {
            content: '';
            position: absolute;
            left: 12%;
            right: 12%;
            bottom: 0;
            height: 40%;
            background: linear-gradient(to bottom, rgba(180, 148, 108, 0.9), rgba(110, 82, 50, 1) 60%, rgba(50, 35, 18, 1) 100%);
            clip-path: polygon(22% 0, 78% 0, 96% 100%, 4% 100%);
        }

        .p-portrait-3 {
            background:
                radial-gradient(ellipse 55% 50% at 50% 35%, rgba(210, 180, 152, 0.95), rgba(158, 122, 88, 0.85) 55%, rgba(62, 42, 22, 0.95) 92%),
                linear-gradient(to bottom, #d0bea0 0%, #9a7a56 32%, #4a3220 72%, #180e06 100%);
        }

        .p-portrait-3::before {
            content: '';
            position: absolute;
            left: 26%;
            right: 26%;
            top: 18%;
            bottom: 30%;
            background: radial-gradient(ellipse 60% 70% at 50% 35%, rgba(222, 192, 162, 0.95), transparent 68%);
            filter: blur(2px);
        }

        .p-portrait-3::after {
            content: '';
            position: absolute;
            left: 16%;
            right: 16%;
            bottom: 0;
            height: 42%;
            background: linear-gradient(to bottom, rgba(55, 40, 28, 0.92), rgba(22, 14, 8, 1) 100%);
            clip-path: polygon(24% 0, 76% 0, 95% 100%, 5% 100%);
        }

        .p-portrait-4 {
            background:
                radial-gradient(ellipse 55% 50% at 50% 35%, rgba(188, 160, 132, 0.95), rgba(118, 88, 62, 0.85) 55%, rgba(42, 26, 14, 0.95) 92%),
                linear-gradient(to bottom, #c0a98a 0%, #7c6040 32%, #2e1e10 72%, #0e0804 100%);
        }

        .p-portrait-4::before {
            content: '';
            position: absolute;
            left: 27%;
            right: 27%;
            top: 20%;
            bottom: 32%;
            background: radial-gradient(ellipse 60% 70% at 50% 35%, rgba(205, 172, 142, 0.95), transparent 68%);
            filter: blur(2px);
        }

        .p-portrait-4::after {
            content: '';
            position: absolute;
            left: 14%;
            right: 14%;
            bottom: 0;
            height: 40%;
            background: linear-gradient(to bottom, rgba(160, 128, 90, 0.88), rgba(92, 68, 42, 1) 55%, rgba(38, 26, 14, 1) 100%);
            clip-path: polygon(24% 0, 76% 0, 94% 100%, 6% 100%);
        }

        .member-role {
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
            margin-bottom: 10px;
        }

        .member h3 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 26px;
            line-height: 1.15;
            letter-spacing: -0.015em;
            margin-bottom: 12px;
        }

        .member h3 em {
            font-style: italic;
        }

        .member-bio {
            font-size: 14px;
            color: var(--muted);
            line-height: 1.6;
            margin-bottom: 16px;
            max-width: 32ch;
        }

        .member-meta {
            display: flex;
            flex-direction: column;
            gap: 6px;
            margin-top: 16px;
            padding-top: 16px;
            border-top: 1px solid var(--line);
            font-size: 11px;
            color: var(--muted);
            font-family: var(--editorial);
            font-style: italic;
        }

        .member-meta span strong {
            font-family: var(--body);
            font-style: normal;
            font-weight: 500;
            color: var(--ink);
            letter-spacing: 0.05em;
        }

        /* ============================== JOURNAL ============================== */
        .journal {
            padding: 180px 48px;
            background: var(--ink);
            color: var(--paper);
        }

        .journal-head {
            max-width: 1640px;
            margin: 0 auto 80px auto;
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            gap: 60px;
        }

        .journal-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(52px, 6vw, 96px);
            line-height: 0.95;
            letter-spacing: -0.035em;
            margin-top: 24px;
        }

        .journal-head h2 em {
            font-style: italic;
            color: var(--cognac-light);
        }

        .journal-head .section-label {
            color: var(--cognac-light);
        }

        .journal-head .section-label::before {
            background: var(--cognac-light);
        }

        .journal-head a.btn-outline {
            border-color: var(--paper);
            color: var(--paper);
        }

        .journal-head a.btn-outline:hover {
            background: var(--paper);
            color: var(--ink);
        }

        .journal-grid {
            max-width: 1640px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1.4fr 1fr 1fr;
            gap: 40px;
        }

        .article .article-img-wrap {
            position: relative;
            overflow: hidden;
            aspect-ratio: 4/3;
            margin-bottom: 28px;
            background: var(--ink-2);
            border: 1px solid rgba(245, 241, 232, 0.1);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 32px;
            transition: border-color 0.5s, background 0.5s;
        }

        .article:hover .article-img-wrap {
            border-color: rgba(217, 201, 168, 0.35);
            background: var(--ink-3);
        }

        .article.feature .article-img-wrap {
            aspect-ratio: 5/4;
            padding: 56px;
        }

        /* Subtle texture layer on covers */
        .article .article-img-wrap::before {
            content: '';
            position: absolute;
            inset: 0;
            background:
                radial-gradient(ellipse 80% 60% at 50% 0%, rgba(217, 201, 168, 0.08), transparent 70%),
                radial-gradient(ellipse 70% 50% at 50% 100%, rgba(138, 90, 43, 0.06), transparent 70%);
            pointer-events: none;
        }

        /* Hairline corner brackets (editorial chapter-marker feel) */
        .article .article-img-wrap::after {
            content: '';
            position: absolute;
            inset: 20px;
            border: 1px solid rgba(245, 241, 232, 0.08);
            pointer-events: none;
            transition: border-color 0.5s;
        }

        .article:hover .article-img-wrap::after {
            border-color: rgba(217, 201, 168, 0.2);
        }

        /* Cover content */
        .article-cover {
            position: relative;
            z-index: 2;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
            text-align: center;
            width: 100%;
            height: 100%;
            padding: 12px 0;
        }

        .article-cover-top {
            display: flex;
            align-items: center;
            gap: 12px;
            font-size: 9px;
            letter-spacing: 0.4em;
            text-transform: uppercase;
            color: rgba(217, 201, 168, 0.85);
            font-weight: 500;
        }

        .article-cover-top::before,
        .article-cover-top::after {
            content: '';
            width: 28px;
            height: 1px;
            background: rgba(217, 201, 168, 0.5);
        }

        .article-cover-title {
            font-family: var(--display);
            font-weight: 200;
            font-style: italic;
            font-size: clamp(22px, 2.4vw, 32px);
            line-height: 1.05;
            letter-spacing: -0.02em;
            color: var(--paper);
            max-width: 16ch;
        }

        .article.feature .article-cover-title {
            font-size: clamp(32px, 3.6vw, 52px);
            max-width: 14ch;
        }

        .article-cover-folio {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 6px;
            font-size: 9px;
            letter-spacing: 0.35em;
            text-transform: uppercase;
            color: rgba(245, 241, 232, 0.45);
            font-weight: 500;
        }

        .article-cover-folio .ornament {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 16px;
            text-transform: none;
            letter-spacing: 0;
            color: rgba(217, 201, 168, 0.6);
            margin-bottom: 4px;
        }

        .article-tag {
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            color: var(--cognac-light);
            font-weight: 500;
            display: flex;
            align-items: center;
            gap: 14px;
            margin-bottom: 12px;
        }

        .article-tag::before {
            content: '';
            width: 24px;
            height: 1px;
            background: var(--cognac-light);
        }

        .article h3 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 30px;
            line-height: 1.15;
            letter-spacing: -0.015em;
            margin-bottom: 16px;
            max-width: 26ch;
        }

        .article.feature h3 {
            font-size: 40px;
            max-width: 18ch;
        }

        .article h3 em {
            font-style: italic;
        }

        .article-excerpt {
            font-size: 14px;
            color: rgba(245, 241, 232, 0.65);
            line-height: 1.65;
            max-width: 40ch;
            margin-bottom: 20px;
        }

        .article-meta {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 13px;
            color: rgba(245, 241, 232, 0.5);
            display: flex;
            gap: 16px;
            align-items: center;
        }

        .article-meta .dot {
            opacity: 0.5;
        }

        /* ============================== TRANSACTIONS TICKER ============================== */
        .ticker {
            background: var(--paper);
            color: var(--ink);
            padding: 48px 0 48px 0;
            border-top: 1px solid var(--line);
            border-bottom: 1px solid var(--line);
            overflow: hidden;
            position: relative;
        }

        .ticker-track {
            display: flex;
            gap: 96px;
            animation: ticker-scroll 60s linear infinite;
            white-space: nowrap;
        }

        @keyframes ticker-scroll {
            from {
                transform: translateX(0);
            }

            to {
                transform: translateX(-50%);
            }
        }

        .ticker-item {
            display: inline-flex;
            align-items: baseline;
            gap: 20px;
            font-family: var(--display);
            font-weight: 300;
            font-size: 40px;
            letter-spacing: -0.02em;
        }

        .ticker-item em {
            font-style: italic;
            color: var(--cognac);
        }

        .ticker-item span.small {
            font-family: var(--body);
            font-size: 11px;
            font-weight: 500;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            color: var(--muted);
            align-self: center;
        }

        .ticker-divider {
            align-self: center;
            font-family: var(--editorial);
            font-style: italic;
            font-size: 22px;
            color: var(--muted-2);
        }

        /* ============================== SERVICES ============================== */
        .services {
            padding: 200px 48px;
            background: var(--ink);
            color: var(--paper);
            position: relative;
        }

        .services-head {
            max-width: 1640px;
            margin: 0 auto 100px auto;
            text-align: center;
        }

        .services-head .section-label {
            justify-content: center;
            color: var(--cognac-light);
        }

        .services-head .section-label::before {
            background: var(--cognac-light);
        }

        .services-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(56px, 6.5vw, 112px);
            line-height: 0.92;
            letter-spacing: -0.035em;
            margin-top: 28px;
            max-width: 14ch;
            margin-left: auto;
            margin-right: auto;
        }

        .services-head h2 em {
            font-style: italic;
            color: var(--cognac-light);
        }

        .services-grid {
            max-width: 1640px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 1px;
            background: rgba(245, 241, 232, 0.1);
            border: 1px solid rgba(245, 241, 232, 0.1);
        }

        .service-card {
            background: var(--ink);
            padding: 60px 48px 48px 48px;
            min-height: 520px;
            display: flex;
            flex-direction: column;
            position: relative;
            transition: background 0.5s;
        }

        .service-card:hover {
            background: var(--ink-2);
        }

        .service-num {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 15px;
            opacity: 0.5;
        }

        .service-card h3 {
            font-family: var(--display);
            font-weight: 200;
            font-size: 56px;
            line-height: 1;
            letter-spacing: -0.03em;
            margin: 60px 0 24px 0;
        }

        .service-card h3 em {
            font-style: italic;
            color: var(--cognac-light);
        }

        .service-card p {
            font-size: 15px;
            line-height: 1.7;
            color: rgba(245, 241, 232, 0.72);
            max-width: 34ch;
            margin-bottom: 32px;
        }

        .service-proof {
            list-style: none;
            margin-top: auto;
            padding-top: 32px;
            border-top: 1px solid rgba(245, 241, 232, 0.14);
        }

        .service-proof li {
            font-size: 12px;
            color: rgba(245, 241, 232, 0.78);
            padding: 10px 0;
            display: flex;
            align-items: center;
            gap: 12px;
            font-family: var(--editorial);
            font-style: italic;
        }

        .service-proof li::before {
            content: '';
            width: 4px;
            height: 4px;
            background: var(--cognac-light);
            border-radius: 50%;
            flex-shrink: 0;
        }

        .service-arrow {
            position: absolute;
            top: 60px;
            right: 48px;
            font-size: 22px;
            transition: transform 0.4s;
            color: rgba(245, 241, 232, 0.5);
        }

        .service-card:hover .service-arrow {
            transform: translate(4px, -4px);
            color: var(--cognac-light);
        }

        /* ============================== CONTACT ============================== */
        .contact {
            padding: 200px 48px;
            background: var(--paper);
        }

        .contact-inner {
            max-width: 1640px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 100px;
            align-items: start;
        }

        .contact-lead {
            position: sticky;
            top: 120px;
        }

        .contact-headline {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(56px, 6.5vw, 108px);
            line-height: 0.94;
            letter-spacing: -0.035em;
            margin-top: 28px;
        }

        .contact-headline em {
            font-style: italic;
            color: var(--cognac);
        }

        .contact-body {
            margin-top: 36px;
            font-size: 17px;
            line-height: 1.65;
            color: var(--muted);
            max-width: 48ch;
        }

        .contact-sig {
            margin-top: 48px;
            font-family: var(--editorial);
            font-style: italic;
            font-size: 17px;
            color: var(--ink);
            display: flex;
            align-items: center;
            gap: 20px;
        }

        .contact-sig::before {
            content: '';
            width: 50px;
            height: 1px;
            background: var(--ink);
        }

        .contact-card {
            background: var(--paper-2);
            padding: 56px 48px;
            border: 1px solid var(--line);
            position: relative;
        }

        .contact-card-label {
            font-size: 10px;
            letter-spacing: 0.35em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
            margin-bottom: 32px;
            display: flex;
            align-items: center;
            gap: 14px;
        }

        .contact-card-label::before {
            content: '';
            width: 30px;
            height: 1px;
            background: var(--cognac);
        }

        .contact-form-row {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 24px;
            padding: 24px 0;
            border-bottom: 1px solid var(--line);
        }

        .contact-form-row.full {
            grid-template-columns: 1fr;
        }

        .field-label {
            font-size: 10px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--muted);
            font-weight: 500;
            margin-bottom: 10px;
        }

        .field-value {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 17px;
            color: var(--ink);
            line-height: 1.4;
        }

        .field-value a {
            border-bottom: 1px solid transparent;
            transition: border-color 0.3s;
        }

        .field-value a:hover {
            border-color: var(--ink);
        }

        .contact-info-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 32px 40px;
            padding: 40px 0;
            border-top: 1px solid var(--line);
            border-bottom: 1px solid var(--line);
            margin-top: 40px;
        }

        .contact-info-item h4 {
            font-size: 10px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--muted);
            font-weight: 500;
            margin-bottom: 10px;
        }

        .contact-info-item p {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 16px;
            color: var(--ink);
            line-height: 1.4;
        }

        .contact-buttons {
            display: flex;
            gap: 14px;
            margin-top: 40px;
        }


/* ============================== BUTTONS ============================== */
/* Default (light backgrounds – contact forms, property panels) */
.btn-primary,
.btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 18px 36px;
    border-radius: 100px;
    font-size: 11px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 500;
    transition: background 0.3s, color 0.3s, border-color 0.3s;
    cursor: pointer;
    text-align: center;
}

.btn-primary {
    background: var(--ink);
    color: var(--paper);
    border: 1px solid var(--ink);
}

.btn-primary:hover {
    background: var(--cognac-deep);
    border-color: var(--cognac-deep);
}

.btn-secondary {
    background: transparent;
    color: var(--ink);
    border: 1px solid var(--ink);
}

.btn-secondary:hover {
    background: var(--ink);
    color: var(--paper);
}

/* Dark-background variant (CTA blocks with --ink background) */
.cta-block .btn-primary,
.cta-block .btn-secondary {
    padding: 18px 36px;
}

.cta-block .btn-primary {
    background: var(--paper);
    color: var(--ink);
    border-color: var(--paper);
}

.cta-block .btn-primary:hover {
    background: var(--cognac-light);
    border-color: var(--cognac-light);
}

.cta-block .btn-secondary {
    background: transparent;
    color: var(--paper);
    border-color: var(--paper);
}

.cta-block .btn-secondary:hover {
    background: var(--paper);
    color: var(--ink);
}



        .contact-note {
            margin-top: 28px;
            font-size: 13px;
            color: var(--muted-2);
            font-family: var(--editorial);
            font-style: italic;
            text-align: center;
        }

        /* ============================== FOOTER ============================== */
        footer {
            background: var(--ink);
            color: var(--paper);
            padding: 120px 48px 48px 48px;
            position: relative;
            overflow: hidden;
        }

        .footer-top {
            max-width: 1640px;
            margin: 0 auto 100px auto;
            display: grid;
            grid-template-columns: 2.5fr 1fr 1fr 1fr 1fr;
            gap: 60px;
            padding-bottom: 80px;
            border-bottom: 1px solid rgba(245, 241, 232, 0.14);
            position: relative;
            z-index: 2;
        }

        .footer-brand {
            display: flex;
            flex-direction: column;
            gap: 24px;
        }

        .footer-logo {
            font-family: var(--display);
            font-weight: 200;
            font-size: 56px;
            line-height: 1;
            letter-spacing: -0.02em;
            font-style: italic;
        }

        .footer-logo sup {
            font-style: normal;
            font-size: 0.35em;
            letter-spacing: 0.15em;
            vertical-align: super;
            margin: 0 2px;
            opacity: 0.6;
        }

        .footer-tag {
            font-size: 15px;
            color: rgba(245, 241, 232, 0.7);
            max-width: 420px;
            line-height: 1.7;
            font-weight: 300;
        }

        .footer-accred {
            display: flex;
            flex-direction: column;
            gap: 10px;
            margin-top: 16px;
            font-size: 11px;
            color: rgba(245, 241, 232, 0.5);
            letter-spacing: 0.08em;
            font-family: var(--editorial);
            font-style: italic;
        }

        .footer-col h4 {
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            font-weight: 500;
            margin-bottom: 24px;
            color: rgba(245, 241, 232, 0.55);
        }

        .footer-col ul {
            list-style: none;
        }

        .footer-col li {
            margin-bottom: 14px;
        }

        .footer-col a {
            font-size: 14px;
            color: rgba(245, 241, 232, 0.9);
            transition: color 0.3s;
            font-weight: 300;
        }

        .footer-col a:hover {
            color: var(--cognac-light);
        }

        .footer-bottom {
            max-width: 1640px;
            margin: 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 11px;
            color: rgba(245, 241, 232, 0.45);
            letter-spacing: 0.12em;
            position: relative;
            z-index: 2;
            padding-top: 32px;
        }

        .footer-bottom-left,
        .footer-bottom-right {
            display: flex;
            gap: 32px;
            align-items: center;
        }

        .footer-bottom-right a {
            transition: color 0.3s;
        }

        .footer-bottom-right a:hover {
            color: var(--cognac-light);
        }

        .footer-huge {
            font-family: var(--display);
            font-weight: 200;
            font-style: italic;
            font-size: clamp(140px, 25vw, 420px);
            line-height: 0.8;
            letter-spacing: -0.05em;
            color: rgba(245, 241, 232, 0.04);
            position: absolute;
            left: 0;
            right: 0;
            bottom: -60px;
            text-align: center;
            pointer-events: none;
            user-select: none;
            z-index: 1;
        }

        /* ============================== RESPONSIVE ============================== */
        @media (max-width: 1400px) {
            .nav {
                padding: 20px 32px;
            }

            .nav.scrolled {
                padding: 13px 32px;
            }

            .nav-left,
            .nav-right {
                gap: 24px;
                font-size: 11px;
                letter-spacing: 0.14em;
            }

            .nav-cta {
                padding: 9px 18px;
                font-size: 10.5px;
            }

            .nav-left,
            .nav-right {
                gap: 18px;
                font-size: 10.5px;
                letter-spacing: 0.12em;
            }

        }


        /* ============================================================
   MOBILE NAV SYSTEM — active below 1200px
   Desktop nav (.nav-left, .nav-right links) untouched above 1200px
   ============================================================ */



        /* ── 1. HAMBURGER TOGGLE BUTTON ──────────────────────────── */
        .m-toggle {
            width: 30px;
            height: 30px;
            border-radius: 50%;
            background: transparent;
            cursor: pointer;
            display: none;
            /* shown via breakpoint below */
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            position: relative;
            z-index: 200;
            /* above drawer */
            transition: border-color 0.3s ease, background 0.3s ease, transform 0.15s ease;
            -webkit-tap-highlight-color: transparent;
        }

        .m-toggle:hover {
            border-color: var(--ink);
            background: rgba(10, 10, 8, .04);
        }

        .m-toggle:active {
            transform: scale(0.93);
        }

        /* SVG icon inside button */
        .m-toggle svg {
            width: 18px;
            height: 18px;
            overflow: visible;
        }

        /*
  Bar morphing strategy:
  - bar-top: slides down 5px + rotates 45°  → forms "/"
  - bar-mid: fades + collapses to 0 width   → disappears
  - bar-bot: slides up 5px + rotates -45°   → forms "\"
  Result: clean X with no extra elements
*/
        .bar-top,
        .bar-mid,
        .bar-bot {
            transform-origin: center;
            transition:
                transform 0.42s cubic-bezier(0.77, 0, 0.18, 1),
                opacity 0.30s ease;
        }

        /* Open state triggers from .m-toggle.open via JS */
        .m-toggle.open .bar-top {
            transform: translateY(2px) rotate(45deg);
        }

        .m-toggle.open .bar-mid {
            transform: scaleX(0);
            opacity: 0;
        }

        .m-toggle.open .bar-bot {
            transform: translateY(-4px) rotate(-45deg);
        }


        /* ── 2. BACKDROP OVERLAY ─────────────────────────────────── */
        .m-backdrop {
            position: fixed;
            inset: 0;
            z-index: 130;
            background: rgba(10, 10, 8, 0.55);

            /* Frosted glass blur on the page content behind drawer */
            -webkit-backdrop-filter: blur(4px);
            backdrop-filter: blur(4px);

            opacity: 0;
            pointer-events: none;
            /* Use opacity only — no layout changes = GPU composited */
            transition: opacity 0.45s cubic-bezier(0.4, 0, 0.2, 1);
            will-change: opacity;
        }

        .m-backdrop.open {
            opacity: 1;
            pointer-events: all;
        }


        /* ── 3. FULLSCREEN DRAWER ────────────────────────────────── */
        .m-drawer {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            /* Full height but slightly shorter on landscape */
            height: 100dvh;
            /* dvh = dynamic viewport height (handles mobile chrome bar) */

            z-index: 140;
            display: flex;
            flex-direction: column;

            /* Dark elegant background */
            background: var(--ink);
            color: var(--paper);

            padding: 80px 32px 40px 32px;

            /*
    Slide from top — feels more premium than slide-from-right on mobile.
    translateY(-100%) → translateY(0)
    Using transform only = GPU composited, zero layout cost.
  */
            transform: translateY(-100%);
            transition: transform 0.52s cubic-bezier(0.77, 0, 0.18, 1);
            will-change: transform;

            /* Prevents drawer content from being announced by screen readers when closed */
            visibility: hidden;
            transition:
                transform 0.52s cubic-bezier(0.77, 0, 0.18, 1),
                visibility 0s linear 0.52s;
            /* delay visibility change until after close animation */
        }

        .m-drawer.open {
            transform: translateY(0);
            visibility: visible;
            transition:
                transform 0.52s cubic-bezier(0.77, 0, 0.18, 1),
                visibility 0s linear 0s;
            /* immediately visible on open */
        }

        /* Decorative top-edge accent shimmer */
        .m-drawer::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 1px;
            background: linear-gradient(90deg,
                    transparent 0%,
                    rgba(201, 160, 120, 0.45) 35%,
                    rgba(201, 160, 120, 0.45) 65%,
                    transparent 100%);
        }


        /* ── 4. DRAWER HEADER ────────────────────────────────────── */
        .drawer-header {
            padding-bottom: 24px;
            border-bottom: 1px solid rgba(245, 241, 232, 0.1);
            margin-bottom: 4px;
        }

        .drawer-eyebrow {
            font-size: 10px;
            letter-spacing: 0.32em;
            text-transform: uppercase;
            color: var(--cognac-light);
            font-weight: 500;
            display: flex;
            align-items: center;
            gap: 12px;
            margin-bottom: 12px;

            /* Fades in after drawer lands — subtle layered arrival */
            opacity: 0;
            transition: opacity 0.35s ease;
        }

        .drawer-eyebrow::before {
            content: '';
            width: 28px;
            height: 1px;
            background: var(--cognac-light);
            flex-shrink: 0;
        }

        .m-drawer.open .drawer-eyebrow {
            opacity: 1;
            transition-delay: 0.35s;
        }

        .drawer-tagline {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 18px;
            line-height: 1.35;
            color: rgba(245, 241, 232, 0.45);
            letter-spacing: -0.01em;

            opacity: 0;
            transform: translateY(10px);
            transition: opacity 0.4s ease, transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .m-drawer.open .drawer-tagline {
            opacity: 1;
            transform: translateY(0);
            transition-delay: 0.40s;
        }


        /* ── 5. NAV LINKS WITH STAGGER ───────────────────────────── */
        .drawer-nav {
            flex: 1;
            display: flex;
            flex-direction: column;
            justify-content: center;
            gap: 0;
            padding: 4px 0;
        }

        .drawer-link {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 15px 0;
            border-bottom: 1px solid rgba(245, 241, 232, 0.07);
            font-family: var(--editorial);
            font-style: italic;
            font-weight: 300;
            font-size: 24px;
            letter-spacing: -0.02em;
            line-height: 1;
            color: var(--paper);
            text-decoration: none;
            cursor: pointer;
            -webkit-tap-highlight-color: transparent;

            /*
    Initial state: invisible + pushed down 20px.
    JS assigns individual transition-delay per item for stagger effect.
    Exit: delays removed → all collapse simultaneously (feels snappier).
  */
            opacity: 0;
            transform: translateY(20px);
            transition:
                opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                color 0.25s ease;
        }

        .m-drawer.open .drawer-link {
            opacity: 1;
            transform: translateY(0);
        }

        /* Hover / tap state */
        .drawer-link:hover {
            color: var(--cognac-light);
        }

        .drawer-link:active {
            opacity: 0.7;
        }

        /* Arrow indicator */
        .drawer-link .link-num {
            font-family: var(--body);
            font-style: normal;
            font-size: 11px;
            letter-spacing: 0.1em;
            color: rgba(245, 241, 232, 0.22);
            font-weight: 500;
            flex-shrink: 0;
            transition: color 0.25s, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .drawer-link:hover .link-num {
            color: var(--cognac-light);
            transform: translateX(4px);
        }


        /* ── 6. DRAWER FOOTER ────────────────────────────────────── */
        .drawer-footer {
            padding-top: 24px;
            border-top: 1px solid rgba(245, 241, 232, 0.1);
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
            flex-wrap: wrap;

            opacity: 0;
            transition: opacity 0.4s ease;
        }

        .m-drawer.open .drawer-footer {
            opacity: 1;
            transition-delay: 0.6s;
        }

        /* CTA pill */
        .drawer-cta {
            padding: 13px 24px;
            border: 1px solid rgba(245, 241, 232, 0.28);
            border-radius: 100px;
            font-family: var(--body);
            font-size: 10px;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            font-weight: 500;
            color: var(--paper);
            text-decoration: none;
            cursor: pointer;
            background: transparent;
            transition: background 0.3s ease, border-color 0.3s ease;
            -webkit-tap-highlight-color: transparent;
        }

        .drawer-cta:hover {
            background: rgba(245, 241, 232, 0.08);
            border-color: rgba(245, 241, 232, 0.5);
        }

        .drawer-cta:active {
            opacity: 0.75;
        }

        /* Language pill */
        .drawer-lang {
            display: flex;
            align-items: center;
            gap: 8px;
            font-size: 11px;
            letter-spacing: 0.22em;
            color: rgba(245, 241, 232, 0.45);
            font-weight: 500;
            cursor: pointer;
            -webkit-tap-highlight-color: transparent;
            transition: color 0.25s;
        }

        .drawer-lang:hover {
            color: rgba(245, 241, 232, 0.75);
        }

        .drawer-lang .ldot {
            width: 5px;
            height: 5px;
            border-radius: 50%;
            background: var(--cognac-light);
            flex-shrink: 0;
        }


        /* ── 7. SCROLL LOCK ──────────────────────────────────────── */
        /*
  Applied to <body> via JS when menu opens.
  Uses padding-right to compensate for scrollbar width
  so the page doesn't jump when overflow is hidden.
*/
        body.nav-open {
            overflow: hidden;
            /* compensate for scrollbar width — set via JS */
        }



        /* ── 8. BREAKPOINT — show toggle below 1200px ────────────── */
        @media (max-width: 1200px) {

            /* Show the toggle button */
            .m-toggle {
                display: flex;
            }

            /* Hide existing desktop-only nav items */
            .nav-left {
                display: none !important;
            }

            .nav-right>a {
                display: none !important;
            }

            .nav-right .nav-cta {
                display: none !important;
            }

            .lang-switch {
                display: none !important;
            }

            /* Clean up old mobile menu if still present */
            .mobile-menu,
            .mobile-toggle {
                display: none !important;
            }
        }

        /* Fine-tune padding on smaller phones */
        @media (max-width: 480px) {
            .m-drawer {
                padding: 72px 24px 32px 24px;
            }

            .drawer-link {
                font-size: 21px;
                padding: 13px 0;
            }
        }

        /* Landscape phones — reduce vertical spacing */
        @media (max-height: 500px) and (orientation: landscape) {
            .m-drawer {
                padding: 68px 32px 20px 32px;
                overflow-y: scroll;
            }

            .drawer-nav {
                justify-content: flex-start;
                gap: 0;
                padding-top: 8px;
            }

            .drawer-link {
                font-size: 18px;
                padding: 9px 0;
            }

            .drawer-header {
                padding-bottom: 12px;
                margin-bottom: 0;
            }
        }

        /* end mobile menu */

        @media (max-width: 1200px) {

            .nav-left,
            .nav-right {
                gap: 18px;
                font-size: 10.5px;
                letter-spacing: 0.12em;
            }

            .nav-logo {
                font-size: 22px;
            }

            .lang-switch {
                padding: 7px 10px;
                font-size: 10px;
            }

            .nav-cta {
                padding: 8px 14px;
                font-size: 10px;
                letter-spacing: 0.14em;
            }

        }

        @media (max-width: 1024px) {

            /* Tablet: drop Neighbourhoods (longest word) + Journal, keep Properties + Team */
            .nav {
                padding: 16px 24px;
            }

            .nav.scrolled {
                padding: 12px 24px;
            }

        }

        @media (max-width: 1280px) {
            .property-grid {
                grid-template-columns: repeat(4, 1fr);
            }

            .property.wide {
                grid-column: span 2;
            }

            .property.narrow {
                grid-column: span 2;
            }

            .property.full {
                grid-column: span 4;
            }

            .nbh-grid {
                grid-template-columns: repeat(2, 1fr);
            }

            .stats-band-grid {
                grid-template-columns: repeat(2, 1fr);
            }

            .stat-cell {
                border-right: none;
                padding-right: 0;
                padding-left: 0 !important;
                padding-top: 48px;
                padding-bottom: 48px;
                border-bottom: 1px solid rgba(245, 241, 232, 0.14);
            }

            .team-grid {
                grid-template-columns: repeat(2, 1fr);
                gap: 48px;
            }

            .footer-top {
                grid-template-columns: 2fr 1fr 1fr;
                gap: 48px;
            }
        }

        @media (max-width: 900px) {

            .nav {
                padding: 16px 20px;
                display: flex;
                justify-content: space-between;
                align-items: center;
            }

            .nav.scrolled {
                padding: 12px 20px;
            }

            .nav-left {
                display: none;
            }

            .nav-right {
                display: flex;
                gap: 8px;
                align-items: center;
            }

            .nav-right a {
                display: none;
            }

            .nav-right .lang-switch {
                display: none;
            }

            .nav-logo {
                font-size: 20px;
            }

            .menu-toggle {
                display: flex;
                flex-direction: column;
                gap: 5px;
                padding: 8px;
            }

            .menu-toggle span {
                width: 22px;
                height: 1.5px;
                background: currentColor;
                display: block;
            }

            /* Hero: stack everything vertically, no absolute positioning overlaps */
            .hero {
                height: auto;
                min-height: auto;
                display: flex;
                flex-direction: column;
            }

            .hero-top {
                display: none;
            }

            .hero-mobile-top {
                display: block;
                position: relative;
                z-index: 10;
                padding: 100px 20px 0 20px;
            }

            .hero-mobile-top .hero-eyebrow {
                font-size: 10px;
                letter-spacing: 0.25em;
                color: rgba(245, 241, 232, 0.85);
            }

            .hero-mobile-top .hero-eyebrow::before {
                width: 28px;
            }

            .hero-mobile-top .hero-location {
                font-size: 12px;
                color: rgba(245, 241, 232, 0.7);
                margin-top: 10px;
                font-family: var(--editorial);
                font-style: italic;
            }

            .hero-eyebrow {
                font-size: 10px;
                letter-spacing: 0.25em;
            }

            .hero-eyebrow::before {
                width: 28px;
            }

            .hero-location {
                font-size: 12px;
            }

            .hero-content {
                position: relative;
                z-index: 10;
                height: auto;
                padding: 100px 20px 60px 20px;
                justify-content: flex-start;
            }

            .hero-headline {
                font-size: clamp(44px, 13vw, 72px);
                line-height: 0.96;
            }

            .hero-lede {
                font-size: 15px;
                max-width: 100%;
            }

            .hero-bottom {
                flex-direction: column;
                align-items: stretch;
                gap: 24px;
                margin-top: 36px;
            }

            .hero-actions {
                flex-direction: column;
                align-items: stretch;
                gap: 14px;
            }

            .hero-cta {
                justify-content: center;
                padding: 18px 28px;
            }

            .hero-cta-text {
                justify-content: center;
            }

            .hero-cta-text::before {
                display: none;
            }

            .hero-corner-br {
                bottom: 20px;
                right: 20px;
                font-size: 11px;
            }

            .hero-scroll {
                display: none;
            }

            /* Much smaller, positioned tree that doesn't crowd text */
            .hero-palm {
                width: 170px;
                height: 200px;
                right: -10%;
                top: auto;
                bottom: 18%;
                opacity: 0.55;
            }

            /* Press */
            .press {
                padding: 32px 20px;
            }

            .press-inner {
                grid-template-columns: 1fr;
                gap: 20px;
            }

            .press-item {
                font-size: 18px;
                gap: 48px;
            }

            .press-track {
                gap: 48px;
            }

            /* Sections */
            .intro {
                padding: 80px 20px 60px 20px;
            }

            .intro-inner {
                grid-template-columns: 1fr;
                gap: 32px;
            }

            .intro-headline {
                font-size: clamp(32px, 8vw, 48px);
            }

            .intro-body {
                grid-template-columns: 1fr;
                gap: 16px;
                font-size: 15px;
            }

            .intro-signature {
                font-size: 16px;
                margin-top: 40px;
            }

            .marque-type {
                padding: 48px 20px 32px 20px;
            }

            .marque-type .word {
                font-size: clamp(72px, 22vw, 120px);
            }

            .marque-type .sub {
                font-size: 15px;
            }

            .stats-band {
                padding: 80px 20px;
            }

            .stats-band-head {
                flex-direction: column;
                gap: 24px;
                align-items: flex-start;
            }

            .stats-band-head h2 {
                font-size: clamp(32px, 8vw, 44px);
            }

            .stats-band-head .meta {
                text-align: left;
            }

            .stat-cell {
                padding: 40px 0;
            }

            .stat-num {
                font-size: clamp(48px, 14vw, 68px);
            }

            .properties-section {
                padding: 80px 20px 60px 20px;
            }

            .properties-head {
                grid-template-columns: 1fr;
                gap: 24px;
                align-items: start;
            }

            .properties-head h2 {
                font-size: clamp(40px, 11vw, 56px);
            }

            .properties-filters {
                justify-content: flex-start;
                gap: 6px;
            }

            .filter-chip {
                padding: 8px 14px;
                font-size: 10px;
            }

            .property-grid {
                grid-template-columns: 1fr;
                gap: 40px 0;
            }

            .property.wide,
            .property.narrow,
            .property.full {
                grid-column: span 1;
            }

            .property.full .property-img-wrap {
                aspect-ratio: 4/3;
            }

            .property h3 {
                font-size: 26px;
            }

            .property-price-overlay {
                font-size: 22px;
            }

            .properties-footer {
                flex-direction: column;
                gap: 28px;
                align-items: flex-start;
                padding-top: 40px;
            }

            .neighborhoods {
                padding: 80px 20px;
            }

            .nbh-head {
                grid-template-columns: 1fr;
                gap: 24px;
            }

            .nbh-head h2 {
                font-size: clamp(36px, 9vw, 52px);
            }

            .nbh-head p {
                font-size: 17px;
            }

            .nbh-grid {
                grid-template-columns: 1fr;
            }

            .nbh-cell {
                min-height: 200px;
                padding: 36px 24px 32px 24px;
            }

            .nbh-cell h3 {
                font-size: 28px;
                margin: 36px 0 10px 0;
            }

            .nbh-cell-arr {
                top: 36px;
                right: 24px;
            }

            .team {
                padding: 80px 20px;
            }

            .team-head {
                grid-template-columns: 1fr;
                gap: 24px;
            }

            .team-head h2 {
                font-size: clamp(40px, 11vw, 56px);
            }

            .team-grid {
                grid-template-columns: 1fr;
                gap: 48px;
            }

            .team-grid.team-solo {
                grid-template-columns: 1fr;
                gap: 40px;
            }

            .team-solo .member {
                grid-template-columns: 1fr;
                gap: 32px;
            }

            .team-solo .member h3 {
                font-size: 36px;
                margin-bottom: 16px;
            }

            .team-solo .member-bio {
                font-size: 15px;
                margin-bottom: 20px;
            }

            .member h3 {
                font-size: 24px;
            }

            .journal {
                padding: 80px 20px;
            }

            .journal-head {
                flex-direction: column;
                gap: 24px;
                align-items: flex-start;
            }

            .journal-head h2 {
                font-size: clamp(40px, 11vw, 56px);
            }

            .journal-grid {
                grid-template-columns: 1fr;
                gap: 40px;
            }

            .article h3 {
                font-size: 24px;
            }

            .article.feature h3 {
                font-size: 28px;
            }

            .ticker {
                padding: 36px 0;
            }

            .ticker-item {
                font-size: 26px;
                gap: 12px;
            }

            .ticker-track {
                gap: 60px;
            }

            .services {
                padding: 80px 20px;
            }

            .services-head h2 {
                font-size: clamp(40px, 11vw, 64px);
            }

            .services-grid {
                grid-template-columns: 1fr;
            }

            .service-card {
                padding: 44px 28px 36px 28px;
                min-height: auto;
            }

            .service-card h3 {
                font-size: 44px;
                margin: 40px 0 16px 0;
            }

            .service-arrow {
                top: 44px;
                right: 28px;
            }

            .contact {
                padding: 80px 20px;
            }

            .contact-inner {
                grid-template-columns: 1fr;
                gap: 40px;
            }

            .contact-lead {
                position: static;
            }

            .contact-headline {
                font-size: clamp(40px, 11vw, 64px);
            }

            .contact-body {
                font-size: 15px;
            }

            .contact-card {
                padding: 36px 24px;
            }

            .contact-form-row {
                grid-template-columns: 1fr;
                gap: 16px;
                padding: 18px 0;
            }

            .contact-info-grid {
                grid-template-columns: 1fr 1fr;
                gap: 24px 20px;
                padding: 32px 0;
            }

            .contact-info-item p {
                font-size: 14px;
            }

            .contact-buttons {
                flex-direction: column;
            }

            footer {
                padding: 64px 20px 32px;
            }

            .footer-top {
                grid-template-columns: 1fr 1fr;
                gap: 32px 20px;
                padding-bottom: 40px;
                margin-bottom: 40px;
            }

            .footer-brand {
                grid-column: span 2;
            }

            .footer-logo {
                font-size: 44px;
            }

            .footer-tag {
                font-size: 14px;
            }

            .footer-bottom {
                flex-direction: column;
                gap: 12px;
                text-align: center;
                padding-top: 20px;
            }

            .footer-bottom-left,
            .footer-bottom-right {
                flex-direction: column;
                gap: 8px;
            }

            .footer-huge {
                font-size: clamp(90px, 35vw, 160px);
                bottom: -30px;
            }
        }

        @media (max-width: 480px) {
            .contact-info-grid {
                grid-template-columns: 1fr;
            }
        }
    

/* ========================================= */


        /* NAV */
        .nav {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            z-index: 9999;
            padding: 22px 48px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            transition: background 0.5s, padding 0.5s, color 0.5s;
            background: rgba(245, 241, 232, 0.94);
            backdrop-filter: blur(20px);
            border-bottom: 1px solid var(--line);
            color: var(--ink);
        }


        /* ============================================================
   MOBILE NAV SYSTEM — active below 1200px
   Desktop nav (.nav-left, .nav-right links) untouched above 1200px
   ============================================================ */



        /* ── 1. HAMBURGER TOGGLE BUTTON ──────────────────────────── */
        .m-toggle {
            width: 30px;
            height: 30px;
            border-radius: 50%;
            background: transparent;
            cursor: pointer;
            display: none;
            /* shown via breakpoint below */
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            position: relative;
            z-index: 200;
            /* above drawer */
            transition: border-color 0.3s ease, background 0.3s ease, transform 0.15s ease;
            -webkit-tap-highlight-color: transparent;
        }

        .m-toggle:hover {
            border-color: var(--ink);
            background: rgba(10, 10, 8, .04);
        }

        .m-toggle:active {
            transform: scale(0.93);
        }

        /* SVG icon inside button */
        .m-toggle svg {
            width: 18px;
            height: 18px;
            overflow: visible;
        }

        /*
  Bar morphing strategy:
  - bar-top: slides down 5px + rotates 45°  → forms "/"
  - bar-mid: fades + collapses to 0 width   → disappears
  - bar-bot: slides up 5px + rotates -45°   → forms "\"
  Result: clean X with no extra elements
*/
        .bar-top,
        .bar-mid,
        .bar-bot {
            transform-origin: center;
            transition:
                transform 0.42s cubic-bezier(0.77, 0, 0.18, 1),
                opacity 0.30s ease;
        }

        /* Open state triggers from .m-toggle.open via JS */
        .m-toggle.open .bar-top {
            transform: translateY(2px) rotate(45deg);
        }

        .m-toggle.open .bar-mid {
            transform: scaleX(0);
            opacity: 0;
        }

        .m-toggle.open .bar-bot {
            transform: translateY(-4px) rotate(-45deg);
        }


        /* ── 2. BACKDROP OVERLAY ─────────────────────────────────── */
        .m-backdrop {
            position: fixed;
            inset: 0;
            z-index: 130;
            background: rgba(10, 10, 8, 0.55);

            /* Frosted glass blur on the page content behind drawer */
            -webkit-backdrop-filter: blur(4px);
            backdrop-filter: blur(4px);

            opacity: 0;
            pointer-events: none;
            /* Use opacity only — no layout changes = GPU composited */
            transition: opacity 0.45s cubic-bezier(0.4, 0, 0.2, 1);
            will-change: opacity;
        }

        .m-backdrop.open {
            opacity: 1;
            pointer-events: all;
        }


        /* ── 3. FULLSCREEN DRAWER ────────────────────────────────── */
        .m-drawer {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            /* Full height but slightly shorter on landscape */
            height: 100dvh;
            /* dvh = dynamic viewport height (handles mobile chrome bar) */

            z-index: 140;
            display: flex;
            flex-direction: column;

            /* Dark elegant background */
            background: var(--ink);
            color: var(--paper);

            padding: 80px 32px 40px 32px;

            /*
    Slide from top — feels more premium than slide-from-right on mobile.
    translateY(-100%) → translateY(0)
    Using transform only = GPU composited, zero layout cost.
  */
            transform: translateY(-100%);
            transition: transform 0.52s cubic-bezier(0.77, 0, 0.18, 1);
            will-change: transform;

            /* Prevents drawer content from being announced by screen readers when closed */
            visibility: hidden;
            transition:
                transform 0.52s cubic-bezier(0.77, 0, 0.18, 1),
                visibility 0s linear 0.52s;
            /* delay visibility change until after close animation */
        }

        .m-drawer.open {
            transform: translateY(0);
            visibility: visible;
            transition:
                transform 0.52s cubic-bezier(0.77, 0, 0.18, 1),
                visibility 0s linear 0s;
            /* immediately visible on open */
        }

        /* Decorative top-edge accent shimmer */
        .m-drawer::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 1px;
            background: linear-gradient(90deg,
                    transparent 0%,
                    rgba(201, 160, 120, 0.45) 35%,
                    rgba(201, 160, 120, 0.45) 65%,
                    transparent 100%);
        }


        /* ── 4. DRAWER HEADER ────────────────────────────────────── */
        .drawer-header {
            padding-bottom: 24px;
            border-bottom: 1px solid rgba(245, 241, 232, 0.1);
            margin-bottom: 4px;
        }

        .drawer-eyebrow {
            font-size: 10px;
            letter-spacing: 0.32em;
            text-transform: uppercase;
            color: var(--cognac-light);
            font-weight: 500;
            display: flex;
            align-items: center;
            gap: 12px;
            margin-bottom: 12px;

            /* Fades in after drawer lands — subtle layered arrival */
            opacity: 0;
            transition: opacity 0.35s ease;
        }

        .drawer-eyebrow::before {
            content: '';
            width: 28px;
            height: 1px;
            background: var(--cognac-light);
            flex-shrink: 0;
        }

        .m-drawer.open .drawer-eyebrow {
            opacity: 1;
            transition-delay: 0.35s;
        }

        .drawer-tagline {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 18px;
            line-height: 1.35;
            color: rgba(245, 241, 232, 0.45);
            letter-spacing: -0.01em;

            opacity: 0;
            transform: translateY(10px);
            transition: opacity 0.4s ease, transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .m-drawer.open .drawer-tagline {
            opacity: 1;
            transform: translateY(0);
            transition-delay: 0.40s;
        }


        /* ── 5. NAV LINKS WITH STAGGER ───────────────────────────── */
        .drawer-nav {
            flex: 1;
            display: flex;
            flex-direction: column;
            justify-content: center;
            gap: 0;
            padding: 4px 0;
        }

        .drawer-link {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 15px 0;
            border-bottom: 1px solid rgba(245, 241, 232, 0.07);
            font-family: var(--editorial);
            font-style: italic;
            font-weight: 300;
            font-size: 24px;
            letter-spacing: -0.02em;
            line-height: 1;
            color: var(--paper);
            text-decoration: none;
            cursor: pointer;
            -webkit-tap-highlight-color: transparent;

            /*
    Initial state: invisible + pushed down 20px.
    JS assigns individual transition-delay per item for stagger effect.
    Exit: delays removed → all collapse simultaneously (feels snappier).
  */
            opacity: 0;
            transform: translateY(20px);
            transition:
                opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                color 0.25s ease;
        }

        .m-drawer.open .drawer-link {
            opacity: 1;
            transform: translateY(0);
        }

        /* Hover / tap state */
        .drawer-link:hover {
            color: var(--cognac-light);
        }

        .drawer-link:active {
            opacity: 0.7;
        }

        /* Arrow indicator */
        .drawer-link .link-num {
            font-family: var(--body);
            font-style: normal;
            font-size: 11px;
            letter-spacing: 0.1em;
            color: rgba(245, 241, 232, 0.22);
            font-weight: 500;
            flex-shrink: 0;
            transition: color 0.25s, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .drawer-link:hover .link-num {
            color: var(--cognac-light);
            transform: translateX(4px);
        }


        /* ── 6. DRAWER FOOTER ────────────────────────────────────── */
        .drawer-footer {
            padding-top: 24px;
            border-top: 1px solid rgba(245, 241, 232, 0.1);
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
            flex-wrap: wrap;

            opacity: 0;
            transition: opacity 0.4s ease;
        }

        .m-drawer.open .drawer-footer {
            opacity: 1;
            transition-delay: 0.6s;
        }

        /* CTA pill */
        .drawer-cta {
            padding: 13px 24px;
            border: 1px solid rgba(245, 241, 232, 0.28);
            border-radius: 100px;
            font-family: var(--body);
            font-size: 10px;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            font-weight: 500;
            color: var(--paper);
            text-decoration: none;
            cursor: pointer;
            background: transparent;
            transition: background 0.3s ease, border-color 0.3s ease;
            -webkit-tap-highlight-color: transparent;
        }

        .drawer-cta:hover {
            background: rgba(245, 241, 232, 0.08);
            border-color: rgba(245, 241, 232, 0.5);
        }

        .drawer-cta:active {
            opacity: 0.75;
        }

        /* Language pill */
        .drawer-lang {
            display: flex;
            align-items: center;
            gap: 8px;
            font-size: 11px;
            letter-spacing: 0.22em;
            color: rgba(245, 241, 232, 0.45);
            font-weight: 500;
            cursor: pointer;
            -webkit-tap-highlight-color: transparent;
            transition: color 0.25s;
        }

        .drawer-lang:hover {
            color: rgba(245, 241, 232, 0.75);
        }

        .drawer-lang .ldot {
            width: 5px;
            height: 5px;
            border-radius: 50%;
            background: var(--cognac-light);
            flex-shrink: 0;
        }


        /* ── 7. SCROLL LOCK ──────────────────────────────────────── */
        /*
  Applied to <body> via JS when menu opens.
  Uses padding-right to compensate for scrollbar width
  so the page doesn't jump when overflow is hidden.
*/
        body.nav-open {
            overflow: hidden;
            /* compensate for scrollbar width — set via JS */
        }



        /* ── 8. BREAKPOINT — show toggle below 1200px ────────────── */
        @media (max-width: 1200px) {

            /* Show the toggle button */
            .m-toggle {
                display: flex;
            }

            /* Hide existing desktop-only nav items */
            .nav-left {
                display: none !important;
            }

            .nav-right>a {
                display: none !important;
            }

            .nav-right .nav-cta {
                display: none !important;
            }

            .lang-switch {
                display: none !important;
            }

            /* Clean up old mobile menu if still present */
            .mobile-menu,
            .mobile-toggle {
                display: none !important;
            }
        }

        /* Fine-tune padding on smaller phones */
        @media (max-width: 480px) {
            .m-drawer {
                padding: 72px 24px 32px 24px;
            }

            .drawer-link {
                font-size: 21px;
                padding: 13px 0;
            }
        }

        /* Landscape phones — reduce vertical spacing */
        @media (max-height: 500px) and (orientation: landscape) {
            .m-drawer {
                padding: 68px 32px 20px 32px;
                overflow-y: scroll;
            }

            .drawer-nav {
                justify-content: flex-start;
                gap: 0;
                padding-top: 8px;
            }

            .drawer-link {
                font-size: 18px;
                padding: 9px 0;
            }

            .drawer-header {
                padding-bottom: 12px;
                margin-bottom: 0;
            }
        }

        /* end mobile menu */
    

/* ========================================= */


            /* About contact */
            .about-contact {
                padding: 120px 32px;
                background: var(--ink);
                color: var(--paper);
            }

            .about-contact-inner {
                max-width: 1000px;
                margin: 0 auto;
                text-align: center;
            }

            .about-contact h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(48px, 6vw, 96px);
                line-height: 0.95;
                letter-spacing: -0.035em;
                max-width: 16ch;
                margin: 20px auto 32px auto;
            }

            .about-contact h2 em {
                font-style: italic;
                color: var(--cognac-light);
            }

            .about-contact .section-label {
                color: var(--cognac-light);
                justify-content: center;
            }

            .about-contact .section-label::before {
                background: var(--cognac-light);
            }

            .about-contact p {
                font-size: 18px;
                line-height: 1.6;
                color: rgba(245, 241, 232, 0.75);
                max-width: 52ch;
                margin: 0 auto 48px auto;
            }

            /* =========== PROPERTY DETAIL =========== */
            .prop-gallery {
                padding: 100px 32px 0 32px;
                max-width: 1800px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: 1.8fr 1fr 1fr;
                grid-template-rows: 320px 320px;
                gap: 8px;
            }

            .prop-gallery .img-cell {
                position: relative;
                overflow: hidden;
                cursor: pointer;
                transition: opacity 0.3s;
            }

            .prop-gallery .img-cell:hover {
                opacity: 0.92;
            }

            .prop-gallery .main {
                grid-column: 1 / 2;
                grid-row: 1 / 3;
            }

            .prop-gallery .cell-2 {
                grid-column: 2;
                grid-row: 1;
            }

            .prop-gallery .cell-3 {
                grid-column: 3;
                grid-row: 1;
            }

            .prop-gallery .cell-4 {
                grid-column: 2;
                grid-row: 2;
            }

            .prop-gallery .cell-5 {
                grid-column: 3;
                grid-row: 2;
            }

            .more-overlay {
                position: absolute;
                inset: 0;
                background: rgba(10, 10, 8, 0.55);
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                color: var(--paper);
                font-size: 11px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                font-weight: 500;
                z-index: 2;
            }

            .more-overlay .num {
                font-family: var(--display);
                font-style: italic;
                font-weight: 300;
                font-size: 48px;
                line-height: 1;
                text-transform: none;
                letter-spacing: -0.02em;
                margin-bottom: 12px;
            }

            /* Gradient-mesh imagery for gallery */
            .g-img-1 {
                background:
                    radial-gradient(ellipse 70% 50% at 60% 30%, rgba(255, 230, 190, 0.55), transparent 65%),
                    radial-gradient(ellipse 120% 70% at 50% 25%, rgba(220, 150, 100, 0.45), transparent 70%),
                    linear-gradient(to bottom, #1e2838 0%, #3c3248 14%, #6a4432 28%, #a46038 42%, #c47240 52%, #a05028 66%, #3a1e10 82%, #080402 100%);
            }

            .g-img-1::before {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                top: 44%;
                height: 12%;
                background: linear-gradient(to bottom, rgba(55, 38, 42, 0.55), rgba(20, 14, 16, 0.85));
                clip-path: polygon(0 78%, 12% 50%, 25% 65%, 40% 40%, 55% 58%, 72% 38%, 88% 55%, 100% 48%, 100% 100%, 0 100%);
            }

            .g-img-1::after {
                content: '';
                position: absolute;
                left: 10%;
                right: 10%;
                bottom: 16%;
                height: 36%;
                background: linear-gradient(to bottom, rgba(8, 6, 4, 0.85), rgba(2, 1, 1, 0.98));
                clip-path: polygon(0 40%, 16% 40%, 16% 14%, 42% 14%, 42% 0, 74% 0, 74% 40%, 100% 40%, 100% 100%, 0 100%);
            }

            .g-img-2 {
                background:
                    radial-gradient(ellipse 80% 60% at 50% 30%, rgba(200, 170, 130, 0.55), transparent 70%),
                    linear-gradient(to bottom, #b8a080 0%, #8a6848 45%, #4a3420 75%, #1a1008 100%);
            }

            .g-img-3 {
                background:
                    radial-gradient(ellipse 80% 60% at 50% 40%, rgba(180, 190, 205, 0.4), transparent 70%),
                    linear-gradient(to bottom, #9bb0c0 0%, #6a8aa0 45%, #345468 80%, #12212e 100%);
            }

            .g-img-4 {
                background:
                    radial-gradient(ellipse 60% 40% at 50% 40%, rgba(255, 232, 200, 0.45), transparent 70%),
                    linear-gradient(to bottom, #d4c4a8 0%, #a88862 35%, #5a3e24 75%, #1a1008 100%);
            }

            .g-img-5 {
                background:
                    radial-gradient(ellipse 90% 50% at 50% 0%, rgba(255, 195, 140, 0.45), transparent 65%),
                    linear-gradient(to bottom, #4a5a70 0%, #8a5030 35%, #c86840 55%, #3a2012 85%, #080402 100%);
            }

            .prop-gallery-cta {
                position: absolute;
                right: 28px;
                top: 28px;
                z-index: 5;
                padding: 10px 18px;
                background: var(--paper);
                color: var(--ink);
                border-radius: 100px;
                font-size: 10px;
                letter-spacing: 0.25em;
                text-transform: uppercase;
                font-weight: 500;
            }

            .prop-header {
                padding: 60px 32px 40px 32px;
                max-width: 1800px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: 1.6fr 1fr;
                gap: 80px;
                align-items: end;
                border-bottom: 1px solid var(--line);
            }

            .prop-badge {
                font-size: 11px;
                letter-spacing: 0.28em;
                text-transform: uppercase;
                font-weight: 500;
                color: var(--cognac);
                display: flex;
                align-items: center;
                gap: 14px;
                margin-bottom: 24px;
            }

            .prop-badge::before {
                content: '';
                width: 36px;
                height: 1px;
                background: var(--cognac);
            }

            .prop-num {
                color: var(--muted-2);
                font-family: var(--editorial);
                font-style: italic;
                letter-spacing: 0.02em;
                text-transform: none;
                font-size: 13px;
                margin-left: 8px;
            }

            .prop-title {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(48px, 6vw, 92px);
                line-height: 0.95;
                letter-spacing: -0.035em;
                margin-bottom: 18px;
            }

            .prop-title em {
                font-style: italic;
                color: var(--cognac-deep);
            }

            .prop-loc {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 20px;
                color: var(--muted);
            }

            .prop-price-label {
                font-size: 11px;
                letter-spacing: 0.28em;
                text-transform: uppercase;
                color: var(--muted-2);
                font-weight: 500;
                margin-bottom: 14px;
            }

            .prop-price {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(40px, 5vw, 68px);
                line-height: 1;
                letter-spacing: -0.03em;
                color: var(--ink);
            }

            .prop-price em {
                font-style: italic;
                color: var(--cognac);
            }

            .prop-price-note {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 15px;
                color: var(--muted);
                margin-top: 10px;
            }

            .prop-specs {
                padding: 48px 32px;
                max-width: 1800px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: repeat(6, 1fr);
                gap: 0;
                border-bottom: 1px solid var(--line);
            }

            .prop-spec {
                padding: 0 28px;
                border-right: 1px solid var(--line);
                display: flex;
                flex-direction: column;
                gap: 10px;
            }

            .prop-spec:first-child {
                padding-left: 0;
            }

            .prop-spec:last-child {
                border-right: none;
                padding-right: 0;
            }

            .prop-spec-label {
                font-size: 10px;
                letter-spacing: 0.28em;
                text-transform: uppercase;
                color: var(--muted-2);
                font-weight: 500;
            }

            .prop-spec-value {
                font-family: var(--display);
                font-weight: 300;
                font-size: clamp(26px, 2.4vw, 36px);
                line-height: 1;
                letter-spacing: -0.02em;
            }

            .prop-spec-value em {
                font-style: italic;
                color: var(--cognac);
                font-weight: 300;
            }

            .prop-spec-value .unit {
                font-size: 0.55em;
                font-family: var(--body);
                font-weight: 400;
                color: var(--muted);
                letter-spacing: 0.02em;
                margin-left: 2px;
            }

            .prop-body {
                padding: 100px 32px;
                max-width: 1800px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: 1.6fr 1fr;
                gap: 100px;
                align-items: start;
            }

            .prop-desc p.lede {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 24px;
                line-height: 1.45;
                color: var(--ink);
                margin-bottom: 32px;
                max-width: 52ch;
            }

            .prop-desc p {
                font-size: 17px;
                line-height: 1.75;
                color: var(--muted);
                max-width: 62ch;
                margin-bottom: 18px;
            }

            .prop-features {
                margin-top: 72px;
            }

            .prop-features h3 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 32px;
                letter-spacing: -0.02em;
                margin-bottom: 32px;
            }

            .prop-features h3 em {
                font-style: italic;
            }

            .features-grid {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 32px 48px;
            }

            .feature-cat h4 {
                font-size: 11px;
                letter-spacing: 0.28em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                margin-bottom: 16px;
                padding-bottom: 14px;
                border-bottom: 1px solid var(--line);
            }

            .feature-cat ul {
                list-style: none;
            }

            .feature-cat li {
                padding: 8px 0;
                font-size: 15px;
                color: var(--muted);
                line-height: 1.5;
                display: flex;
                align-items: start;
                gap: 10px;
            }

            .feature-cat li::before {
                content: '';
                width: 3px;
                height: 3px;
                border-radius: 50%;
                background: var(--cognac-light);
                margin-top: 10px;
                flex-shrink: 0;
            }

            .prop-sidebar {
                position: sticky;
                top: 100px;
            }

            .agent-card {
                background: var(--paper-2);
                padding: 40px 36px;
                border: 1px solid var(--line);
                margin-bottom: 24px;
            }

            .agent-card-label {
                font-size: 10px;
                letter-spacing: 0.35em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                margin-bottom: 24px;
                display: flex;
                align-items: center;
                gap: 14px;
            }

            .agent-card-label::before {
                content: '';
                width: 30px;
                height: 1px;
                background: var(--cognac);
            }

            .agent-portrait-wrap {
                display: flex;
                gap: 18px;
                align-items: center;
                margin-bottom: 24px;
            }

            .agent-portrait {
                width: 68px;
                height: 68px;
                flex-shrink: 0;
                border-radius: 50%;
                background:
                    radial-gradient(ellipse 55% 50% at 50% 35%, rgba(200, 175, 145, 0.95), rgba(150, 118, 85, 0.85) 55%, rgba(80, 55, 30, 0.95) 95%),
                    linear-gradient(to bottom, #d4c4a8 0%, #a88862 30%, #4a3420 80%);
                position: relative;
                overflow: hidden;
            }

            .agent-portrait::after {
                content: '';
                position: absolute;
                left: 16%;
                right: 16%;
                bottom: 0;
                height: 42%;
                background: linear-gradient(to bottom, rgba(40, 28, 18, 0.85), rgba(15, 10, 6, 1));
                clip-path: polygon(22% 0, 78% 0, 96% 100%, 4% 100%);
            }

            .agent-info h4 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 22px;
                letter-spacing: -0.015em;
                margin-bottom: 4px;
            }

            .agent-info h4 em {
                font-style: italic;
            }

            .agent-info .role {
                font-size: 10px;
                letter-spacing: 0.28em;
                text-transform: uppercase;
                color: var(--muted-2);
                font-weight: 500;
            }

            .agent-quote {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 15px;
                line-height: 1.55;
                color: var(--muted);
                padding: 20px 0;
                border-top: 1px solid var(--line);
                border-bottom: 1px solid var(--line);
                margin-bottom: 24px;
            }

            .agent-contact-row {
                display: flex;
                flex-direction: column;
                gap: 14px;
                font-size: 14px;
                margin-bottom: 28px;
            }

            .agent-contact-row a {
                display: flex;
                align-items: center;
                gap: 10px;
                padding: 10px 0;
                color: var(--ink);
                border-bottom: 1px solid var(--line);
                transition: color 0.3s;
            }

            .agent-contact-row a:hover {
                color: var(--cognac);
            }

            .agent-contact-row a:last-child {
                border-bottom: none;
            }

            .agent-contact-row .lbl {
                font-size: 10px;
                letter-spacing: 0.22em;
                text-transform: uppercase;
                color: var(--muted-2);
                font-weight: 500;
                min-width: 70px;
            }

            .agent-contact-row .val {
                font-family: var(--editorial);
                font-style: italic;
            }

            .agent-ctas {
                display: flex;
                flex-direction: column;
                gap: 10px;
            }

            .btn-inline {
                padding: 16px 24px;
                text-align: center;
                border-radius: 100px;
                font-size: 11px;
                letter-spacing: 0.22em;
                text-transform: uppercase;
                font-weight: 500;
                transition: all 0.3s;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 10px;
            }

            .btn-inline.primary {
                background: var(--ink);
                color: var(--paper);
            }

            .btn-inline.primary:hover {
                background: var(--cognac-deep);
            }

            .btn-inline.secondary {
                border: 1px solid var(--ink);
                color: var(--ink);
            }

            .btn-inline.secondary:hover {
                background: var(--ink);
                color: var(--paper);
            }

            /* Map block */
            .prop-map {
                padding: 0 32px 100px 32px;
                max-width: 1800px;
                margin: 0 auto;
            }

            .prop-map-head {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 80px;
                margin-bottom: 40px;
                align-items: end;
            }

            .prop-map-head h3 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(36px, 4vw, 56px);
                line-height: 1;
                letter-spacing: -0.025em;
                margin-top: 20px;
            }

            .prop-map-head h3 em {
                font-style: italic;
            }

            .prop-map-head p {
                font-size: 15px;
                line-height: 1.65;
                color: var(--muted);
                max-width: 48ch;
            }

            .prop-map-visual {
                height: 440px;
                background: var(--paper-2);
                position: relative;
                overflow: hidden;
                border: 1px solid var(--line);
            }

            .map-mesh {
                position: absolute;
                inset: 0;
                background:
                    radial-gradient(ellipse 40% 30% at 70% 40%, rgba(138, 90, 43, 0.15), transparent 70%),
                    radial-gradient(ellipse 50% 35% at 25% 70%, rgba(200, 170, 130, 0.2), transparent 70%),
                    linear-gradient(135deg, #e8dfc6 0%, #d9cfb3 40%, #c8bb9c 100%);
            }

            .map-streets {
                position: absolute;
                inset: 0;
                opacity: 0.25;
                pointer-events: none;
            }

            .map-streets::before {
                content: '';
                position: absolute;
                left: 10%;
                right: 10%;
                top: 40%;
                height: 1px;
                background: linear-gradient(to right, transparent, var(--ink) 20%, var(--ink) 80%, transparent);
            }

            .map-streets::after {
                content: '';
                position: absolute;
                left: 50%;
                top: 15%;
                bottom: 15%;
                width: 1px;
                background: linear-gradient(to bottom, transparent, var(--ink) 20%, var(--ink) 80%, transparent);
            }

            .map-pin {
                position: absolute;
                left: 50%;
                top: 45%;
                transform: translate(-50%, -50%);
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 4px;
                z-index: 2;
            }

            .map-pin .dot {
                width: 14px;
                height: 14px;
                border-radius: 50%;
                background: var(--ink);
                box-shadow: 0 0 0 6px rgba(10, 10, 8, 0.15);
                position: relative;
            }

            .map-pin .dot::after {
                content: '';
                position: absolute;
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
                width: 6px;
                height: 6px;
                border-radius: 50%;
                background: var(--cognac-light);
            }

            .map-pin .label {
                background: var(--paper);
                padding: 6px 12px;
                font-size: 10px;
                letter-spacing: 0.25em;
                text-transform: uppercase;
                font-weight: 500;
                color: var(--ink);
                margin-top: 10px;
                white-space: nowrap;
            }

            .map-label-float {
                position: absolute;
                padding: 8px 14px;
                background: rgba(245, 241, 232, 0.85);
                backdrop-filter: blur(8px);
                font-family: var(--editorial);
                font-style: italic;
                font-size: 13px;
                color: var(--muted);
                letter-spacing: 0.02em;
                border: 1px solid var(--line);
            }

            .map-label-float.l1 {
                left: 12%;
                top: 22%;
            }

            .map-label-float.l2 {
                right: 14%;
                top: 30%;
            }

            .map-label-float.l3 {
                left: 18%;
                bottom: 20%;
            }

            .map-label-float.l4 {
                right: 20%;
                bottom: 24%;
            }

            /* Similar properties */
            .similar {
                padding: 100px 32px;
                max-width: 1800px;
                margin: 0 auto;
                border-top: 1px solid var(--line);
            }

            .similar-head {
                margin-bottom: 48px;
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 80px;
                align-items: end;
            }

            .similar-head h3 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(36px, 4vw, 56px);
                line-height: 1;
                letter-spacing: -0.025em;
                margin-top: 18px;
            }

            .similar-head h3 em {
                font-style: italic;
            }

            .similar-grid {
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 32px;
            }

            .similar-card {
                cursor: pointer;
            }

            .similar-card-img {
                position: relative;
                overflow: hidden;
                aspect-ratio: 4/5;
                margin-bottom: 20px;
            }

            .similar-card-img>div {
                position: absolute;
                inset: 0;
                transition: transform 0.9s;
            }

            .similar-card:hover .similar-card-img>div {
                transform: scale(1.04);
            }

            .similar-card-badge {
                position: absolute;
                top: 16px;
                left: 16px;
                z-index: 2;
                padding: 6px 12px;
                background: var(--paper);
                color: var(--ink);
                font-size: 10px;
                letter-spacing: 0.22em;
                text-transform: uppercase;
                font-weight: 500;
            }

            .similar-card-num {
                position: absolute;
                top: 16px;
                right: 16px;
                z-index: 2;
                font-family: var(--editorial);
                font-style: italic;
                font-size: 13px;
                color: rgba(245, 241, 232, 0.85);
            }

            .similar-card-bottom {
                position: absolute;
                bottom: 0;
                left: 0;
                right: 0;
                z-index: 2;
                padding: 20px;
                color: var(--paper);
                background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
                display: flex;
                justify-content: space-between;
                align-items: flex-end;
            }

            .similar-card-price {
                font-family: var(--display);
                font-style: italic;
                font-weight: 300;
                font-size: 24px;
                letter-spacing: -0.01em;
            }

            .similar-card-meta {
                display: flex;
                justify-content: space-between;
                font-size: 10px;
                letter-spacing: 0.25em;
                text-transform: uppercase;
                color: var(--muted);
                margin-bottom: 10px;
                font-weight: 500;
            }

            .similar-card h4 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 24px;
                letter-spacing: -0.015em;
                margin-bottom: 8px;
            }

            .similar-card h4 em {
                font-style: italic;
            }

            .similar-card-specs {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 13px;
                color: var(--muted);
            }

            /* =========== NEIGHBOURHOOD =========== */
            .nbh-hero {
                padding: 110px 32px 0 32px;
                max-width: 1800px;
                margin: 0 auto;
            }

            .nbh-hero-img {
                height: 560px;
                position: relative;
                overflow: hidden;
                background:
                    radial-gradient(ellipse 60% 50% at 55% 35%, rgba(255, 230, 190, 0.55), transparent 65%),
                    radial-gradient(ellipse 120% 70% at 50% 25%, rgba(220, 150, 100, 0.45), transparent 70%),
                    linear-gradient(to bottom, #1e2838 0%, #3c3248 14%, #6a4432 28%, #a46038 42%, #c47240 52%, #a05028 66%, #3a1e10 82%, #080402 100%);
            }

            .nbh-hero-img::before {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                top: 45%;
                height: 15%;
                background: linear-gradient(to bottom, rgba(55, 38, 42, 0.5), rgba(20, 14, 16, 0.8));
                clip-path: polygon(0 78%, 12% 50%, 25% 65%, 40% 40%, 55% 58%, 72% 38%, 88% 55%, 100% 48%, 100% 100%, 0 100%);
            }

            .nbh-hero-img::after {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                bottom: 0;
                height: 42%;
                background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
            }

            .nbh-hero-overlay {
                position: absolute;
                left: 48px;
                right: 48px;
                bottom: 48px;
                z-index: 5;
                color: var(--paper);
                display: grid;
                grid-template-columns: 2fr 1fr;
                gap: 48px;
                align-items: end;
            }

            .nbh-hero-overlay .section-label {
                color: var(--cognac-light);
                margin-bottom: 20px;
            }

            .nbh-hero-overlay .section-label::before {
                background: var(--cognac-light);
            }

            .nbh-hero-overlay h1 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(52px, 7vw, 112px);
                line-height: 0.92;
                letter-spacing: -0.035em;
            }

            .nbh-hero-overlay h1 em {
                font-style: italic;
                color: var(--cognac-light);
            }

            .nbh-hero-meta {
                display: flex;
                flex-direction: column;
                gap: 16px;
                font-family: var(--editorial);
                font-style: italic;
                font-size: 15px;
                line-height: 1.5;
            }

            .nbh-hero-meta strong {
                display: block;
                font-family: var(--body);
                font-style: normal;
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                font-weight: 500;
                opacity: 0.8;
                margin-bottom: 4px;
            }

            .nbh-hero-stamp {
                position: absolute;
                top: 32px;
                right: 48px;
                z-index: 5;
                color: rgba(245, 241, 232, 0.6);
                font-size: 10px;
                letter-spacing: 0.35em;
                text-transform: uppercase;
                font-weight: 500;
            }

            .nbh-stats {
                padding: 80px 32px;
                max-width: 1800px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: repeat(4, 1fr);
                border-bottom: 1px solid var(--line);
            }

            .nbh-stat {
                padding: 0 32px;
                border-right: 1px solid var(--line);
                display: flex;
                flex-direction: column;
                gap: 10px;
            }

            .nbh-stat:first-child {
                padding-left: 0;
            }

            .nbh-stat:last-child {
                border-right: none;
                padding-right: 0;
            }

            .nbh-stat-label {
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
            }

            .nbh-stat-value {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(36px, 4vw, 56px);
                line-height: 1;
                letter-spacing: -0.025em;
            }

            .nbh-stat-value em {
                font-style: italic;
                color: var(--cognac);
            }

            .nbh-stat-note {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 13px;
                color: var(--muted);
                line-height: 1.45;
            }

            /* Streets list */
            .streets {
                padding: 80px 32px;
                max-width: 1400px;
                margin: 0 auto;
            }

            .streets-head {
                margin-bottom: 48px;
            }

            .streets-head h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(40px, 4.5vw, 64px);
                line-height: 1;
                letter-spacing: -0.03em;
                margin-top: 18px;
            }

            .streets-head h2 em {
                font-style: italic;
            }

            .streets-list {
                border-top: 1px solid var(--line-strong);
            }

            .street-row {
                padding: 36px 0;
                border-bottom: 1px solid var(--line);
                display: grid;
                grid-template-columns: 80px 2fr 1fr 1fr auto;
                gap: 32px;
                align-items: center;
                transition: padding 0.3s;
            }

            .street-row:hover {
                padding-left: 16px;
            }

            .street-num {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 15px;
                color: var(--muted-2);
            }

            .street-name {
                font-family: var(--display);
                font-weight: 300;
                font-size: 26px;
                letter-spacing: -0.015em;
            }

            .street-name em {
                font-style: italic;
            }

            .street-profile {
                font-size: 13px;
                color: var(--muted);
                line-height: 1.4;
                font-family: var(--editorial);
                font-style: italic;
            }

            .street-range {
                font-family: var(--display);
                font-weight: 300;
                font-style: italic;
                font-size: 18px;
                color: var(--cognac);
                letter-spacing: -0.01em;
            }

            .street-arr {
                font-size: 18px;
                color: var(--muted-2);
                transition: transform 0.3s;
            }

            .street-row:hover .street-arr {
                transform: translateX(6px);
                color: var(--cognac);
            }

            /* =========== ARTICLE =========== */
            .article-header {
                padding: 130px 32px 40px 32px;
                max-width: 820px;
                margin: 0 auto;
                text-align: center;
            }

            .article-tag-pill {
                display: inline-block;
                padding: 8px 16px;
                border: 1px solid var(--cognac);
                border-radius: 100px;
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                font-weight: 500;
                color: var(--cognac);
                margin-bottom: 40px;
            }

            .article-title-main {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(44px, 5.5vw, 84px);
                line-height: 0.95;
                letter-spacing: -0.035em;
                margin-bottom: 32px;
            }

            .article-title-main em {
                font-style: italic;
                color: var(--cognac-deep);
            }

            .article-deck {
                font-family: var(--editorial);
                font-style: italic;
                font-size: clamp(20px, 2vw, 26px);
                line-height: 1.45;
                color: var(--muted);
                max-width: 48ch;
                margin: 0 auto 48px auto;
            }

            .article-byline {
                display: inline-flex;
                align-items: center;
                gap: 16px;
                padding: 20px 0;
                border-top: 1px solid var(--line);
                border-bottom: 1px solid var(--line);
                font-size: 13px;
                color: var(--muted);
                font-family: var(--editorial);
                font-style: italic;
            }

            .article-byline .author {
                color: var(--ink);
                font-weight: 500;
                font-style: normal;
                font-family: var(--body);
                letter-spacing: 0.05em;
            }

            .article-byline .sep {
                opacity: 0.5;
            }

            .article-hero-img {
                padding: 20px 32px 80px 32px;
                max-width: 1400px;
                margin: 0 auto;
            }

            .article-hero-img-inner {
                height: 480px;
                position: relative;
                overflow: hidden;
                background:
                    radial-gradient(ellipse 60% 45% at 55% 30%, rgba(255, 230, 190, 0.5), transparent 65%),
                    linear-gradient(to bottom, #2a3545 0%, #4a3428 25%, #8a4828 50%, #a45228 70%, #3a1a10 92%, #080402 100%);
            }

            .article-hero-img-inner::before {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                top: 45%;
                height: 12%;
                background: linear-gradient(to bottom, rgba(55, 38, 42, 0.5), rgba(20, 14, 16, 0.85));
                clip-path: polygon(0 78%, 15% 55%, 30% 70%, 45% 45%, 60% 60%, 75% 40%, 90% 60%, 100% 50%, 100% 100%, 0 100%);
            }

            .article-hero-img-inner::after {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                bottom: 0;
                height: 20%;
                background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
            }

            .article-caption {
                padding: 16px 32px 0 32px;
                max-width: 1400px;
                margin: 0 auto;
                font-family: var(--editorial);
                font-style: italic;
                font-size: 13px;
                color: var(--muted-2);
                letter-spacing: 0.02em;
            }

            .article-body {
                padding: 0 32px 100px 32px;
                max-width: 760px;
                margin: 0 auto;
            }

            .article-body>p:first-of-type::first-letter {
                font-family: var(--display);
                font-style: italic;
                font-weight: 300;
                font-size: 84px;
                line-height: 0.9;
                float: left;
                margin: 4px 14px 0 -4px;
                color: var(--cognac-deep);
            }

            .article-body p {
                font-size: 18px;
                line-height: 1.75;
                color: var(--ink);
                margin-bottom: 22px;
                font-family: 'Geist', sans-serif;
            }

            .article-body h2 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 32px;
                line-height: 1.1;
                letter-spacing: -0.02em;
                margin: 56px 0 20px 0;
            }

            .article-body h2 em {
                font-style: italic;
            }

            .article-body h3 {
                font-family: var(--display);
                font-weight: 400;
                font-size: 22px;
                letter-spacing: -0.01em;
                margin: 40px 0 14px 0;
            }

            .article-body blockquote {
                margin: 48px 0;
                padding: 32px 0 32px 40px;
                border-left: 3px solid var(--cognac);
                font-family: var(--display);
                font-style: italic;
                font-weight: 300;
                font-size: 28px;
                line-height: 1.3;
                letter-spacing: -0.015em;
                color: var(--ink);
            }

            .article-body blockquote cite {
                display: block;
                margin-top: 14px;
                font-family: var(--body);
                font-style: normal;
                font-weight: 500;
                font-size: 12px;
                letter-spacing: 0.2em;
                text-transform: uppercase;
                color: var(--cognac);
            }

            .article-body ul,
            .article-body ol {
                margin: 20px 0 24px 0;
                padding-left: 20px;
            }

            .article-body li {
                margin-bottom: 10px;
                font-size: 17px;
                line-height: 1.65;
                color: var(--ink);
            }

            .article-body .data-strip {
                margin: 48px -40px;
                padding: 40px;
                background: var(--paper-2);
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 32px;
                border-left: 3px solid var(--cognac);
            }

            .data-strip .d-label {
                font-size: 10px;
                letter-spacing: 0.25em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                margin-bottom: 6px;
            }

            .data-strip .d-value {
                font-family: var(--display);
                font-weight: 300;
                font-size: 36px;
                line-height: 1;
                letter-spacing: -0.02em;
            }

            .data-strip .d-value em {
                font-style: italic;
                color: var(--cognac);
            }

            .data-strip .d-note {
                font-size: 12px;
                color: var(--muted);
                margin-top: 8px;
                font-family: var(--editorial);
                font-style: italic;
            }

            /* =========== ABOUT =========== */
            .about-hero {
                padding: 140px 32px 80px 32px;
                max-width: 1400px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 80px;
                align-items: center;
            }

            .about-hero-copy h1 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(56px, 7vw, 120px);
                line-height: 0.92;
                letter-spacing: -0.035em;
                margin: 24px 0 32px 0;
            }

            .about-hero-copy h1 em {
                font-style: italic;
                color: var(--cognac-deep);
            }

            .about-hero-copy p {
                font-family: var(--editorial);
                font-style: italic;
                font-size: clamp(20px, 2vw, 26px);
                line-height: 1.5;
                color: var(--muted);
                max-width: 46ch;
            }

            .about-portrait {
                aspect-ratio: 4/5;
                position: relative;
                overflow: hidden;
                background:
                    radial-gradient(ellipse 55% 50% at 50% 35%, rgba(200, 175, 145, 0.95), rgba(150, 118, 85, 0.85) 55%, rgba(80, 55, 30, 0.95) 95%),
                    linear-gradient(to bottom, #d4c4a8 0%, #a88862 30%, #4a3420 70%, #1a1008 100%);
            }

            .about-portrait::before {
                content: '';
                position: absolute;
                left: 25%;
                right: 25%;
                top: 18%;
                bottom: 30%;
                background: radial-gradient(ellipse 60% 70% at 50% 35%, rgba(230, 200, 170, 0.95), transparent 68%);
                filter: blur(2px);
            }

            .about-portrait::after {
                content: '';
                position: absolute;
                left: 15%;
                right: 15%;
                bottom: 0;
                height: 42%;
                background: linear-gradient(to bottom, rgba(40, 28, 18, 0.9), rgba(15, 10, 6, 1));
                clip-path: polygon(25% 0, 75% 0, 95% 100%, 5% 100%);
            }

            .about-philosophy {
                padding: 80px 32px 120px 32px;
                max-width: 1200px;
                margin: 0 auto;
                border-top: 1px solid var(--line);
            }

            .about-philosophy-head h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(40px, 5vw, 72px);
                line-height: 1;
                letter-spacing: -0.03em;
                margin: 18px 0 48px 0;
                max-width: 20ch;
            }

            .about-philosophy-head h2 em {
                font-style: italic;
                color: var(--cognac-deep);
            }

            .about-philosophy-body {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 64px;
                font-size: 17px;
                line-height: 1.75;
                color: var(--muted);
                max-width: 100%;
            }

            .about-philosophy-body p+p {
                margin-top: 16px;
            }

            /* Timeline */
            .timeline {
                padding: 100px 32px;
                background: var(--ink);
                color: var(--paper);
                position: relative;
                overflow: hidden;
            }

            .timeline-head {
                max-width: 1400px;
                margin: 0 auto 80px auto;
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 80px;
                align-items: end;
            }

            .timeline-head .section-label {
                color: var(--cognac-light);
            }

            .timeline-head .section-label::before {
                background: var(--cognac-light);
            }

            .timeline-head h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(40px, 5vw, 72px);
                line-height: 1;
                letter-spacing: -0.03em;
                margin-top: 20px;
            }

            .timeline-head h2 em {
                font-style: italic;
                color: var(--cognac-light);
            }

            .timeline-head p {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 18px;
                line-height: 1.55;
                color: rgba(245, 241, 232, 0.7);
                max-width: 40ch;
            }

            .timeline-list {
                max-width: 1400px;
                margin: 0 auto;
                border-top: 1px solid rgba(245, 241, 232, 0.14);
            }

            .timeline-row {
                padding: 40px 0;
                border-bottom: 1px solid rgba(245, 241, 232, 0.14);
                display: grid;
                grid-template-columns: 120px 180px 1fr;
                gap: 40px;
                align-items: start;
            }

            .timeline-year {
                font-family: var(--display);
                font-weight: 300;
                font-style: italic;
                font-size: 28px;
                color: var(--cognac-light);
                letter-spacing: -0.01em;
            }

            .timeline-role {
                font-size: 11px;
                letter-spacing: 0.28em;
                text-transform: uppercase;
                color: rgba(245, 241, 232, 0.65);
                font-weight: 500;
                padding-top: 8px;
            }

            .timeline-desc {
                font-size: 16px;
                line-height: 1.6;
                color: rgba(245, 241, 232, 0.88);
                max-width: 62ch;
            }

            .timeline-desc strong {
                color: var(--paper);
                font-weight: 500;
            }

            /* Case studies */
            .cases {
                padding: 120px 32px;
                max-width: 1400px;
                margin: 0 auto;
            }

            .cases-head {
                margin-bottom: 60px;
            }

            .cases-head h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(40px, 5vw, 72px);
                line-height: 1;
                letter-spacing: -0.03em;
                margin-top: 18px;
            }

            .cases-head h2 em {
                font-style: italic;
            }

            .cases-grid {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 40px;
            }

            .case {
                padding: 48px;
                background: var(--paper-2);
                border: 1px solid var(--line);
                display: flex;
                flex-direction: column;
                gap: 20px;
            }

            .case-meta {
                display: flex;
                justify-content: space-between;
                align-items: center;
                font-size: 10px;
                letter-spacing: 0.28em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                padding-bottom: 16px;
                border-bottom: 1px solid var(--line);
            }

            .case-value {
                font-family: var(--display);
                font-weight: 200;
                font-size: 48px;
                line-height: 1;
                letter-spacing: -0.03em;
            }

            .case-value em {
                font-style: italic;
                color: var(--cognac);
            }

            .case h3 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 26px;
                letter-spacing: -0.015em;
                line-height: 1.2;
            }

            .case h3 em {
                font-style: italic;
            }

            .case p {
                font-size: 15px;
                line-height: 1.65;
                color: var(--muted);
                max-width: 50ch;
            }

            /* Press */
            .press-wall {
                padding: 100px 32px;
                background: var(--paper-2);
            }

            .press-wall-head {
                max-width: 1400px;
                margin: 0 auto 60px auto;
                text-align: center;
            }

            .press-wall-head h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(36px, 4.5vw, 64px);
                line-height: 1;
                letter-spacing: -0.03em;
                margin-top: 20px;
                max-width: 18ch;
                margin-left: auto;
                margin-right: auto;
            }

            .press-wall-head h2 em {
                font-style: italic;
                color: var(--cognac);
            }

            .press-wall-head .section-label {
                justify-content: center;
            }

            .press-wall-grid {
                max-width: 1400px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: repeat(4, 1fr);
                gap: 40px;
            }

            .press-quote {
                padding: 40px 32px;
                background: var(--paper);
                border: 1px solid var(--line);
                display: flex;
                flex-direction: column;
                gap: 18px;
            }

            .press-quote-source {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 22px;
                color: var(--cognac-deep);
                letter-spacing: -0.01em;
            }

            .press-quote-text {
                font-size: 14px;
                line-height: 1.65;
                color: var(--muted);
                font-family: var(--editorial);
                font-style: italic;
            }

            .press-quote-date {
                font-size: 10px;
                letter-spacing: 0.28em;
                text-transform: uppercase;
                color: var(--muted-2);
                font-weight: 500;
                margin-top: auto;
                padding-top: 20px;
                border-top: 1px solid var(--line);
            }

            /* About contact */
            .about-contact {
                padding: 120px 32px;
                background: var(--ink);
                color: var(--paper);
            }

            .about-contact-inner {
                max-width: 1000px;
                margin: 0 auto;
                text-align: center;
            }

            .about-contact h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(48px, 6vw, 96px);
                line-height: 0.95;
                letter-spacing: -0.035em;
                max-width: 16ch;
                margin: 20px auto 32px auto;
            }

            .about-contact h2 em {
                font-style: italic;
                color: var(--cognac-light);
            }

            .about-contact .section-label {
                color: var(--cognac-light);
                justify-content: center;
            }

            .about-contact .section-label::before {
                background: var(--cognac-light);
            }

            .about-contact p {
                font-size: 18px;
                line-height: 1.6;
                color: rgba(245, 241, 232, 0.75);
                max-width: 52ch;
                margin: 0 auto 48px auto;
            }

            /* CTA BLOCK */
            .cta-block {
                margin-top: 100px;
                padding: 80px 60px;
                background: var(--ink);
                color: var(--paper);
                position: relative;
                overflow: hidden;
            }

            .cta-block .section-label {
                color: var(--cognac-light);
                margin-bottom: 24px;
            }

            .cta-block .section-label::before {
                background: var(--cognac-light);
            }

            .cta-block h3 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(36px, 4vw, 56px);
                line-height: 1;
                letter-spacing: -0.025em;
                max-width: 18ch;
                margin: 0 0 32px 0;
            }

            .cta-block h3 em {
                font-style: italic;
                color: var(--cognac-light);
            }

            .cta-block p {
                font-size: 17px;
                line-height: 1.6;
                color: rgba(245, 241, 232, 0.7);
                max-width: 52ch;
                margin-bottom: 40px;
            }

            .cta-buttons {
                display: flex;
                gap: 14px;
                flex-wrap: wrap;
            }

emplate-columns: repeat(3, 1fr);
                    gap: 24px 0;
                }

                .prop-spec:nth-child(3n) {
                    border-right: none;
                }

                .prop-spec,
                .nbh-stat {
                    padding: 16px;
                }

                .prop-gallery {
                    grid-template-columns: 1fr 1fr;
                    grid-template-rows: 280px 180px 180px;
                }

                .prop-gallery .main {
                    grid-column: 1 / 3;
                    grid-row: 1 / 2;
                }

                .prop-gallery .cell-2 {
                    grid-column: 1;
                    grid-row: 2;
                }

                .prop-gallery .cell-3 {
                    grid-column: 2;
                    grid-row: 2;
                }

                .prop-gallery .cell-4 {
                    grid-column: 1;
                    grid-row: 3;
                }

                .prop-gallery .cell-5 {
                    grid-column: 2;
                    grid-row: 3;
                }

                .similar-grid {
                    grid-template-columns: 1fr 1fr;
                }

                .cases-grid {
                    grid-template-columns: 1fr;
                }

                .press-wall-grid {
                    grid-template-columns: 1fr 1fr;
                }

                .prop-sidebar {
                    position: static;
                }

                .nbh-hero-overlay {
                    grid-template-columns: 1fr;
                    gap: 24px;
                }

                .timeline-row {
                    grid-template-columns: 100px 1fr;
                }

                .timeline-role {
                    grid-column: 2;
                    grid-row: 1;
                }

                .timeline-desc {
                    grid-column: 1/-1;
                    margin-top: 12px;
                }
            }

            @media (max-width: 900px) {

                .prop-gallery,
                .prop-header,
                .prop-specs,
                .prop-body,
                .prop-map,
                .similar,
                .nbh-hero,
                .nbh-stats,
                .streets,
                .article-body,
                .article-header,
                .article-hero-img,
                .about-hero,
                .about-philosophy,
                .cases,
                .press-wall,
                .about-contact,
                .timeline {
                    padding-left: 20px;
                    padding-right: 20px;
                }

                .prop-specs,
                .nbh-stats {
                    grid-template-columns: 1fr 1fr;
                }

                .prop-spec:nth-child(3n) {
                    border-right: 1px solid var(--line);
                }

                .prop-spec:nth-child(2n) {
                    border-right: none;
                }

                .prop-spec {
                    padding: 12px;
                }

                .prop-gallery {
                    grid-template-columns: 1fr;
                    grid-template-rows: 240px repeat(4, 140px);
                    gap: 6px;
                }

                .prop-gallery .main {
                    grid-column: 1;
                    grid-row: 1;
                }

                .prop-gallery .cell-2 {
                    grid-column: 1;
                    grid-row: 2;
                }

                .prop-gallery .cell-3 {
                    grid-column: 1;
                    grid-row: 3;
                }

                .prop-gallery .cell-4 {
                    grid-column: 1;
                    grid-row: 4;
                }

                .prop-gallery .cell-5 {
                    grid-column: 1;
                    grid-row: 5;
                }

                .similar-grid,
                .features-grid {
                    grid-template-columns: 1fr;
                }

                .nbh-hero-img {
                    height: 400px;
                }

                .nbh-hero-overlay {
                    left: 20px;
                    right: 20px;
                    bottom: 20px;
                }

                .nbh-hero-stamp {
                    right: 20px;
                    top: 24px;
                }

                .press-wall-grid {
                    grid-template-columns: 1fr;
                }

                .street-row {
                    grid-template-columns: 40px 1fr;
                    gap: 12px;
                    padding: 24px 0;
                }

                .street-profile,
                .street-range,
                .street-arr {
                    grid-column: 2;
                }

                .street-profile {
                    grid-row: 2;
                    margin-top: 6px;
                }

                .street-range {
                    grid-row: 3;
                    margin-top: 6px;
                }

                .street-arr {
                    display: none;
                }

                .article-body {
                    padding: 0 24px 80px 24px;
                }

                .article-body>p:first-of-type::first-letter {
                    font-size: 60px;
                }

                .article-body p,
                .article-body li {
                    font-size: 16px;
                }

                .article-body blockquote {
                    font-size: 22px;
                    padding-left: 24px;
                    margin: 32px 0;
                }

                .article-body .data-strip {
                    grid-template-columns: 1fr;
                    margin: 32px 0;
                    gap: 24px;
                }
            }
        

/* ========================================= */


   /* BREADCRUMBS */
  .breadcrumbs {
    padding: 110px 48px 20px 48px;
    max-width: 1400px; margin: 0 auto;
    display: flex; align-items: center; gap: 12px;
    font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; font-weight: 500;
    color: var(--muted-2);
  }
  .breadcrumbs a:hover { color: var(--cognac); }
  .breadcrumbs .current { color: var(--ink); }
  .breadcrumbs .sep { opacity: 0.4; }

  /* PAGE HEADER */
  .page-header {
    padding: 40px 48px 100px 48px;
    max-width: 1400px; margin: 0 auto;
  }
  .section-label {
    font-size: 11px; letter-spacing: 0.32em; text-transform: uppercase;
    color: var(--cognac); font-weight: 500;
    display: flex; align-items: center; gap: 14px;
    margin-bottom: 32px;
  }
  .section-label::before { content: ''; width: 40px; height: 1px; background: var(--cognac); }
  .page-title {
    font-family: var(--display); font-weight: 200;
    font-size: clamp(56px, 8vw, 128px); line-height: 0.92; letter-spacing: -0.035em;
    max-width: 14ch;
  }
  .page-title em { font-style: italic; color: var(--cognac-deep); }
  .page-lede {
    margin-top: 48px;
    font-family: var(--editorial); font-style: italic;
    font-size: clamp(22px, 2.2vw, 30px); line-height: 1.45;
    color: var(--muted);
    max-width: 50ch;
  }

  /* HERO VISUAL BAR */
  .hero-bar {
    padding: 0 48px;
    max-width: 1400px; margin: 0 auto;
  }
  .hero-bar-inner {
    height: 360px;
    background:
      radial-gradient(ellipse 60% 50% at 65% 35%, rgba(255, 230, 190, 0.55), transparent 65%),
      radial-gradient(ellipse 120% 70% at 50% 25%, rgba(220, 150, 100, 0.45), transparent 70%),
      linear-gradient(to bottom,
        #1e2838 0%, #3c3248 14%, #6a4432 28%, #a46038 42%,
        #c47240 52%, #a05028 66%, #3a1e10 82%, #080402 100%);
    position: relative; overflow: hidden;
  }
  .hero-bar-inner::before {
    content: ''; position: absolute; left: 0; right: 0; top: 42%; height: 14%;
    background: linear-gradient(to bottom, rgba(55, 38, 42, 0.55), rgba(20, 14, 16, 0.85));
    clip-path: polygon(0 78%, 12% 50%, 25% 65%, 40% 40%, 55% 58%, 72% 38%, 88% 55%, 100% 48%, 100% 100%, 0 100%);
  }
  .hero-bar-inner::after {
    content: ''; position: absolute; left: 10%; right: 10%; bottom: 14%; height: 38%;
    background: linear-gradient(to bottom, rgba(8, 6, 4, 0.85), rgba(2, 1, 1, 0.98));
    clip-path: polygon(0 40%, 16% 40%, 16% 14%, 42% 14%, 42% 0, 74% 0, 74% 40%, 100% 40%, 100% 100%, 0 100%);
  }
  .hero-bar-label {
    position: absolute; bottom: 32px; left: 40px; z-index: 5;
    color: var(--paper); font-family: var(--editorial); font-style: italic;
    font-size: 15px; letter-spacing: 0.02em;
  }
  .hero-bar-label strong {
    display: block; font-family: var(--body); font-style: normal;
    font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase;
    font-weight: 500; opacity: 0.75; margin-bottom: 6px;
  }
  .hero-bar-stamp {
    position: absolute; top: 32px; right: 40px; z-index: 5;
    color: rgba(245,241,232,0.55); font-size: 10px;
    letter-spacing: 0.4em; text-transform: uppercase; font-weight: 500;
  }

  /* PAGE NAV PILLS */
  .page-nav {
    padding: 60px 48px 20px 48px;
    max-width: 1400px; margin: 0 auto;
    display: flex; gap: 10px; flex-wrap: wrap;
    border-bottom: 1px solid var(--line);
    padding-bottom: 40px;
  }
  .page-nav-pill {
    padding: 10px 20px; border: 1px solid var(--line-strong); border-radius: 100px;
    font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; font-weight: 500;
    color: var(--muted); transition: all 0.3s;
  }
  .page-nav-pill:hover { border-color: var(--ink); color: var(--ink); }
  .page-nav-pill.current { background: var(--ink); color: var(--paper); border-color: var(--ink); }

  /* MAIN BODY */
  .body-wrap {
    padding: 80px 48px 120px 48px;
    max-width: 1400px; margin: 0 auto;
    display: grid; grid-template-columns: 200px 1fr; gap: 80px;
    align-items: start;
  }

  /* STICKY TOC */
  .toc {
    position: sticky; top: 120px;
    padding-top: 8px;
  }
  .toc-label {
    font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase;
    color: var(--cognac); font-weight: 500;
    padding-bottom: 16px; margin-bottom: 16px;
    border-bottom: 1px solid var(--line);
  }
  .toc ul { list-style: none; }
  .toc li { margin-bottom: 12px; }
  .toc a {
    font-size: 13px; color: var(--muted); line-height: 1.35;
    transition: color 0.3s; display: block; padding-left: 16px;
    position: relative;
  }
  .toc a::before {
    content: ''; position: absolute; left: 0; top: 8px;
    width: 6px; height: 1px; background: var(--muted-2);
    transition: background 0.3s, width 0.3s;
  }
  .toc a:hover { color: var(--ink); }
  .toc a:hover::before { background: var(--cognac); width: 10px; }

  /* CONTENT */
  .content h2 {
    font-family: var(--display); font-weight: 200;
    font-size: clamp(32px, 3.6vw, 48px); line-height: 1.05; letter-spacing: -0.03em;
    margin: 80px 0 24px 0; max-width: 24ch;
  }
  .content h2:first-child { margin-top: 0; }
  .content h2 em { font-style: italic; color: var(--cognac-deep); }
  .content h3 {
    font-family: var(--display); font-weight: 300;
    font-size: 26px; line-height: 1.2; letter-spacing: -0.015em;
    margin: 48px 0 14px 0;
  }
  .content h3 em { font-style: italic; }
  .content h4 {
    font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase;
    color: var(--cognac); font-weight: 500;
    margin: 40px 0 14px 0;
  }
  .content p {
    font-size: 17px; line-height: 1.75; color: var(--muted);
    max-width: 62ch; margin-bottom: 18px;
  }
  .content p strong { color: var(--ink); font-weight: 500; }
  .content .lede {
    font-family: var(--editorial); font-style: italic;
    font-size: 22px; line-height: 1.5; color: var(--ink);
    margin-bottom: 40px; max-width: 52ch;
  }
  .content ul { list-style: none; margin: 16px 0 24px 0; max-width: 62ch; }
  .content ul li {
    padding: 8px 0 8px 22px; position: relative;
    font-size: 16px; color: var(--muted); line-height: 1.55;
  }
  .content ul li::before {
    content: ''; position: absolute; left: 0; top: 17px;
    width: 8px; height: 1px; background: var(--cognac);
  }
  .content ul li strong { color: var(--ink); font-weight: 500; }
  .content ol {
    counter-reset: step; list-style: none; margin: 24px 0; max-width: 62ch;
    border-top: 1px solid var(--line);
  }
  .content ol li {
    counter-increment: step;
    padding: 20px 0 20px 56px;
    border-bottom: 1px solid var(--line);
    position: relative;
    font-size: 16px; color: var(--muted); line-height: 1.55;
  }
  .content ol li::before {
    content: counter(step, decimal-leading-zero);
    position: absolute; left: 0; top: 22px;
    font-family: var(--editorial); font-style: italic;
    font-size: 14px; color: var(--cognac);
  }

  /* PULLQUOTE */
  .pullquote {
    margin: 64px 0; padding: 48px 0;
    border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
    font-family: var(--display); font-weight: 200; font-style: italic;
    font-size: clamp(28px, 3vw, 40px); line-height: 1.25; letter-spacing: -0.02em;
    color: var(--ink); max-width: 28ch;
  }
  .pullquote::before {
    content: '✦'; display: block;
    font-size: 14px; color: var(--cognac); margin-bottom: 24px; font-style: normal;
  }

  /* CALLOUT BOX */
  .callout {
    background: var(--paper-2); padding: 40px;
    border-left: 2px solid var(--cognac);
    margin: 48px 0; max-width: 62ch;
  }
  .callout-label {
    font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase;
    color: var(--cognac); font-weight: 500; margin-bottom: 14px;
  }
  .callout h4 {
    font-family: var(--display); font-weight: 300; font-style: italic;
    font-size: 22px; line-height: 1.25; color: var(--ink); margin: 0 0 14px 0;
    letter-spacing: -0.01em; text-transform: none;
  }
  .callout p {
    font-size: 15px; line-height: 1.65; color: var(--muted);
    max-width: 100%; margin: 0;
  }
  .callout p + p { margin-top: 12px; }

  /* TABLE */
  .content table {
    width: 100%; border-collapse: collapse;
    margin: 32px 0; font-size: 15px;
    max-width: 62ch;
  }
  .content table th {
    text-align: left; padding: 14px 16px;
    background: var(--paper-2);
    font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase;
    font-weight: 500; color: var(--cognac);
    border-bottom: 1px solid var(--line-strong);
  }
  .content table td {
    padding: 14px 16px;
    border-bottom: 1px solid var(--line);
    color: var(--muted); vertical-align: top;
  }
  .content table td strong { color: var(--ink); }

  /* CTA BLOCK */
  .cta-block {
    margin-top: 100px; padding: 80px 60px;
    background: var(--ink); color: var(--paper);
    position: relative; overflow: hidden;
  }
  .cta-block .section-label { color: var(--cognac-light); margin-bottom: 24px; }
  .cta-block .section-label::before { background: var(--cognac-light); }
  .cta-block h3 {
    font-family: var(--display); font-weight: 200;
    font-size: clamp(36px, 4vw, 56px); line-height: 1; letter-spacing: -0.025em;
    max-width: 18ch; margin: 0 0 32px 0;
  }
  .cta-block h3 em { font-style: italic; color: var(--cognac-light); }
  .cta-block p {
    font-size: 17px; line-height: 1.6; color: rgba(245,241,232,0.7);
    max-width: 52ch; margin-bottom: 40px;
  }
  .cta-buttons { display: flex; gap: 14px; flex-wrap: wrap; }

  /* RELATED */
  .related {
    padding: 100px 48px; max-width: 1400px; margin: 0 auto;
    border-top: 1px solid var(--line);
  }
  .related-head { margin-bottom: 48px; }
  .related-head h3 {
    font-family: var(--display); font-weight: 200; font-style: italic;
    font-size: clamp(32px, 3.4vw, 48px); line-height: 1; letter-spacing: -0.025em;
    margin-top: 14px;
  }
  .related-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
  .related-card {
    padding: 40px 32px; background: var(--paper-2);
    border: 1px solid var(--line); transition: all 0.3s;
    display: flex; flex-direction: column; gap: 16px; min-height: 260px;
  }
  .related-card:hover { background: var(--paper); border-color: var(--cognac-light); transform: translateY(-2px); }
  .related-num {
    font-family: var(--editorial); font-style: italic;
    font-size: 14px; color: var(--muted-2);
  }
  .related-card h4 {
    font-family: var(--display); font-weight: 300;
    font-size: 28px; line-height: 1.1; letter-spacing: -0.02em;
    margin-top: 8px;
  }
  .related-card h4 em { font-style: italic; }
  .related-card p {
    font-size: 14px; color: var(--muted); line-height: 1.55;
    margin-top: 8px;
  }
  .related-card .arrow {
    margin-top: auto; font-size: 20px; color: var(--cognac); transition: transform 0.3s;
  }
  .related-card:hover .arrow { transform: translateX(6px); }

  /* FOOTER */
  footer {
    background: var(--ink); color: var(--paper);
    padding: 120px 48px 48px 48px;
    position: relative; overflow: hidden;
  }
  .footer-top {
    max-width: 1640px; margin: 0 auto 100px auto;
    display: grid; grid-template-columns: 2.5fr 1fr 1fr 1fr 1fr; gap: 60px;
    padding-bottom: 80px; border-bottom: 1px solid rgba(245,241,232,0.14);
    position: relative; z-index: 2;
  }
  .footer-brand { display: flex; flex-direction: column; gap: 24px; }
  .footer-logo {
    font-family: var(--display); font-weight: 200; font-size: 56px;
    line-height: 1; letter-spacing: -0.02em; font-style: italic;
  }
  .footer-logo sup { font-style: normal; font-size: 0.35em; letter-spacing: 0.15em; vertical-align: super; margin: 0 2px; opacity: 0.6; }
  .footer-tag { font-size: 15px; color: rgba(245,241,232,0.7); max-width: 420px;
    line-height: 1.7; font-weight: 300; }
  .footer-accred {
    display: flex; flex-direction: column; gap: 10px; margin-top: 16px;
    font-size: 11px; color: rgba(245,241,232,0.5); letter-spacing: 0.08em;
    font-family: var(--editorial); font-style: italic;
  }
  .footer-col h4 {
    font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase;
    font-weight: 500; margin-bottom: 24px; color: rgba(245,241,232,0.55);
  }
  .footer-col ul { list-style: none; }
  .footer-col li { margin-bottom: 14px; }
  .footer-col a { font-size: 14px; color: rgba(245,241,232,0.9); transition: color 0.3s; font-weight: 300; }
  .footer-col a:hover { color: var(--cognac-light); }
  .footer-bottom {
    max-width: 1640px; margin: 0 auto;
    display: flex; justify-content: space-between; align-items: center;
    font-size: 11px; color: rgba(245,241,232,0.45);
    letter-spacing: 0.12em; position: relative; z-index: 2;
    padding-top: 32px;
  }
  .footer-bottom-left, .footer-bottom-right { display: flex; gap: 32px; align-items: center; }
  .footer-huge {
    font-family: var(--display); font-weight: 200; font-style: italic;
    font-size: clamp(140px, 25vw, 420px);
    line-height: 0.8; letter-spacing: -0.05em;
    color: rgba(245,241,232,0.04);
    position: absolute; left: 0; right: 0; bottom: -60px;
    text-align: center; pointer-events: none; user-select: none; z-index: 1;
  }

  /* RESPONSIVE */
    @media (max-width: 1400px) {
    .nav-left, .nav-right {
        gap: 18px;
        font-size: 10.5px;
        letter-spacing: 0.12em;
    }
  }  
  @media (max-width: 1280px) {
    .mobile-menu.open {
        display: flex;
    }
    .mobile-toggle {
        display: flex;
    }
    .nav-left {
        display: none;
    }
    .lang-switch {display: none; }
    .nav-cta { display: none; }
    .nav-right a { display: none; }
  }

  @media (max-width: 1024px) {
    .body-wrap { grid-template-columns: 1fr; gap: 48px; padding: 60px 32px 100px 32px; }
    .toc { position: static; padding-bottom: 24px; border-bottom: 1px solid var(--line); }
    .toc ul { columns: 2; gap: 24px; }
    .related-grid { grid-template-columns: 1fr; gap: 16px; }
  }
  @media (max-width: 900px) {
    .nav { padding: 16px 20px; display: flex; justify-content: space-between; }
    .nav-left { display: none; }
    .nav-right { gap: 10px; }
    .nav-right a { display: none; }
    .nav-right .lang-switch { display: none; }
    .menu-toggle { display: flex; flex-direction: column; gap: 5px; padding: 8px; color: inherit; }
    .menu-toggle span { width: 22px; height: 1.5px; background: currentColor; display: block; }
    .nav-logo { font-size: 20px; }
    .breadcrumbs { padding: 100px 20px 12px 20px; gap: 8px; flex-wrap: wrap; }
    .page-header { padding: 24px 20px 60px 20px; }
    .page-title { font-size: clamp(44px, 12vw, 72px); }
    .page-lede { font-size: 19px; }
    .hero-bar { padding: 0 20px; }
    .hero-bar-inner { height: 240px; }
    .page-nav { padding: 40px 20px 28px 20px; gap: 8px; }
    .body-wrap { padding: 48px 20px 80px 20px; }
    .toc ul { columns: 1; }
    .content h2 { font-size: clamp(26px, 7vw, 34px); margin: 56px 0 18px 0; }
    .content h3 { font-size: 22px; }
    .content p, .content ul li, .content ol li { font-size: 15px; }
    .content .lede { font-size: 19px; }
    .content table { font-size: 14px; display: block; overflow-x: auto; }
    .content table th, .content table td { padding: 12px; }
    .cta-block { padding: 60px 28px; }
    .cta-block h3 { font-size: clamp(28px, 8vw, 36px); }
    .pullquote { font-size: clamp(22px, 6vw, 28px); padding: 36px 0; margin: 48px 0; }
    .callout { padding: 28px; }
    .related { padding: 60px 20px; }
    footer { padding: 64px 20px 32px; }
    .footer-top { grid-template-columns: 1fr 1fr; gap: 32px; padding-bottom: 40px; margin-bottom: 40px; }
    .footer-brand { grid-column: span 2; }
    .footer-logo { font-size: 44px; }
    .footer-bottom { flex-direction: column; gap: 12px; text-align: center; padding-top: 20px; }
    .footer-bottom-left, .footer-bottom-right { flex-direction: column; gap: 8px; }
  }


/* ========================================= */


            /* BREADCRUMBS */
            .breadcrumbs {
                padding: 110px 48px 20px 48px;
                max-width: 1400px;
                margin: 0 auto;
                display: flex;
                align-items: center;
                gap: 12px;
                font-size: 11px;
                letter-spacing: 0.22em;
                text-transform: uppercase;
                font-weight: 500;
                color: var(--muted-2);
            }

            .breadcrumbs a:hover {
                color: var(--cognac);
            }

            .breadcrumbs .current {
                color: var(--ink);
            }

            .breadcrumbs .sep {
                opacity: 0.4;
            }

            /* PAGE HEADER */
            .page-header {
                padding: 40px 48px 100px 48px;
                max-width: 1400px;
                margin: 0 auto;
            }

            .section-label {
                font-size: 11px;
                letter-spacing: 0.32em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                display: flex;
                align-items: center;
                gap: 14px;
                margin-bottom: 32px;
            }

            .section-label::before {
                content: '';
                width: 40px;
                height: 1px;
                background: var(--cognac);
            }

            .page-title {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(56px, 8vw, 128px);
                line-height: 0.92;
                letter-spacing: -0.035em;
                max-width: 14ch;
            }

            .page-title em {
                font-style: italic;
                color: var(--cognac-deep);
            }

            .page-lede {
                margin-top: 48px;
                font-family: var(--editorial);
                font-style: italic;
                font-size: clamp(22px, 2.2vw, 30px);
                line-height: 1.45;
                color: var(--muted);
                max-width: 50ch;
            }

            /* HERO VISUAL BAR */
            .hero-bar {
                padding: 0 48px;
                max-width: 1400px;
                margin: 0 auto;
            }

            .hero-bar-inner {
                height: 360px;
                background:
                    radial-gradient(ellipse 60% 50% at 65% 35%, rgba(255, 230, 190, 0.55), transparent 65%),
                    radial-gradient(ellipse 120% 70% at 50% 25%, rgba(220, 150, 100, 0.45), transparent 70%),
                    linear-gradient(to bottom,
                        #1e2838 0%, #3c3248 14%, #6a4432 28%, #a46038 42%,
                        #c47240 52%, #a05028 66%, #3a1e10 82%, #080402 100%);
                position: relative;
                overflow: hidden;
            }

            .hero-bar-inner::before {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                top: 42%;
                height: 14%;
                background: linear-gradient(to bottom, rgba(55, 38, 42, 0.55), rgba(20, 14, 16, 0.85));
                clip-path: polygon(0 78%, 12% 50%, 25% 65%, 40% 40%, 55% 58%, 72% 38%, 88% 55%, 100% 48%, 100% 100%, 0 100%);
            }

            .hero-bar-inner::after {
                content: '';
                position: absolute;
                left: 10%;
                right: 10%;
                bottom: 14%;
                height: 38%;
                background: linear-gradient(to bottom, rgba(8, 6, 4, 0.85), rgba(2, 1, 1, 0.98));
                clip-path: polygon(0 40%, 16% 40%, 16% 14%, 42% 14%, 42% 0, 74% 0, 74% 40%, 100% 40%, 100% 100%, 0 100%);
            }

            .hero-bar-label {
                position: absolute;
                bottom: 32px;
                left: 40px;
                z-index: 5;
                color: var(--paper);
                font-family: var(--editorial);
                font-style: italic;
                font-size: 15px;
                letter-spacing: 0.02em;
            }

            .hero-bar-label strong {
                display: block;
                font-family: var(--body);
                font-style: normal;
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                font-weight: 500;
                opacity: 0.75;
                margin-bottom: 6px;
            }

            .hero-bar-stamp {
                position: absolute;
                top: 32px;
                right: 40px;
                z-index: 5;
                color: rgba(245, 241, 232, 0.55);
                font-size: 10px;
                letter-spacing: 0.4em;
                text-transform: uppercase;
                font-weight: 500;
            }

            /* PAGE NAV PILLS */
            .page-nav {
                padding: 60px 48px 20px 48px;
                max-width: 1400px;
                margin: 0 auto;
                display: flex;
                gap: 10px;
                flex-wrap: wrap;
                border-bottom: 1px solid var(--line);
                padding-bottom: 40px;
            }

            .page-nav-pill {
                padding: 10px 20px;
                border: 1px solid var(--line-strong);
                border-radius: 100px;
                font-size: 11px;
                letter-spacing: 0.2em;
                text-transform: uppercase;
                font-weight: 500;
                color: var(--muted);
                transition: all 0.3s;
            }

            .page-nav-pill:hover {
                border-color: var(--ink);
                color: var(--ink);
            }

            .page-nav-pill.current {
                background: var(--ink);
                color: var(--paper);
                border-color: var(--ink);
            }

            /* MAIN BODY */
            .body-wrap {
                padding: 80px 48px 120px 48px;
                max-width: 1400px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: 200px 1fr;
                gap: 80px;
                align-items: start;
            }

            /* STICKY TOC */
            .toc {
                position: sticky;
                top: 120px;
                padding-top: 8px;
            }

            .toc-label {
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                padding-bottom: 16px;
                margin-bottom: 16px;
                border-bottom: 1px solid var(--line);
            }

            .toc ul {
                list-style: none;
            }

            .toc li {
                margin-bottom: 12px;
            }

            .toc a {
                font-size: 13px;
                color: var(--muted);
                line-height: 1.35;
                transition: color 0.3s;
                display: block;
                padding-left: 16px;
                position: relative;
            }

            .toc a::before {
                content: '';
                position: absolute;
                left: 0;
                top: 8px;
                width: 6px;
                height: 1px;
                background: var(--muted-2);
                transition: background 0.3s, width 0.3s;
            }

            .toc a:hover {
                color: var(--ink);
            }

            .toc a:hover::before {
                background: var(--cognac);
                width: 10px;
            }

            /* CONTENT */
            .content h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(32px, 3.6vw, 48px);
                line-height: 1.05;
                letter-spacing: -0.03em;
                margin: 80px 0 24px 0;
                max-width: 24ch;
            }

            .content h2:first-child {
                margin-top: 0;
            }

            .content h2 em {
                font-style: italic;
                color: var(--cognac-deep);
            }

            .content h3 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 26px;
                line-height: 1.2;
                letter-spacing: -0.015em;
                margin: 48px 0 14px 0;
            }

            .content h3 em {
                font-style: italic;
            }

            .content h4 {
                font-size: 11px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                margin: 40px 0 14px 0;
            }

            .content p {
                font-size: 17px;
                line-height: 1.75;
                color: var(--muted);
                max-width: 62ch;
                margin-bottom: 18px;
            }

            .content p strong {
                color: var(--ink);
                font-weight: 500;
            }

            .content .lede {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 22px;
                line-height: 1.5;
                color: var(--ink);
                margin-bottom: 40px;
                max-width: 52ch;
            }

            .content ul {
                list-style: none;
                margin: 16px 0 24px 0;
                max-width: 62ch;
            }

            .content ul li {
                padding: 8px 0 8px 22px;
                position: relative;
                font-size: 16px;
                color: var(--muted);
                line-height: 1.55;
            }

            .content ul li::before {
                content: '';
                position: absolute;
                left: 0;
                top: 17px;
                width: 8px;
                height: 1px;
                background: var(--cognac);
            }

            .content ul li strong {
                color: var(--ink);
                font-weight: 500;
            }

            .content ol {
                counter-reset: step;
                list-style: none;
                margin: 24px 0;
                max-width: 62ch;
                border-top: 1px solid var(--line);
            }

            .content ol li {
                counter-increment: step;
                padding: 20px 0 20px 56px;
                border-bottom: 1px solid var(--line);
                position: relative;
                font-size: 16px;
                color: var(--muted);
                line-height: 1.55;
            }

            .content ol li::before {
                content: counter(step, decimal-leading-zero);
                position: absolute;
                left: 0;
                top: 22px;
                font-family: var(--editorial);
                font-style: italic;
                font-size: 14px;
                color: var(--cognac);
            }

            /* PULLQUOTE */
            .pullquote {
                margin: 64px 0;
                padding: 48px 0;
                border-top: 1px solid var(--line);
                border-bottom: 1px solid var(--line);
                font-family: var(--display);
                font-weight: 200;
                font-style: italic;
                font-size: clamp(28px, 3vw, 40px);
                line-height: 1.25;
                letter-spacing: -0.02em;
                color: var(--ink);
                max-width: 28ch;
            }

            .pullquote::before {
                content: '✦';
                display: block;
                font-size: 14px;
                color: var(--cognac);
                margin-bottom: 24px;
                font-style: normal;
            }

            /* CALLOUT BOX */
            .callout {
                background: var(--paper-2);
                padding: 40px;
                border-left: 2px solid var(--cognac);
                margin: 48px 0;
                max-width: 62ch;
            }

            .callout-label {
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                margin-bottom: 14px;
            }

            .callout h4 {
                font-family: var(--display);
                font-weight: 300;
                font-style: italic;
                font-size: 22px;
                line-height: 1.25;
                color: var(--ink);
                margin: 0 0 14px 0;
                letter-spacing: -0.01em;
                text-transform: none;
            }

            .callout p {
                font-size: 15px;
                line-height: 1.65;
                color: var(--muted);
                max-width: 100%;
                margin: 0;
            }

            .callout p+p {
                margin-top: 12px;
            }

            /* TABLE */
            .content table {
                width: 100%;
                border-collapse: collapse;
                margin: 32px 0;
                font-size: 15px;
                max-width: 62ch;
            }

            .content table th {
                text-align: left;
                padding: 14px 16px;
                background: var(--paper-2);
                font-size: 11px;
                letter-spacing: 0.2em;
                text-transform: uppercase;
                font-weight: 500;
                color: var(--cognac);
                border-bottom: 1px solid var(--line-strong);
            }

            .content table td {
                padding: 14px 16px;
                border-bottom: 1px solid var(--line);
                color: var(--muted);
                vertical-align: top;
            }

            .content table td strong {
                color: var(--ink);
            }

            /* CTA BLOCK */
            .cta-block {
                margin-top: 100px;
                padding: 80px 60px;
                background: var(--ink);
                color: var(--paper);
                position: relative;
                overflow: hidden;
            }

            .cta-block .section-label {
                color: var(--cognac-light);
                margin-bottom: 24px;
            }

            .cta-block .section-label::before {
                background: var(--cognac-light);
            }

            .cta-block h3 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(36px, 4vw, 56px);
                line-height: 1;
                letter-spacing: -0.025em;
                max-width: 18ch;
                margin: 0 0 32px 0;
            }

            .cta-block h3 em {
                font-style: italic;
                color: var(--cognac-light);
            }

            .cta-block p {
                font-size: 17px;
                line-height: 1.6;
                color: rgba(245, 241, 232, 0.7);
                max-width: 52ch;
                margin-bottom: 40px;
            }

            .cta-buttons {
                display: flex;
                gap: 14px;
                flex-wrap: wrap;
            }



            .related-grid {
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 32px;
            }

            .related-card {
                padding: 40px 32px;
                background: var(--paper-2);
                border: 1px solid var(--line);
                transition: all 0.3s;
                display: flex;
                flex-direction: column;
                gap: 16px;
                min-height: 260px;
            }

            .related-card:hover {
                background: var(--paper);
                border-color: var(--cognac-light);
                transform: translateY(-2px);
            }

            .related-num {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 14px;
                color: var(--muted-2);
            }

            .related-card h4 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 28px;
                line-height: 1.1;
                letter-spacing: -0.02em;
                margin-top: 8px;
            }

            .related-card h4 em {
                font-style: italic;
            }

            .related-card p {
                font-size: 14px;
                color: var(--muted);
                line-height: 1.55;
                margin-top: 8px;
            }

            .related-card .arrow {
                margin-top: auto;
                font-size: 20px;
                color: var(--cognac);
                transition: transform 0.3s;
            }

            .related-card:hover .arrow {
                transform: translateX(6px);
            }





            @media (max-width: 1024px) {
                .body-wrap {
                    grid-template-columns: 1fr;
                    gap: 48px;
                    padding: 60px 32px 100px 32px;
                }

                .toc {
                    position: static;
                    padding-bottom: 24px;
                    border-bottom: 1px solid var(--line);
                }

                .toc ul {
                    columns: 2;
                    gap: 24px;
                }

                .related-grid {
                    grid-template-columns: 1fr;
                    gap: 16px;
                }
            }

            @media (max-width: 900px) {
                .breadcrumbs {
                    padding: 100px 20px 12px 20px;
                    gap: 8px;
                    flex-wrap: wrap;
                }

                .page-header {
                    padding: 24px 20px 60px 20px;
                }

                .page-title {
                    font-size: clamp(44px, 12vw, 72px);
                }

                .page-lede {
                    font-size: 19px;
                }

                .hero-bar {
                    padding: 0 20px;
                }

                .hero-bar-inner {
                    height: 240px;
                }

                .page-nav {
                    padding: 40px 20px 28px 20px;
                    gap: 8px;
                }

                .body-wrap {
                    padding: 48px 20px 80px 20px;
                }

                .toc ul {
                    columns: 1;
                }

                .content h2 {
                    font-size: clamp(26px, 7vw, 34px);
                    margin: 56px 0 18px 0;
                }

                .content h3 {
                    font-size: 22px;
                }

                .content p,
                .content ul li,
                .content ol li {
                    font-size: 15px;
                }

                .content .lede {
                    font-size: 19px;
                }

                .content table {
                    font-size: 14px;
                    display: block;
                    overflow-x: auto;
                }

                .content table th,
                .content table td {
                    padding: 12px;
                }

                .cta-block {
                    padding: 60px 28px;
                }

                .cta-block h3 {
                    font-size: clamp(28px, 8vw, 36px);
                }

                .pullquote {
                    font-size: clamp(22px, 6vw, 28px);
                    padding: 36px 0;
                    margin: 48px 0;
                }

                .callout {
                    padding: 28px;
                }

                .related {
                    padding: 60px 20px;
                }
            }
        

/* ========================================= */


            /* =========== CONTACT PAGE =========== */
            .contact-hero {
                padding: 130px 48px 40px 48px;
                max-width: 1400px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: 1.4fr 1fr;
                gap: 80px;
                align-items: end;
            }

            .contact-hero h1 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(56px, 8vw, 128px);
                line-height: 0.92;
                letter-spacing: -0.035em;
                margin-top: 28px;
            }

            .contact-hero h1 em {
                font-style: italic;
                color: var(--cognac-deep);
            }

            .contact-hero-lede {
                font-family: var(--editorial);
                font-style: italic;
                font-size: clamp(20px, 2vw, 26px);
                line-height: 1.5;
                color: var(--muted);
                max-width: 42ch;
                padding-bottom: 14px;
            }

            .contact-stats {
                padding: 60px 48px;
                max-width: 1400px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                border-top: 1px solid var(--line);
                border-bottom: 1px solid var(--line);
                gap: 0;
            }

            .contact-stat {
                padding: 0 48px;
                border-right: 1px solid var(--line);
                display: flex;
                flex-direction: column;
                gap: 12px;
            }

            .contact-stat:first-child {
                padding-left: 0;
            }

            .contact-stat:last-child {
                border-right: none;
                padding-right: 0;
            }

            .contact-stat-label {
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
            }

            .contact-stat-value {
                font-family: var(--display);
                font-weight: 300;
                font-size: clamp(26px, 2.4vw, 36px);
                line-height: 1.15;
                letter-spacing: -0.015em;
            }

            .contact-stat-value em {
                font-style: italic;
                color: var(--cognac);
            }

            .contact-stat-note {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 14px;
                color: var(--muted);
                line-height: 1.45;
            }

            /* Main layout: form left, channels right */
            .contact-main {
                padding: 100px 48px;
                max-width: 1400px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: 1.4fr 1fr;
                gap: 80px;
                align-items: start;
            }

            /* Form */
            .contact-form {
                background: var(--paper-2);
                padding: 56px 52px;
                border: 1px solid var(--line);
            }

            .contact-form-head {
                margin-bottom: 40px;
                padding-bottom: 28px;
                border-bottom: 1px solid var(--line);
            }

            .contact-form-head h2 {
                font-family: var(--display);
                font-weight: 300;
                font-size: clamp(28px, 3vw, 40px);
                line-height: 1.1;
                letter-spacing: -0.02em;
                margin-top: 14px;
            }

            .contact-form-head h2 em {
                font-style: italic;
            }

            .contact-form-head p {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 15px;
                color: var(--muted);
                margin-top: 12px;
                line-height: 1.5;
                max-width: 48ch;
            }

            .form-row {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 24px;
                margin-bottom: 20px;
            }

            .form-row.full {
                grid-template-columns: 1fr;
            }

            .form-group {
                display: flex;
                flex-direction: column;
                gap: 8px;
            }

            .form-group label {
                font-size: 10px;
                letter-spacing: 0.28em;
                text-transform: uppercase;
                color: var(--muted);
                font-weight: 500;
            }

            .form-group label .req {
                color: var(--cognac);
                margin-left: 2px;
            }

            .form-group input,
            .form-group select,
            .form-group textarea {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 17px;
                padding: 14px 0;
                background: transparent;
                border: none;
                border-bottom: 1px solid var(--line-strong);
                color: var(--ink);
                transition: border-color 0.3s;
                width: 100%;
            }

            .form-group input:focus,
            .form-group select:focus,
            .form-group textarea:focus {
                outline: none;
                border-bottom-color: var(--cognac);
            }

            .form-group input::placeholder,
            .form-group textarea::placeholder {
                color: var(--muted-2);
                font-style: italic;
                opacity: 0.7;
            }

            .form-group textarea {
                min-height: 100px;
                resize: vertical;
                line-height: 1.55;
            }

            .form-group select {
                appearance: none;
                cursor: pointer;
                background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%238a5a2b' fill='none'/%3E%3C/svg%3E");
                background-repeat: no-repeat;
                background-position: right 4px center;
            }

            /* Interest chip group */
            .interest-chips {
                display: flex;
                flex-wrap: wrap;
                gap: 8px;
                padding-top: 6px;
            }

            .chip {
                padding: 10px 18px;
                border: 1px solid var(--line-strong);
                border-radius: 100px;
                font-size: 11px;
                letter-spacing: 0.18em;
                text-transform: uppercase;
                font-weight: 500;
                background: transparent;
                color: var(--muted);
                cursor: pointer;
                transition: all 0.3s;
            }

            .chip:hover {
                border-color: var(--ink);
                color: var(--ink);
            }

            .chip.active {
                background: var(--ink);
                color: var(--paper);
                border-color: var(--ink);
            }

            .form-footer {
                margin-top: 32px;
                padding-top: 24px;
                border-top: 1px solid var(--line);
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 24px;
                flex-wrap: wrap;
            }

            .form-consent {
                font-size: 12px;
                color: var(--muted);
                line-height: 1.5;
                max-width: 40ch;
                font-family: var(--editorial);
                font-style: italic;
            }

            .form-consent a {
                color: var(--cognac);
                border-bottom: 1px solid var(--cognac);
            }

            .btn-submit {
                padding: 18px 36px;
                background: var(--ink);
                color: var(--paper);
                border-radius: 100px;
                font-size: 11px;
                letter-spacing: 0.22em;
                text-transform: uppercase;
                font-weight: 500;
                transition: all 0.3s;
                display: inline-flex;
                align-items: center;
                gap: 10px;
                border: none;
                cursor: pointer;
            }

            .btn-submit:hover {
                background: var(--cognac-deep);
                transform: translateY(-1px);
            }

            /* Channels column */
            .channels {
                display: flex;
                flex-direction: column;
                gap: 32px;
                position: sticky;
                top: 120px;
            }

            .channel-card {
                background: var(--paper);
                padding: 36px 32px;
                border: 1px solid var(--line);
                transition: border-color 0.3s, background 0.3s;
            }

            .channel-card:hover {
                border-color: var(--cognac-light);
                background: var(--paper-2);
            }

            .channel-card .section-label {
                margin-bottom: 16px;
                font-size: 10px;
            }

            .channel-card h3 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 26px;
                letter-spacing: -0.015em;
                line-height: 1.1;
                margin-bottom: 8px;
            }

            .channel-card h3 em {
                font-style: italic;
            }

            .channel-card .channel-detail {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 18px;
                color: var(--ink);
                margin-bottom: 6px;
                display: block;
            }

            .channel-card a.channel-detail {
                transition: color 0.3s;
            }

            .channel-card a.channel-detail:hover {
                color: var(--cognac);
            }

            .channel-card p {
                font-size: 13px;
                color: var(--muted);
                line-height: 1.55;
                margin-top: 12px;
            }

            /* Office visit block */
            .office {
                padding: 0 48px 100px 48px;
                max-width: 1400px;
                margin: 0 auto;
            }

            .office-inner {
                display: grid;
                grid-template-columns: 1fr 1.3fr;
                gap: 0;
                border: 1px solid var(--line);
                background: var(--paper-2);
            }

            .office-text {
                padding: 60px 52px;
                display: flex;
                flex-direction: column;
                justify-content: center;
                gap: 24px;
            }

            .office-text h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(36px, 4vw, 56px);
                line-height: 1;
                letter-spacing: -0.025em;
                margin-top: 12px;
            }

            .office-text h2 em {
                font-style: italic;
                color: var(--cognac-deep);
            }

            .office-text p {
                font-size: 16px;
                line-height: 1.7;
                color: var(--muted);
                max-width: 42ch;
            }

            .office-address {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 18px;
                color: var(--ink);
                line-height: 1.5;
                padding: 20px 0;
                border-top: 1px solid var(--line);
                border-bottom: 1px solid var(--line);
                margin: 8px 0;
            }

            .office-address strong {
                display: block;
                font-family: var(--body);
                font-style: normal;
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                font-weight: 500;
                color: var(--cognac);
                margin-bottom: 10px;
            }

            .office-hours {
                font-size: 14px;
                color: var(--muted);
                line-height: 1.65;
            }

            .office-hours strong {
                display: block;
                font-family: var(--body);
                font-weight: 500;
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: var(--cognac);
                margin-bottom: 8px;
            }

            .office-cta {
                margin-top: 16px;
            }

            .office-cta a {
                display: inline-flex;
                align-items: center;
                gap: 10px;
                padding: 14px 24px;
                border: 1px solid var(--ink);
                border-radius: 100px;
                font-size: 11px;
                letter-spacing: 0.22em;
                text-transform: uppercase;
                font-weight: 500;
                transition: all 0.3s;
            }

            .office-cta a:hover {
                background: var(--ink);
                color: var(--paper);
            }

            /* Map visual */
            .office-map {
                position: relative;
                overflow: hidden;
                min-height: 480px;
                background:
                    radial-gradient(ellipse 40% 30% at 70% 40%, rgba(138, 90, 43, 0.12), transparent 70%),
                    radial-gradient(ellipse 50% 35% at 25% 70%, rgba(200, 170, 130, 0.18), transparent 70%),
                    linear-gradient(135deg, #e8dfc6 0%, #d9cfb3 40%, #c8bb9c 100%);
            }

            .office-map::before {
                content: '';
                position: absolute;
                inset: 0;
                opacity: 0.22;
                pointer-events: none;
                background:
                    linear-gradient(to right, transparent, rgba(10, 10, 8, 0.5) 12%, rgba(10, 10, 8, 0.5) 88%, transparent) 0 30% / 100% 1px no-repeat,
                    linear-gradient(to right, transparent, rgba(10, 10, 8, 0.5) 18%, rgba(10, 10, 8, 0.5) 82%, transparent) 0 55% / 100% 1px no-repeat,
                    linear-gradient(to right, transparent, rgba(10, 10, 8, 0.5) 10%, rgba(10, 10, 8, 0.5) 90%, transparent) 0 78% / 100% 1px no-repeat,
                    linear-gradient(to bottom, transparent, rgba(10, 10, 8, 0.5) 15%, rgba(10, 10, 8, 0.5) 85%, transparent) 45% 0 / 1px 100% no-repeat,
                    linear-gradient(to bottom, transparent, rgba(10, 10, 8, 0.5) 20%, rgba(10, 10, 8, 0.5) 80%, transparent) 68% 0 / 1px 100% no-repeat;
            }

            .office-map-label {
                position: absolute;
                padding: 7px 14px;
                background: rgba(245, 241, 232, 0.88);
                backdrop-filter: blur(6px);
                font-family: var(--editorial);
                font-style: italic;
                font-size: 12px;
                color: var(--muted);
                letter-spacing: 0.02em;
                border: 1px solid var(--line);
                white-space: nowrap;
            }

            .office-map-label.a {
                top: 18%;
                left: 12%;
            }

            .office-map-label.b {
                top: 28%;
                right: 16%;
            }

            .office-map-label.c {
                bottom: 22%;
                left: 18%;
            }

            .office-map-label.d {
                bottom: 18%;
                right: 12%;
            }

            .office-map-pin {
                position: absolute;
                top: 48%;
                left: 52%;
                transform: translate(-50%, -50%);
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 10px;
                z-index: 5;
            }

            .office-map-pin .dot {
                width: 16px;
                height: 16px;
                border-radius: 50%;
                background: var(--ink);
                box-shadow: 0 0 0 8px rgba(10, 10, 8, 0.12);
                position: relative;
                animation: pulse 2.2s ease-out infinite;
            }

            .office-map-pin .dot::after {
                content: '';
                position: absolute;
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
                width: 6px;
                height: 6px;
                border-radius: 50%;
                background: var(--cognac-light);
            }

            @keyframes pulse {
                0% {
                    box-shadow: 0 0 0 4px rgba(10, 10, 8, 0.18);
                }

                50% {
                    box-shadow: 0 0 0 14px rgba(10, 10, 8, 0.06);
                }

                100% {
                    box-shadow: 0 0 0 4px rgba(10, 10, 8, 0.18);
                }
            }

            .office-map-pin .pin-label {
                background: var(--paper);
                padding: 8px 14px;
                font-size: 10px;
                letter-spacing: 0.25em;
                text-transform: uppercase;
                font-weight: 500;
                color: var(--ink);
                white-space: nowrap;
                border: 1px solid var(--line);
            }

            /* Languages strip */
            .languages-strip {
                padding: 80px 48px;
                max-width: 1400px;
                margin: 0 auto;
                border-top: 1px solid var(--line);
            }

            .languages-strip-head {
                text-align: center;
                margin-bottom: 48px;
            }

            .languages-strip-head .section-label {
                justify-content: center;
            }

            .languages-strip-head h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(32px, 3.6vw, 48px);
                line-height: 1;
                letter-spacing: -0.025em;
                margin-top: 16px;
            }

            .languages-strip-head h2 em {
                font-style: italic;
                color: var(--cognac-deep);
            }

            .languages-list {
                display: flex;
                justify-content: center;
                gap: 0;
                border-top: 1px solid var(--line);
                flex-wrap: wrap;
            }

            .language-item {
                padding: 28px 44px;
                border-right: 1px solid var(--line);
                text-align: center;
            }

            .language-item:last-child {
                border-right: none;
            }

            .language-code {
                font-family: var(--display);
                font-weight: 200;
                font-style: italic;
                font-size: 44px;
                line-height: 1;
                color: var(--cognac);
                letter-spacing: -0.02em;
                margin-bottom: 8px;
            }

            .language-name {
                font-size: 10px;
                letter-spacing: 0.28em;
                text-transform: uppercase;
                color: var(--muted);
                font-weight: 500;
            }

            /* FAQ strip */
            .faq {
                padding: 100px 48px;
                max-width: 1000px;
                margin: 0 auto;
            }

            .faq-head {
                margin-bottom: 60px;
            }

            .faq-head h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(36px, 4.5vw, 64px);
                line-height: 1;
                letter-spacing: -0.03em;
                margin-top: 18px;
            }

            .faq-head h2 em {
                font-style: italic;
            }

            .faq-list {
                border-top: 1px solid var(--line-strong);
            }

            .faq-item {
                border-bottom: 1px solid var(--line);
                padding: 32px 0;
            }

            .faq-q {
                font-family: var(--display);
                font-weight: 300;
                font-size: 22px;
                letter-spacing: -0.015em;
                line-height: 1.3;
                color: var(--ink);
                margin-bottom: 16px;
            }

            .faq-q em {
                font-style: italic;
            }

            .faq-a {
                font-size: 16px;
                line-height: 1.7;
                color: var(--muted);
                max-width: 62ch;
            }

            .faq-a strong {
                color: var(--ink);
                font-weight: 500;
            }

            /* RESPONSIVE */
            @media (max-width: 1024px) {

                .contact-hero,
                .contact-main,
                .office-inner {
                    grid-template-columns: 1fr;
                    gap: 40px;
                }

                .contact-stats {
                    grid-template-columns: 1fr;
                    gap: 32px;
                }

                .contact-stat {
                    padding: 16px 0;
                    border-right: none;
                    border-bottom: 1px solid var(--line);
                    padding-left: 0 !important;
                }

                .contact-stat:last-child {
                    border-bottom: none;
                }

                .channels {
                    position: static;
                }

                .office-map {
                    min-height: 340px;
                }
            }

            @media (max-width: 900px) {

                .contact-hero,
                .contact-stats,
                .contact-main,
                .office,
                .languages-strip,
                .faq {
                    padding-left: 20px;
                    padding-right: 20px;
                }

                .contact-hero {
                    padding-top: 110px;
                    padding-bottom: 32px;
                    gap: 24px;
                }

                .contact-form {
                    padding: 36px 24px;
                }

                .form-row {
                    grid-template-columns: 1fr;
                    gap: 16px;
                }

                .form-group input,
                .form-group select,
                .form-group textarea {
                    font-size: 16px;
                }

                .form-footer {
                    flex-direction: column;
                    align-items: stretch;
                    gap: 16px;
                }

                .btn-submit {
                    justify-content: center;
                    width: 100%;
                }

                .office-text {
                    padding: 36px 24px;
                }

                .office-map {
                    min-height: 280px;
                }

                .office-map-label {
                    font-size: 10px;
                    padding: 5px 10px;
                }

                .languages-list {
                    justify-content: space-around;
                }

                .language-item {
                    padding: 20px 18px;
                }

                .language-code {
                    font-size: 32px;
                }

                .faq-q {
                    font-size: 18px;
                }

                .faq-a {
                    font-size: 15px;
                }
            }
        

/* ========================================= */


            /* ============================== HERO ============================== */
            /* ============================== HERO ============================== */
            .videos::after {
                display: block;
                content: '';
                clear: both;
                position: absolute;
                top: 0;
                left: 0;
                background: rgba(0, 0, 0, 0.7);
                height: 100%;
                width: 100%;
            }

            .videos {
                width: 100%;
                height: 100%;
                position: absolute;
                top: 0;
                left: 0;
                z-index: -1;
            }

            .videos #background {
                -o-object-fit: cover;
                object-fit: cover;
                display: block;
                top: 0;
                left: 0;
                right: 0;
                width: 100%;
                height: 100vh;
                z-index: 1;
            }

            .hero {
                position: relative;
                min-height: 100vh;
                height: 100vh;
                background: var(--ink);
                color: var(--paper);
                overflow: hidden;
            }

            /* Cinematic atmospheric backdrop - coastal dusk */
            .hero-bg {
                position: absolute;
                inset: 0;
                z-index: 1;
                background:
                    radial-gradient(ellipse 700px 500px at 65% 35%, rgba(255, 230, 190, 0.4) 0%, rgba(255, 180, 120, 0.12) 35%, transparent 65%),
                    radial-gradient(ellipse 1400px 700px at 50% 25%, rgba(200, 130, 85, 0.45) 0%, transparent 65%),
                    linear-gradient(to bottom,
                        #0b1220 0%, #1a1a28 12%, #3e2a32 22%, #6e3d30 32%,
                        #96502e 42%, #a65a2e 52%, #7a3e22 66%, #2a160e 82%, #050302 100%);
            }

            .hero-bg::after {
                content: '';
                position: absolute;
                inset: 0;
                background:
                    radial-gradient(ellipse 60% 40% at 50% 110%, rgba(0, 0, 0, 0.7), transparent 60%),
                    radial-gradient(ellipse 40% 80% at 0% 50%, rgba(0, 0, 0, 0.4), transparent 60%);
            }

            /* Mountain layers */
            .hero-mountains {
                position: absolute;
                left: 0;
                right: 0;
                top: 45%;
                height: 22%;
                z-index: 2;
            }

            .hero-mtn {
                position: absolute;
                bottom: 0;
                width: 100%;
            }

            .hero-mtn.far {
                height: 100%;
                background: linear-gradient(to bottom, rgba(85, 60, 65, 0.45), rgba(55, 38, 42, 0.7));
                clip-path: polygon(0 75%, 8% 55%, 20% 68%, 32% 48%, 45% 62%, 58% 42%, 70% 58%, 82% 44%, 94% 56%, 100% 52%, 100% 100%, 0 100%);
                filter: blur(0.5px);
            }

            .hero-mtn.near {
                height: 90%;
                background: linear-gradient(to bottom, rgba(15, 10, 8, 0.92), rgba(4, 3, 2, 1));
                clip-path: polygon(0 88%, 5% 75%, 13% 80%, 22% 65%, 32% 78%, 42% 60%, 52% 72%, 62% 58%, 72% 72%, 82% 62%, 92% 76%, 100% 68%, 100% 100%, 0 100%);
            }

            /* Sea / horizon */
            .hero-sea {
                position: absolute;
                left: 0;
                right: 0;
                bottom: 0;
                height: 30%;
                z-index: 2;
                background:
                    radial-gradient(ellipse 35% 30% at 65% 0%, rgba(255, 180, 120, 0.45), transparent 70%),
                    linear-gradient(to bottom,
                        rgba(50, 55, 75, 0.35) 0%, rgba(22, 28, 48, 0.85) 50%, rgba(4, 6, 14, 1) 100%);
            }

            .hero-sea::before {
                content: '';
                position: absolute;
                inset: 0;
                background: linear-gradient(to bottom,
                        transparent 4%, rgba(245, 200, 150, 0.22) 5.5%, transparent 7%,
                        transparent 14%, rgba(245, 200, 150, 0.15) 15.5%, transparent 17%,
                        transparent 26%, rgba(245, 200, 150, 0.1) 27%, transparent 28.5%,
                        transparent 42%, rgba(245, 200, 150, 0.06) 43%, transparent 44%);
            }

            .hero-sea::after {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                top: 0;
                height: 1px;
                background: linear-gradient(to right, transparent, rgba(255, 210, 160, 0.6) 50%, transparent);
            }

            /* Villa architectural silhouette */
            .hero-arch {
                position: absolute;
                left: 0;
                right: 0;
                bottom: 26%;
                height: 12%;
                z-index: 3;
                background: linear-gradient(to bottom, rgba(8, 6, 4, 0.8), rgba(2, 1, 1, 0.98));
                clip-path: polygon(0 58%, 15% 58%, 15% 38%, 30% 38%, 30% 22%, 52% 22%, 52% 10%, 72% 10%, 72% 30%, 88% 30%, 88% 58%, 100% 58%, 100% 100%, 0 100%);
            }

            .hero-arch-glow {
                position: absolute;
                left: 0;
                right: 0;
                bottom: 26%;
                height: 12%;
                z-index: 4;
                pointer-events: none;
                background:
                    radial-gradient(ellipse 5% 32% at 20% 72%, rgba(255, 195, 140, 0.6), transparent 65%),
                    radial-gradient(ellipse 6% 40% at 41% 55%, rgba(255, 195, 140, 0.62), transparent 62%),
                    radial-gradient(ellipse 6% 40% at 62% 40%, rgba(255, 195, 140, 0.55), transparent 62%),
                    radial-gradient(ellipse 5% 32% at 84% 72%, rgba(255, 195, 140, 0.6), transparent 65%);
                mix-blend-mode: screen;
            }

            /* Palm */
            .hero-palm {
                position: absolute;
                right: -4%;
                top: 14%;
                width: 280px;
                height: 340px;
                z-index: 5;
                pointer-events: none;
                opacity: 0.85;
            }

            .hero-palm .trunk {
                position: absolute;
                left: 48%;
                top: 38%;
                width: 5px;
                height: 62%;
                background: linear-gradient(to bottom, rgba(6, 4, 2, 0.95), #000);
                transform: rotate(-5deg);
                transform-origin: top;
                border-radius: 2px;
            }

            .hero-palm .frond {
                position: absolute;
                left: 48%;
                top: 38%;
                width: 190px;
                height: 12px;
                background: rgba(5, 3, 2, 0.92);
                border-radius: 100px 4px 4px 100px;
                transform-origin: 0 50%;
                filter: blur(0.4px);
            }

            .hero-palm .f1 {
                transform: rotate(-115deg);
                width: 135px;
                height: 10px;
            }

            .hero-palm .f2 {
                transform: rotate(-82deg);
                width: 170px;
            }

            .hero-palm .f3 {
                transform: rotate(-52deg);
                width: 195px;
                height: 14px;
            }

            .hero-palm .f4 {
                transform: rotate(-22deg);
                width: 200px;
                height: 14px;
            }

            .hero-palm .f5 {
                transform: rotate(12deg);
                width: 195px;
                height: 13px;
            }

            .hero-palm .f6 {
                transform: rotate(42deg);
                width: 180px;
            }

            .hero-palm .f7 {
                transform: rotate(72deg);
                width: 165px;
                height: 11px;
            }

            .hero-palm .f8 {
                transform: rotate(102deg);
                width: 140px;
                height: 10px;
            }

            /* Dark left-side gradient for text legibility */
            .hero-bg-vignette {
                position: absolute;
                inset: 0;
                z-index: 6;
                pointer-events: none;
                background:
                    linear-gradient(to right, rgba(5, 5, 4, 0.7) 0%, rgba(5, 5, 4, 0.35) 30%, transparent 55%, transparent 100%),
                    linear-gradient(to bottom, rgba(5, 5, 4, 0.4) 0%, transparent 20%, transparent 70%, rgba(5, 5, 4, 0.5) 100%);
            }

            /* Hero content */
            .hero-content {
                position: relative;
                z-index: 10;
                height: 100%;
                display: flex;
                flex-direction: column;
                justify-content: center;
                padding: 100px 48px 80px 48px;
            }

            .hero-top {
                position: absolute;
                top: 120px;
                left: 48px;
                right: 48px;
                z-index: 10;
                display: flex;
                justify-content: space-between;
                align-items: flex-start;
            }

            .hero-eyebrow {
                display: flex;
                align-items: center;
                gap: 16px;
                font-size: 11px;
                letter-spacing: 0.32em;
                text-transform: uppercase;
                font-weight: 500;
                color: rgba(245, 241, 232, 0.85);
                animation: fadeUp 1s 0.3s both;
            }

            .hero-eyebrow::before {
                content: '';
                width: 40px;
                height: 1px;
                background: currentColor;
                opacity: 0.6;
            }

            .hero-location {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 14px;
                color: rgba(245, 241, 232, 0.7);
                animation: fadeUp 1s 0.4s both;
            }

            .hero-headline {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(56px, 9vw, 148px);
                line-height: 0.92;
                letter-spacing: -0.035em;
                max-width: 14ch;
                animation: fadeUp 1.2s 0.5s both;
            }

            .hero-headline em {
                font-style: italic;
                font-weight: 300;
                color: var(--cognac-light);
            }

            .hero-bottom {
                display: flex;
                justify-content: space-between;
                align-items: flex-end;
                margin-top: 60px;
                gap: 40px;
                animation: fadeUp 1s 0.9s both;
            }

            .hero-lede {
                max-width: 420px;
                font-size: 16px;
                line-height: 1.6;
                color: rgba(245, 241, 232, 0.82);
                font-weight: 300;
            }

            .hero-actions {
                display: flex;
                align-items: center;
                gap: 24px;
            }

            .hero-cta {
                display: inline-flex;
                align-items: center;
                gap: 14px;
                padding: 20px 36px;
                background: var(--paper);
                color: var(--ink);
                border-radius: 100px;
                font-size: 12px;
                letter-spacing: 0.2em;
                text-transform: uppercase;
                font-weight: 500;
                transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), background 0.3s, box-shadow 0.4s;
                box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset;
            }

            .hero-cta:hover {
                transform: translateY(-2px);
                box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
            }

            .hero-cta .arr {
                display: inline-block;
                transition: transform 0.3s;
            }

            .hero-cta:hover .arr {
                transform: translateX(4px);
            }

            .hero-cta-text {
                font-size: 11px;
                letter-spacing: 0.2em;
                text-transform: uppercase;
                font-weight: 500;
                color: rgba(245, 241, 232, 0.75);
                transition: color 0.3s;
                display: inline-flex;
                align-items: center;
                gap: 10px;
            }

            .hero-cta-text:hover {
                color: var(--paper);
            }

            .hero-cta-text::before {
                content: '';
                width: 28px;
                height: 1px;
                background: currentColor;
                opacity: 0.5;
            }

            /* Scroll indicator */
            .hero-scroll {
                position: absolute;
                bottom: 32px;
                left: 50%;
                transform: translateX(-50%);
                z-index: 10;
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 10px;
                font-size: 10px;
                letter-spacing: 0.35em;
                text-transform: uppercase;
                color: rgba(245, 241, 232, 0.55);
                font-weight: 500;
                animation: fadeUp 1s 1.2s both;
            }

            .hero-scroll .line {
                width: 1px;
                height: 30px;
                background: rgba(245, 241, 232, 0.3);
                position: relative;
                overflow: hidden;
            }

            .hero-scroll .line::before {
                content: '';
                position: absolute;
                top: -30px;
                left: 0;
                right: 0;
                height: 30px;
                background: linear-gradient(to bottom, transparent, var(--paper));
                animation: scrollLine 2.5s ease-in-out infinite;
            }

            @keyframes scrollLine {
                0% {
                    top: -30px;
                }

                100% {
                    top: 30px;
                }
            }

            /* Hero meta (corner labels) */
            .hero-corner-tl,
            .hero-corner-bl,
            .hero-corner-br {
                position: absolute;
                z-index: 10;
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                font-weight: 500;
                color: rgba(245, 241, 232, 0.55);
            }

            .hero-corner-tl {
                top: 32px;
                left: 48px;
                display: none;
            }

            .hero-corner-br {
                bottom: 48px;
                right: 48px;
                font-family: var(--editorial);
                font-style: italic;
                text-transform: none;
                font-size: 13px;
                letter-spacing: 0.02em;
                text-align: right;
                color: rgba(245, 241, 232, 0.75);
                animation: fadeUp 1s 1.1s both;
            }

            .hero-corner-br strong {
                display: block;
                font-family: var(--body);
                font-style: normal;
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                font-weight: 500;
                margin-bottom: 5px;
                opacity: 0.85;
            }

            @keyframes fadeUp {
                from {
                    opacity: 0;
                    transform: translateY(24px);
                }

                to {
                    opacity: 1;
                    transform: translateY(0);
                }
            }

            /* ============================== PRESS ============================== */
            .press {
                background: var(--ink);
                color: var(--paper);
                padding: 48px 48px;
                border-top: 1px solid rgba(245, 241, 232, 0.08);
                border-bottom: 1px solid rgba(245, 241, 232, 0.08);
            }

            .press-inner {
                max-width: 1640px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: auto 1fr;
                gap: 60px;
                align-items: center;
            }

            .press-label {
                font-size: 10px;
                letter-spacing: 0.35em;
                text-transform: uppercase;
                font-weight: 500;
                color: rgba(245, 241, 232, 0.55);
                white-space: nowrap;
                display: flex;
                align-items: center;
                gap: 14px;
            }

            .press-label::after {
                content: '';
                width: 40px;
                height: 1px;
                background: currentColor;
                opacity: 0.4;
            }

            .press-items {
                display: flex;
                align-items: center;
                gap: 64px;
                overflow: hidden;
                position: relative;
            }

            .press-items::before,
            .press-items::after {
                content: '';
                position: absolute;
                top: 0;
                bottom: 0;
                width: 60px;
                z-index: 2;
                pointer-events: none;
            }

            .press-items::before {
                left: 0;
                background: linear-gradient(to right, var(--ink), transparent);
            }

            .press-items::after {
                right: 0;
                background: linear-gradient(to left, var(--ink), transparent);
            }

            .press-track {
                display: flex;
                gap: 64px;
                align-items: center;
                animation: press-scroll 45s linear infinite;
                white-space: nowrap;
            }

            @keyframes press-scroll {
                from {
                    transform: translateX(0);
                }

                to {
                    transform: translateX(-50%);
                }
            }

            .press-item {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 24px;
                color: rgba(245, 241, 232, 0.7);
                letter-spacing: -0.01em;
                display: inline-flex;
                align-items: center;
                gap: 64px;
            }

            .press-item::after {
                content: '✦';
                font-size: 10px;
                opacity: 0.4;
                font-style: normal;
            }

            /* ============================== INTRO ============================== */
            .intro {
                padding: 180px 48px 140px 48px;
                position: relative;
            }

            .intro-inner {
                max-width: 1640px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: 1fr 2fr;
                gap: 80px;
                align-items: start;
            }

            .intro-meta {
                display: flex;
                flex-direction: column;
                gap: 16px;
                padding-top: 12px;
            }

            .section-label {
                font-size: 10px;
                letter-spacing: 0.35em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                display: flex;
                align-items: center;
                gap: 14px;
            }

            .section-label::before {
                content: '';
                width: 40px;
                height: 1px;
                background: currentColor;
            }

            .section-folio {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 14px;
                color: var(--muted-2);
                letter-spacing: 0.02em;
            }

            .intro-headline {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(44px, 5vw, 88px);
                line-height: 1.02;
                letter-spacing: -0.03em;
                max-width: 20ch;
            }

            .intro-headline em {
                font-style: italic;
                font-weight: 300;
                color: var(--cognac-deep);
            }

            .intro-body {
                margin-top: 48px;
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 48px;
                max-width: 900px;
                font-size: 16px;
                line-height: 1.7;
                color: var(--muted);
                font-weight: 400;
            }

            .intro-body p+p {
                margin-top: 18px;
            }

            .intro-signature {
                margin-top: 64px;
                font-family: var(--editorial);
                font-style: italic;
                font-size: 20px;
                color: var(--ink);
                display: flex;
                align-items: center;
                gap: 24px;
            }

            .intro-signature::before {
                content: '';
                width: 60px;
                height: 1px;
                background: var(--ink);
            }

            /* Huge typographic moment */
            .marque-type {
                padding: 120px 48px 80px 48px;
                text-align: center;
                overflow: hidden;
            }

            .marque-type .word {
                font-family: var(--display);
                font-weight: 200;
                font-style: italic;
                font-size: clamp(120px, 24vw, 380px);
                line-height: 0.85;
                letter-spacing: -0.05em;
                color: var(--ink);
                display: block;
            }

            .marque-type .sub {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 18px;
                color: var(--muted);
                margin-top: 24px;
                letter-spacing: 0.02em;
            }

            /* ============================== STATS BAND ============================== */
            .stats-band {
                background: var(--ink);
                color: var(--paper);
                padding: 120px 48px;
                position: relative;
                overflow: hidden;
            }

            .stats-band-grid {
                max-width: 1640px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: repeat(4, 1fr);
                gap: 0;
                border-top: 1px solid rgba(245, 241, 232, 0.14);
            }

            .stat-cell {
                padding: 56px 40px 0 0;
                border-right: 1px solid rgba(245, 241, 232, 0.14);
                display: flex;
                flex-direction: column;
                gap: 20px;
            }

            .stat-cell:last-child {
                border-right: none;
                padding-right: 0;
            }

            .stat-cell:not(:first-child) {
                padding-left: 40px;
            }

            .stat-num {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(56px, 6vw, 96px);
                line-height: 1;
                letter-spacing: -0.03em;
            }

            .stat-num em {
                font-style: italic;
                font-weight: 300;
                color: var(--cognac-light);
            }

            .stat-label {
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: rgba(245, 241, 232, 0.6);
                font-weight: 500;
            }

            .stat-note {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 14px;
                line-height: 1.55;
                color: rgba(245, 241, 232, 0.7);
                margin-top: 4px;
            }

            .stats-band-head {
                max-width: 1640px;
                margin: 0 auto 64px auto;
                display: flex;
                justify-content: space-between;
                align-items: flex-end;
                gap: 60px;
            }

            .stats-band-head h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(40px, 4vw, 64px);
                line-height: 1;
                letter-spacing: -0.03em;
                max-width: 14ch;
            }

            .stats-band-head h2 em {
                font-style: italic;
                color: var(--cognac-light);
            }

            .stats-band-head .meta {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 14px;
                color: rgba(245, 241, 232, 0.55);
                text-align: right;
                line-height: 1.5;
                max-width: 280px;
            }

            .stats-band-head .meta strong {
                display: block;
                font-family: var(--body);
                font-style: normal;
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                margin-bottom: 8px;
                opacity: 0.8;
            }

            /* ============================== PROPERTIES ============================== */
            .properties-section {
                padding: 160px 48px 140px 48px;
                background: var(--paper);
            }

            .properties-head {
                max-width: 1640px;
                margin: 0 auto 80px auto;
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 80px;
                align-items: end;
            }

            .properties-head h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(52px, 6vw, 96px);
                line-height: 0.95;
                letter-spacing: -0.035em;
                margin-top: 24px;
            }

            .properties-head h2 em {
                font-style: italic;
            }

            .properties-filters {
                display: flex;
                gap: 10px;
                flex-wrap: wrap;
                justify-content: flex-end;
            }

            .filter-chip {
                padding: 10px 20px;
                border: 1px solid var(--line-strong);
                border-radius: 100px;
                font-size: 11px;
                letter-spacing: 0.15em;
                text-transform: uppercase;
                font-weight: 500;
                transition: background 0.3s, color 0.3s, border-color 0.3s;
                color: var(--muted);
            }

            .filter-chip.active {
                background: var(--ink);
                color: var(--paper);
                border-color: var(--ink);
            }

            .filter-chip:hover:not(.active) {
                border-color: var(--ink);
                color: var(--ink);
            }

            .property-grid {
                max-width: 1640px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: repeat(6, 1fr);
                gap: 48px 32px;
            }

            .property {
                cursor: pointer;
            }

            .property.wide {
                grid-column: span 3;
            }

            .property.narrow {
                grid-column: span 2;
            }

            .property.full {
                grid-column: span 6;
            }

            .property-img-wrap {
                position: relative;
                overflow: hidden;
                aspect-ratio: 4/5;
                margin-bottom: 28px;
            }

            .property.wide .property-img-wrap {
                aspect-ratio: 5/6;
            }

            .property.full .property-img-wrap {
                aspect-ratio: 21/9;
            }

            .property-img {
                position: absolute;
                inset: 0;
                transition: transform 1s cubic-bezier(0.2, 0.8, 0.2, 1);
            }

            .property:hover .property-img {
                transform: scale(1.04);
            }

            .property-top {
                position: absolute;
                top: 20px;
                left: 20px;
                right: 20px;
                z-index: 5;
                display: flex;
                justify-content: space-between;
                align-items: flex-start;
            }

            .property-badge {
                padding: 7px 14px;
                background: var(--paper);
                color: var(--ink);
                font-size: 10px;
                letter-spacing: 0.22em;
                text-transform: uppercase;
                font-weight: 500;
            }

            .property-num {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 13px;
                color: rgba(245, 241, 232, 0.85);
                letter-spacing: 0.02em;
            }

            .property-bottom-overlay {
                position: absolute;
                bottom: 0;
                left: 0;
                right: 0;
                padding: 24px;
                z-index: 5;
                color: var(--paper);
                background: linear-gradient(to top, rgba(0, 0, 0, 0.55), transparent);
                display: flex;
                justify-content: space-between;
                align-items: flex-end;
            }

            .property-price-overlay {
                font-family: var(--display);
                font-style: italic;
                font-weight: 300;
                font-size: 28px;
                letter-spacing: -0.01em;
            }

            .property-view {
                font-size: 10px;
                letter-spacing: 0.25em;
                text-transform: uppercase;
                font-weight: 500;
                display: inline-flex;
                align-items: center;
                gap: 8px;
            }

            .property-meta {
                display: flex;
                justify-content: space-between;
                align-items: baseline;
                font-size: 10px;
                letter-spacing: 0.28em;
                text-transform: uppercase;
                color: var(--muted);
                margin-bottom: 12px;
                font-weight: 500;
            }

            .property h3 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 30px;
                line-height: 1.12;
                letter-spacing: -0.015em;
                margin-bottom: 16px;
            }

            .property h3 em {
                font-style: italic;
            }

            .property-specs {
                display: flex;
                gap: 16px;
                font-size: 13px;
                color: var(--muted);
                font-family: var(--editorial);
                font-style: italic;
            }

            .property-specs span:not(.dot) {
                font-feature-settings: "tnum";
            }

            .property-specs .dot {
                color: var(--line-strong);
            }

            /* Property image compositions - atmospheric gradient meshes */

            /* P1: Villa Aloha - Sierra Blanca golden hour */
            .pimg-1 {
                background:
                    radial-gradient(ellipse 350px 220px at 65% 25%, rgba(255, 240, 200, 0.5) 0%, transparent 65%),
                    linear-gradient(to bottom,
                        #1e2840 0%, #3c3448 14%, #6e4832 28%, #a6603a 42%,
                        #c47244 52%, #a85230 66%, #4a2614 80%, #0a0604 100%);
            }

            .pimg-1::before {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                top: 38%;
                height: 14%;
                background: linear-gradient(to bottom, rgba(55, 38, 42, 0.5), rgba(25, 18, 20, 0.85));
                clip-path: polygon(0 75%, 10% 50%, 22% 62%, 35% 42%, 48% 58%, 62% 38%, 75% 55%, 88% 42%, 100% 52%, 100% 100%, 0 100%);
            }

            .pimg-1::after {
                content: '';
                position: absolute;
                left: 8%;
                right: 8%;
                bottom: 14%;
                height: 32%;
                background:
                    radial-gradient(ellipse 5% 30% at 10% 65%, rgba(255, 195, 140, 0.65), transparent 60%),
                    radial-gradient(ellipse 5% 30% at 24% 65%, rgba(255, 195, 140, 0.55), transparent 60%),
                    radial-gradient(ellipse 6% 40% at 50% 50%, rgba(255, 195, 140, 0.65), transparent 60%),
                    radial-gradient(ellipse 5% 30% at 76% 65%, rgba(255, 195, 140, 0.55), transparent 60%),
                    radial-gradient(ellipse 5% 30% at 90% 65%, rgba(255, 195, 140, 0.65), transparent 60%),
                    linear-gradient(to bottom, transparent 30%, rgba(8, 6, 4, 0.88) 35%, rgba(2, 1, 1, 0.98) 100%);
                clip-path: polygon(0 30%, 15% 30%, 15% 10%, 45% 10%, 45% 0, 75% 0, 75% 30%, 100% 30%, 100% 100%, 0 100%);
            }

            /* P2: Casa del Mirador - La Zagaleta terracotta dusk */
            .pimg-2 {
                background:
                    radial-gradient(ellipse 400px 220px at 50% 25%, rgba(245, 215, 175, 0.55) 0%, transparent 70%),
                    linear-gradient(to bottom,
                        #c8ae8a 0%, #d8b090 22%, #b08460 44%, #6a4228 66%, #2a1a10 100%);
            }

            .pimg-2::before {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                top: 38%;
                height: 10%;
                background: linear-gradient(to bottom, rgba(88, 92, 58, 0.65), rgba(55, 58, 38, 0.88));
                clip-path: polygon(0 100%, 18% 35%, 42% 65%, 66% 28%, 88% 55%, 100% 42%, 100% 100%);
            }

            /* P3: Marina Duplex - Puerto Banús sunset terrace */
            .pimg-3 {
                background:
                    radial-gradient(ellipse 380px 200px at 58% 28%, rgba(255, 228, 180, 0.68) 0%, transparent 70%),
                    radial-gradient(ellipse 240px 120px at 58% 28%, rgba(255, 255, 220, 0.75) 0%, transparent 50%),
                    linear-gradient(to bottom,
                        #263a52 0%, #7a5450 16%, #c87248 30%, #e69058 44%,
                        #4a687e 58%, #2a3a4e 72%, #152238 90%, #060a18 100%);
            }

            .pimg-3::before {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                top: 58%;
                height: 2%;
                background: linear-gradient(to right, transparent, rgba(255, 200, 140, 0.9), rgba(255, 175, 115, 0.7), transparent);
            }

            .pimg-3::after {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                bottom: 0;
                height: 36%;
                background: linear-gradient(to bottom,
                        rgba(215, 198, 172, 0.92) 0%, rgba(170, 150, 120, 1) 40%, rgba(92, 74, 50, 1) 100%);
            }

            /* P4: Beach Club Residence - wide featured */
            .pimg-4 {
                background:
                    radial-gradient(ellipse 50% 70% at 30% 0%, rgba(100, 140, 170, 0.5), transparent 70%),
                    linear-gradient(to bottom,
                        #6a8aa0 0%, #a8c0ce 22%, #d4dfde 42%,
                        #c8bfa8 58%, #8aa2b4 78%, #446478 100%);
            }

            .pimg-4::before {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                top: 48%;
                height: 6%;
                background: linear-gradient(to bottom, rgba(60, 95, 118, 0.6), rgba(40, 65, 82, 0.85));
            }

            .pimg-4::after {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                bottom: 0;
                height: 44%;
                background:
                    radial-gradient(ellipse 80% 100% at 50% 60%, rgba(240, 232, 212, 0.7), transparent 70%),
                    linear-gradient(to bottom,
                        rgba(200, 190, 168, 0.95) 0%, rgba(168, 150, 120, 0.98) 50%, rgba(92, 75, 50, 1) 100%);
            }

            /* P5: Modern Estate - Nueva Andalucía */
            .pimg-5 {
                background:
                    radial-gradient(ellipse 300px 180px at 55% 22%, rgba(255, 248, 228, 0.5) 0%, transparent 65%),
                    linear-gradient(to bottom,
                        #aec0c8 0%, #c8d0cc 20%, #d8ccb0 38%, #7e8a78 56%,
                        #4a6476 72%, #284860 88%, #10202e 100%);
            }

            .pimg-5::before {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                top: 36%;
                height: 10%;
                background: linear-gradient(to bottom, rgba(80, 92, 108, 0.55), rgba(48, 60, 75, 0.82));
                clip-path: polygon(0 85%, 14% 32%, 26% 60%, 40% 22%, 54% 55%, 68% 28%, 82% 50%, 94% 32%, 100% 42%, 100% 100%, 0 100%);
            }

            .pimg-5::after {
                content: '';
                position: absolute;
                left: 6%;
                right: 6%;
                bottom: 18%;
                height: 28%;
                background: linear-gradient(to bottom, rgba(6, 4, 2, 0.94), rgba(2, 1, 1, 1));
                clip-path: polygon(0 52%, 18% 52%, 18% 14%, 42% 14%, 42% 0, 74% 0, 74% 52%, 100% 52%, 100% 100%, 0 100%);
            }

            /* P6: Contemporary Penthouse - El Paraíso */
            .pimg-6 {
                background:
                    radial-gradient(ellipse 280px 160px at 62% 28%, rgba(255, 222, 188, 0.55) 0%, transparent 65%),
                    linear-gradient(to bottom,
                        #4a5878 0%, #8a6050 18%, #c87048 34%, #d87848 48%,
                        #7a5a58 64%, #3a4058 80%, #101825 100%);
            }

            .pimg-6::before {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                top: 60%;
                height: 2%;
                background: linear-gradient(to right, transparent, rgba(255, 195, 140, 0.85), transparent);
            }

            .pimg-6::after {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                bottom: 0;
                height: 32%;
                background: linear-gradient(to bottom,
                        rgba(212, 198, 170, 0.9) 0%, rgba(168, 148, 118, 0.98) 45%, rgba(82, 65, 42, 1) 100%);
            }

            .properties-footer {
                max-width: 1640px;
                margin: 80px auto 0 auto;
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding-top: 48px;
                border-top: 1px solid var(--line);
            }

            .properties-footer-note {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 16px;
                color: var(--muted);
                max-width: 40ch;
                line-height: 1.5;
            }

            .btn-outline {
                display: inline-flex;
                align-items: center;
                gap: 12px;
                padding: 18px 32px;
                border: 1px solid var(--ink);
                border-radius: 100px;
                font-size: 11px;
                letter-spacing: 0.22em;
                text-transform: uppercase;
                font-weight: 500;
                transition: background 0.35s, color 0.35s;
            }

            .btn-outline:hover {
                background: var(--ink);
                color: var(--paper);
            }

            /* ============================== NEIGHBORHOODS ============================== */
            .neighborhoods {
                padding: 160px 48px;
                background: var(--paper-2);
                position: relative;
            }

            .nbh-head {
                max-width: 1640px;
                margin: 0 auto 80px auto;
                display: grid;
                grid-template-columns: 1fr 1.2fr;
                gap: 80px;
                align-items: end;
            }

            .nbh-head h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(48px, 5.5vw, 88px);
                line-height: 0.96;
                letter-spacing: -0.035em;
                margin-top: 24px;
            }

            .nbh-head h2 em {
                font-style: italic;
            }

            .nbh-head p {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 20px;
                line-height: 1.55;
                color: var(--muted);
                max-width: 500px;
            }

            .nbh-grid {
                max-width: 1640px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: repeat(4, 1fr);
                gap: 1px;
                background: var(--line-strong);
                border: 1px solid var(--line-strong);
            }

            .nbh-cell {
                background: var(--paper-2);
                padding: 44px 32px 36px 32px;
                min-height: 260px;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                transition: background 0.4s;
                position: relative;
            }

            .nbh-cell:hover {
                background: var(--paper);
            }

            .nbh-cell-num {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 13px;
                color: var(--muted-2);
                letter-spacing: 0.02em;
            }

            .nbh-cell h3 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 32px;
                line-height: 1.05;
                letter-spacing: -0.02em;
                margin: 48px 0 12px 0;
            }

            .nbh-cell h3 em {
                font-style: italic;
            }

            .nbh-cell-desc {
                font-size: 13px;
                color: var(--muted);
                line-height: 1.55;
                max-width: 28ch;
            }

            .nbh-cell-stats {
                display: flex;
                gap: 24px;
                margin-top: 24px;
                font-size: 10px;
                letter-spacing: 0.22em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
            }

            .nbh-cell-stats strong {
                display: block;
                font-family: var(--display);
                font-style: italic;
                font-weight: 300;
                font-size: 22px;
                letter-spacing: -0.01em;
                color: var(--ink);
                margin-bottom: 4px;
            }

            .nbh-cell-tag {
                margin-top: 20px;
                font-family: var(--editorial);
                font-style: italic;
                font-size: 13px;
                color: var(--cognac);
                letter-spacing: 0.02em;
                padding-top: 16px;
                border-top: 1px solid var(--line);
            }

            .nbh-cell-arr {
                position: absolute;
                top: 44px;
                right: 32px;
                font-size: 18px;
                color: var(--muted-2);
                transition: transform 0.4s, color 0.3s;
            }

            .nbh-cell:hover .nbh-cell-arr {
                transform: translateX(4px);
                color: var(--cognac);
            }

            /* ============================== TEAM ============================== */
            .team {
                padding: 180px 48px;
                background: var(--paper);
            }

            .team-head {
                max-width: 1640px;
                margin: 0 auto 100px auto;
                display: grid;
                grid-template-columns: 1fr 1.4fr;
                gap: 80px;
                align-items: start;
            }

            .team-head h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(52px, 6vw, 96px);
                line-height: 0.95;
                letter-spacing: -0.035em;
                margin-top: 24px;
            }

            .team-head h2 em {
                font-style: italic;
            }

            .team-head-body {
                font-size: 17px;
                line-height: 1.7;
                color: var(--muted);
                max-width: 56ch;
                margin-top: 24px;
            }

            .team-grid {
                max-width: 1640px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: repeat(4, 1fr);
                gap: 40px;
            }

            .team-grid.team-solo {
                grid-template-columns: 1fr;
                max-width: 1200px;
                gap: 0;
            }

            .team-solo .member {
                display: grid;
                grid-template-columns: 1fr 1.5fr;
                gap: 80px;
                align-items: center;
            }

            .team-solo .member .portrait {
                aspect-ratio: 3/4;
                margin-bottom: 0;
            }

            .team-solo .member-content {
                display: flex;
                flex-direction: column;
            }

            .team-solo .member h3 {
                font-size: 56px;
                font-weight: 200;
                margin-bottom: 24px;
                line-height: 0.95;
            }

            .team-solo .member-role {
                font-size: 11px;
                margin-bottom: 16px;
            }

            .team-solo .member-bio {
                font-size: 18px;
                line-height: 1.65;
                max-width: 52ch;
                color: var(--muted);
                margin-bottom: 32px;
            }

            .team-solo .member-meta {
                font-size: 13px;
                gap: 12px;
                padding-top: 28px;
                border-top: 1px solid var(--line);
            }

            .member .portrait {
                position: relative;
                aspect-ratio: 3/4;
                overflow: hidden;
                margin-bottom: 28px;
                background: var(--paper-3);
            }

            .member .portrait::after {
                content: '';
                position: absolute;
                inset: 0;
                background: linear-gradient(to bottom, transparent 50%, rgba(10, 10, 8, 0.25) 100%);
            }

            /* Portrait SVG-stylized compositions */
            .p-portrait-1 {
                background:
                    radial-gradient(ellipse 55% 50% at 50% 35%, rgba(200, 175, 145, 0.95), rgba(150, 118, 85, 0.8) 55%, rgba(80, 55, 30, 0.9) 90%),
                    linear-gradient(to bottom, #d4c4a8 0%, #a88862 30%, #4a3420 70%, #1a1008 100%);
            }

            .p-portrait-1::before {
                content: '';
                position: absolute;
                left: 25%;
                right: 25%;
                top: 18%;
                bottom: 30%;
                background:
                    radial-gradient(ellipse 60% 70% at 50% 35%, rgba(230, 200, 170, 0.95), transparent 68%);
                filter: blur(2px);
            }

            .p-portrait-1::after {
                content: '';
                position: absolute;
                left: 15%;
                right: 15%;
                bottom: 0;
                height: 42%;
                background: linear-gradient(to bottom, rgba(40, 28, 18, 0.9) 0%, rgba(15, 10, 6, 1) 100%);
                clip-path: polygon(25% 0, 75% 0, 95% 100%, 5% 100%);
            }

            .p-portrait-2 {
                background:
                    radial-gradient(ellipse 55% 50% at 50% 35%, rgba(195, 168, 140, 0.95), rgba(128, 98, 72, 0.85) 55%, rgba(50, 32, 18, 0.95) 92%),
                    linear-gradient(to bottom, #c8b498 0%, #8a6a48 32%, #3a2818 72%, #120b04 100%);
            }

            .p-portrait-2::before {
                content: '';
                position: absolute;
                left: 28%;
                right: 28%;
                top: 20%;
                bottom: 32%;
                background: radial-gradient(ellipse 60% 70% at 50% 35%, rgba(215, 185, 155, 0.95), transparent 68%);
                filter: blur(2px);
            }

            .p-portrait-2::after {
                content: '';
                position: absolute;
                left: 12%;
                right: 12%;
                bottom: 0;
                height: 40%;
                background: linear-gradient(to bottom, rgba(180, 148, 108, 0.9), rgba(110, 82, 50, 1) 60%, rgba(50, 35, 18, 1) 100%);
                clip-path: polygon(22% 0, 78% 0, 96% 100%, 4% 100%);
            }

            .p-portrait-3 {
                background:
                    radial-gradient(ellipse 55% 50% at 50% 35%, rgba(210, 180, 152, 0.95), rgba(158, 122, 88, 0.85) 55%, rgba(62, 42, 22, 0.95) 92%),
                    linear-gradient(to bottom, #d0bea0 0%, #9a7a56 32%, #4a3220 72%, #180e06 100%);
            }

            .p-portrait-3::before {
                content: '';
                position: absolute;
                left: 26%;
                right: 26%;
                top: 18%;
                bottom: 30%;
                background: radial-gradient(ellipse 60% 70% at 50% 35%, rgba(222, 192, 162, 0.95), transparent 68%);
                filter: blur(2px);
            }

            .p-portrait-3::after {
                content: '';
                position: absolute;
                left: 16%;
                right: 16%;
                bottom: 0;
                height: 42%;
                background: linear-gradient(to bottom, rgba(55, 40, 28, 0.92), rgba(22, 14, 8, 1) 100%);
                clip-path: polygon(24% 0, 76% 0, 95% 100%, 5% 100%);
            }

            .p-portrait-4 {
                background:
                    radial-gradient(ellipse 55% 50% at 50% 35%, rgba(188, 160, 132, 0.95), rgba(118, 88, 62, 0.85) 55%, rgba(42, 26, 14, 0.95) 92%),
                    linear-gradient(to bottom, #c0a98a 0%, #7c6040 32%, #2e1e10 72%, #0e0804 100%);
            }

            .p-portrait-4::before {
                content: '';
                position: absolute;
                left: 27%;
                right: 27%;
                top: 20%;
                bottom: 32%;
                background: radial-gradient(ellipse 60% 70% at 50% 35%, rgba(205, 172, 142, 0.95), transparent 68%);
                filter: blur(2px);
            }

            .p-portrait-4::after {
                content: '';
                position: absolute;
                left: 14%;
                right: 14%;
                bottom: 0;
                height: 40%;
                background: linear-gradient(to bottom, rgba(160, 128, 90, 0.88), rgba(92, 68, 42, 1) 55%, rgba(38, 26, 14, 1) 100%);
                clip-path: polygon(24% 0, 76% 0, 94% 100%, 6% 100%);
            }

            .member-role {
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                margin-bottom: 10px;
            }

            .member h3 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 26px;
                line-height: 1.15;
                letter-spacing: -0.015em;
                margin-bottom: 12px;
            }

            .member h3 em {
                font-style: italic;
            }

            .member-bio {
                font-size: 14px;
                color: var(--muted);
                line-height: 1.6;
                margin-bottom: 16px;
                max-width: 32ch;
            }

            .member-meta {
                display: flex;
                flex-direction: column;
                gap: 6px;
                margin-top: 16px;
                padding-top: 16px;
                border-top: 1px solid var(--line);
                font-size: 11px;
                color: var(--muted);
                font-family: var(--editorial);
                font-style: italic;
            }

            .member-meta span strong {
                font-family: var(--body);
                font-style: normal;
                font-weight: 500;
                color: var(--ink);
                letter-spacing: 0.05em;
            }

            /* ============================== JOURNAL ============================== */
            .journal {
                padding: 180px 48px;
                background: var(--ink);
                color: var(--paper);
            }

            .journal-head {
                max-width: 1640px;
                margin: 0 auto 80px auto;
                display: flex;
                justify-content: space-between;
                align-items: flex-end;
                gap: 60px;
            }

            .journal-head h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(52px, 6vw, 96px);
                line-height: 0.95;
                letter-spacing: -0.035em;
                margin-top: 24px;
            }

            .journal-head h2 em {
                font-style: italic;
                color: var(--cognac-light);
            }

            .journal-head .section-label {
                color: var(--cognac-light);
            }

            .journal-head .section-label::before {
                background: var(--cognac-light);
            }

            .journal-head a.btn-outline {
                border-color: var(--paper);
                color: var(--paper);
            }

            .journal-head a.btn-outline:hover {
                background: var(--paper);
                color: var(--ink);
            }

            .journal-grid {
                max-width: 1640px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: 1.4fr 1fr 1fr;
                gap: 40px;
            }

            .article .article-img-wrap {
                position: relative;
                overflow: hidden;
                aspect-ratio: 4/3;
                margin-bottom: 28px;
                background: var(--ink-2);
                border: 1px solid rgba(245, 241, 232, 0.1);
                display: flex;
                align-items: center;
                justify-content: center;
                padding: 32px;
                transition: border-color 0.5s, background 0.5s;
            }

            .article:hover .article-img-wrap {
                border-color: rgba(217, 201, 168, 0.35);
                background: var(--ink-3);
            }

            .article.feature .article-img-wrap {
                aspect-ratio: 5/4;
                padding: 56px;
            }

            /* Subtle texture layer on covers */
            .article .article-img-wrap::before {
                content: '';
                position: absolute;
                inset: 0;
                background:
                    radial-gradient(ellipse 80% 60% at 50% 0%, rgba(217, 201, 168, 0.08), transparent 70%),
                    radial-gradient(ellipse 70% 50% at 50% 100%, rgba(138, 90, 43, 0.06), transparent 70%);
                pointer-events: none;
            }

            /* Hairline corner brackets (editorial chapter-marker feel) */
            .article .article-img-wrap::after {
                content: '';
                position: absolute;
                inset: 20px;
                border: 1px solid rgba(245, 241, 232, 0.08);
                pointer-events: none;
                transition: border-color 0.5s;
            }

            .article:hover .article-img-wrap::after {
                border-color: rgba(217, 201, 168, 0.2);
            }

            /* Cover content */
            .article-cover {
                position: relative;
                z-index: 2;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: space-between;
                text-align: center;
                width: 100%;
                height: 100%;
                padding: 12px 0;
            }

            .article-cover-top {
                display: flex;
                align-items: center;
                gap: 12px;
                font-size: 9px;
                letter-spacing: 0.4em;
                text-transform: uppercase;
                color: rgba(217, 201, 168, 0.85);
                font-weight: 500;
            }

            .article-cover-top::before,
            .article-cover-top::after {
                content: '';
                width: 28px;
                height: 1px;
                background: rgba(217, 201, 168, 0.5);
            }

            .article-cover-title {
                font-family: var(--display);
                font-weight: 200;
                font-style: italic;
                font-size: clamp(22px, 2.4vw, 32px);
                line-height: 1.05;
                letter-spacing: -0.02em;
                color: var(--paper);
                max-width: 16ch;
            }

            .article.feature .article-cover-title {
                font-size: clamp(32px, 3.6vw, 52px);
                max-width: 14ch;
            }

            .article-cover-folio {
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 6px;
                font-size: 9px;
                letter-spacing: 0.35em;
                text-transform: uppercase;
                color: rgba(245, 241, 232, 0.45);
                font-weight: 500;
            }

            .article-cover-folio .ornament {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 16px;
                text-transform: none;
                letter-spacing: 0;
                color: rgba(217, 201, 168, 0.6);
                margin-bottom: 4px;
            }

            .article-tag {
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: var(--cognac-light);
                font-weight: 500;
                display: flex;
                align-items: center;
                gap: 14px;
                margin-bottom: 12px;
            }

            .article-tag::before {
                content: '';
                width: 24px;
                height: 1px;
                background: var(--cognac-light);
            }

            .article h3 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 30px;
                line-height: 1.15;
                letter-spacing: -0.015em;
                margin-bottom: 16px;
                max-width: 26ch;
            }

            .article.feature h3 {
                font-size: 40px;
                max-width: 18ch;
            }

            .article h3 em {
                font-style: italic;
            }

            .article-excerpt {
                font-size: 14px;
                color: rgba(245, 241, 232, 0.65);
                line-height: 1.65;
                max-width: 40ch;
                margin-bottom: 20px;
            }

            .article-meta {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 13px;
                color: rgba(245, 241, 232, 0.5);
                display: flex;
                gap: 16px;
                align-items: center;
            }

            .article-meta .dot {
                opacity: 0.5;
            }

            /* ============================== TRANSACTIONS TICKER ============================== */
            .ticker {
                background: var(--paper);
                color: var(--ink);
                padding: 48px 0 48px 0;
                border-top: 1px solid var(--line);
                border-bottom: 1px solid var(--line);
                overflow: hidden;
                position: relative;
            }

            .ticker-track {
                display: flex;
                gap: 96px;
                animation: ticker-scroll 60s linear infinite;
                white-space: nowrap;
            }

            @keyframes ticker-scroll {
                from {
                    transform: translateX(0);
                }

                to {
                    transform: translateX(-50%);
                }
            }

            .ticker-item {
                display: inline-flex;
                align-items: baseline;
                gap: 20px;
                font-family: var(--display);
                font-weight: 300;
                font-size: 40px;
                letter-spacing: -0.02em;
            }

            .ticker-item em {
                font-style: italic;
                color: var(--cognac);
            }

            .ticker-item span.small {
                font-family: var(--body);
                font-size: 11px;
                font-weight: 500;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: var(--muted);
                align-self: center;
            }

            .ticker-divider {
                align-self: center;
                font-family: var(--editorial);
                font-style: italic;
                font-size: 22px;
                color: var(--muted-2);
            }

            /* ============================== SERVICES ============================== */
            .services {
                padding: 200px 48px;
                background: var(--ink);
                color: var(--paper);
                position: relative;
            }

            .services-head {
                max-width: 1640px;
                margin: 0 auto 100px auto;
                text-align: center;
            }

            .services-head .section-label {
                justify-content: center;
                color: var(--cognac-light);
            }

            .services-head .section-label::before {
                background: var(--cognac-light);
            }

            .services-head h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(56px, 6.5vw, 112px);
                line-height: 0.92;
                letter-spacing: -0.035em;
                margin-top: 28px;
                max-width: 14ch;
                margin-left: auto;
                margin-right: auto;
            }

            .services-head h2 em {
                font-style: italic;
                color: var(--cognac-light);
            }

            .services-grid {
                max-width: 1640px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 1px;
                background: rgba(245, 241, 232, 0.1);
                border: 1px solid rgba(245, 241, 232, 0.1);
            }

            .service-card {
                background: var(--ink);
                padding: 60px 48px 48px 48px;
                min-height: 520px;
                display: flex;
                flex-direction: column;
                position: relative;
                transition: background 0.5s;
            }

            .service-card:hover {
                background: var(--ink-2);
            }

            .service-num {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 15px;
                opacity: 0.5;
            }

            .service-card h3 {
                font-family: var(--display);
                font-weight: 200;
                font-size: 56px;
                line-height: 1;
                letter-spacing: -0.03em;
                margin: 60px 0 24px 0;
            }

            .service-card h3 em {
                font-style: italic;
                color: var(--cognac-light);
            }

            .service-card p {
                font-size: 15px;
                line-height: 1.7;
                color: rgba(245, 241, 232, 0.72);
                max-width: 34ch;
                margin-bottom: 32px;
            }

            .service-proof {
                list-style: none;
                margin-top: auto;
                padding-top: 32px;
                border-top: 1px solid rgba(245, 241, 232, 0.14);
            }

            .service-proof li {
                font-size: 12px;
                color: rgba(245, 241, 232, 0.78);
                padding: 10px 0;
                display: flex;
                align-items: center;
                gap: 12px;
                font-family: var(--editorial);
                font-style: italic;
            }

            .service-proof li::before {
                content: '';
                width: 4px;
                height: 4px;
                background: var(--cognac-light);
                border-radius: 50%;
                flex-shrink: 0;
            }

            .service-arrow {
                position: absolute;
                top: 60px;
                right: 48px;
                font-size: 22px;
                transition: transform 0.4s;
                color: rgba(245, 241, 232, 0.5);
            }

            .service-card:hover .service-arrow {
                transform: translate(4px, -4px);
                color: var(--cognac-light);
            }

            /* ============================== CONTACT ============================== */
            .contact {
                padding: 200px 48px;
                background: var(--paper);
            }

            .contact-inner {
                max-width: 1640px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 100px;
                align-items: start;
            }

            .contact-lead {
                position: sticky;
                top: 120px;
            }

            .contact-headline {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(56px, 6.5vw, 108px);
                line-height: 0.94;
                letter-spacing: -0.035em;
                margin-top: 28px;
            }

            .contact-headline em {
                font-style: italic;
                color: var(--cognac);
            }

            .contact-body {
                margin-top: 36px;
                font-size: 17px;
                line-height: 1.65;
                color: var(--muted);
                max-width: 48ch;
            }

            .contact-sig {
                margin-top: 48px;
                font-family: var(--editorial);
                font-style: italic;
                font-size: 17px;
                color: var(--ink);
                display: flex;
                align-items: center;
                gap: 20px;
            }

            .contact-sig::before {
                content: '';
                width: 50px;
                height: 1px;
                background: var(--ink);
            }

            .contact-card {
                background: var(--paper-2);
                padding: 56px 48px;
                border: 1px solid var(--line);
                position: relative;
            }

            .contact-card-label {
                font-size: 10px;
                letter-spacing: 0.35em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                margin-bottom: 32px;
                display: flex;
                align-items: center;
                gap: 14px;
            }

            .contact-card-label::before {
                content: '';
                width: 30px;
                height: 1px;
                background: var(--cognac);
            }

            .contact-form-row {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 24px;
                padding: 24px 0;
                border-bottom: 1px solid var(--line);
            }

            .contact-form-row.full {
                grid-template-columns: 1fr;
            }

            .field-label {
                font-size: 10px;
                letter-spacing: 0.28em;
                text-transform: uppercase;
                color: var(--muted);
                font-weight: 500;
                margin-bottom: 10px;
            }

            .field-value {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 17px;
                color: var(--ink);
                line-height: 1.4;
            }

            .field-value a {
                border-bottom: 1px solid transparent;
                transition: border-color 0.3s;
            }

            .field-value a:hover {
                border-color: var(--ink);
            }

            .contact-info-grid {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 32px 40px;
                padding: 40px 0;
                border-top: 1px solid var(--line);
                border-bottom: 1px solid var(--line);
                margin-top: 40px;
            }

            .contact-info-item h4 {
                font-size: 10px;
                letter-spacing: 0.28em;
                text-transform: uppercase;
                color: var(--muted);
                font-weight: 500;
                margin-bottom: 10px;
            }

            .contact-info-item p {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 16px;
                color: var(--ink);
                line-height: 1.4;
            }

            .contact-buttons {
                display: flex;
                gap: 14px;
                margin-top: 40px;
            }



            .contact-note {
                margin-top: 28px;
                font-size: 13px;
                color: var(--muted-2);
                font-family: var(--editorial);
                font-style: italic;
                text-align: center;
            }

            /* ============================== FOOTER ============================== */
            footer {
                background: var(--ink);
                color: var(--paper);
                padding: 120px 48px 48px 48px;
                position: relative;
                overflow: hidden;
            }

            .footer-top {
                max-width: 1640px;
                margin: 0 auto 100px auto;
                display: grid;
                grid-template-columns: 2.5fr 1fr 1fr 1fr 1fr;
                gap: 60px;
                padding-bottom: 80px;
                border-bottom: 1px solid rgba(245, 241, 232, 0.14);
                position: relative;
                z-index: 2;
            }

            .footer-brand {
                display: flex;
                flex-direction: column;
                gap: 24px;
            }

            .footer-logo {
                font-family: var(--display);
                font-weight: 200;
                font-size: 56px;
                line-height: 1;
                letter-spacing: -0.02em;
                font-style: italic;
            }

            .footer-logo sup {
                font-style: normal;
                font-size: 0.35em;
                letter-spacing: 0.15em;
                vertical-align: super;
                margin: 0 2px;
                opacity: 0.6;
            }

            .footer-tag {
                font-size: 15px;
                color: rgba(245, 241, 232, 0.7);
                max-width: 420px;
                line-height: 1.7;
                font-weight: 300;
            }

            .footer-accred {
                display: flex;
                flex-direction: column;
                gap: 10px;
                margin-top: 16px;
                font-size: 11px;
                color: rgba(245, 241, 232, 0.5);
                letter-spacing: 0.08em;
                font-family: var(--editorial);
                font-style: italic;
            }

            .footer-col h4 {
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                font-weight: 500;
                margin-bottom: 24px;
                color: rgba(245, 241, 232, 0.55);
            }

            .footer-col ul {
                list-style: none;
            }

            .footer-col li {
                margin-bottom: 14px;
            }

            .footer-col a {
                font-size: 14px;
                color: rgba(245, 241, 232, 0.9);
                transition: color 0.3s;
                font-weight: 300;
            }

            .footer-col a:hover {
                color: var(--cognac-light);
            }

            .footer-bottom {
                max-width: 1640px;
                margin: 0 auto;
                display: flex;
                justify-content: space-between;
                align-items: center;
                font-size: 11px;
                color: rgba(245, 241, 232, 0.45);
                letter-spacing: 0.12em;
                position: relative;
                z-index: 2;
                padding-top: 32px;
            }

            .footer-bottom-left,
            .footer-bottom-right {
                display: flex;
                gap: 32px;
                align-items: center;
            }

            .footer-bottom-right a {
                transition: color 0.3s;
            }

            .footer-bottom-right a:hover {
                color: var(--cognac-light);
            }

            .footer-huge {
                font-family: var(--display);
                font-weight: 200;
                font-style: italic;
                font-size: clamp(140px, 25vw, 420px);
                line-height: 0.8;
                letter-spacing: -0.05em;
                color: rgba(245, 241, 232, 0.04);
                position: absolute;
                left: 0;
                right: 0;
                bottom: -60px;
                text-align: center;
                pointer-events: none;
                user-select: none;
                z-index: 1;
            }

            /* ============================== RESPONSIVE ============================== */
            @media (max-width: 1400px) {
                .nav {
                    padding: 20px 32px;
                }

                .nav.scrolled {
                    padding: 13px 32px;
                }

                .nav-left,
                .nav-right {
                    gap: 24px;
                    font-size: 11px;
                    letter-spacing: 0.14em;
                }

                .nav-cta {
                    padding: 9px 18px;
                    font-size: 10.5px;
                }

                .nav-left,
                .nav-right {
                    gap: 18px;
                    font-size: 10.5px;
                    letter-spacing: 0.12em;
                }

            }


            /* ============================================================
           MOBILE NAV SYSTEM — active below 1200px
           Desktop nav (.nav-left, .nav-right links) untouched above 1200px
           ============================================================ */



            /* ── 1. HAMBURGER TOGGLE BUTTON ──────────────────────────── */
            .m-toggle {
                width: 30px;
                height: 30px;
                border-radius: 50%;
                background: transparent;
                cursor: pointer;
                display: none;
                /* shown via breakpoint below */
                align-items: center;
                justify-content: center;
                flex-shrink: 0;
                position: relative;
                z-index: 200;
                /* above drawer */
                transition: border-color 0.3s ease, background 0.3s ease, transform 0.15s ease;
                -webkit-tap-highlight-color: transparent;
            }

            .m-toggle:hover {
                border-color: var(--ink);
                background: rgba(10, 10, 8, .04);
            }

            .m-toggle:active {
                transform: scale(0.93);
            }

            /* SVG icon inside button */
            .m-toggle svg {
                width: 18px;
                height: 18px;
                overflow: visible;
            }

            /*
          Bar morphing strategy:
          - bar-top: slides down 5px + rotates 45°  → forms "/"
          - bar-mid: fades + collapses to 0 width   → disappears
          - bar-bot: slides up 5px + rotates -45°   → forms "\"
          Result: clean X with no extra elements
        */
            .bar-top,
            .bar-mid,
            .bar-bot {
                transform-origin: center;
                transition:
                    transform 0.42s cubic-bezier(0.77, 0, 0.18, 1),
                    opacity 0.30s ease;
            }

            /* Open state triggers from .m-toggle.open via JS */
            .m-toggle.open .bar-top {
                transform: translateY(2px) rotate(45deg);
            }

            .m-toggle.open .bar-mid {
                transform: scaleX(0);
                opacity: 0;
            }

            .m-toggle.open .bar-bot {
                transform: translateY(-4px) rotate(-45deg);
            }


            /* ── 2. BACKDROP OVERLAY ─────────────────────────────────── */
            .m-backdrop {
                position: fixed;
                inset: 0;
                z-index: 130;
                background: rgba(10, 10, 8, 0.55);

                /* Frosted glass blur on the page content behind drawer */
                -webkit-backdrop-filter: blur(4px);
                backdrop-filter: blur(4px);

                opacity: 0;
                pointer-events: none;
                /* Use opacity only — no layout changes = GPU composited */
                transition: opacity 0.45s cubic-bezier(0.4, 0, 0.2, 1);
                will-change: opacity;
            }

            .m-backdrop.open {
                opacity: 1;
                pointer-events: all;
            }


            /* ── 3. FULLSCREEN DRAWER ────────────────────────────────── */
            .m-drawer {
                position: fixed;
                top: 0;
                left: 0;
                right: 0;
                /* Full height but slightly shorter on landscape */
                height: 100dvh;
                /* dvh = dynamic viewport height (handles mobile chrome bar) */

                z-index: 140;
                display: flex;
                flex-direction: column;

                /* Dark elegant background */
                background: var(--ink);
                color: var(--paper);

                padding: 80px 32px 40px 32px;

                /*
            Slide from top — feels more premium than slide-from-right on mobile.
            translateY(-100%) → translateY(0)
            Using transform only = GPU composited, zero layout cost.
          */
                transform: translateY(-100%);
                transition: transform 0.52s cubic-bezier(0.77, 0, 0.18, 1);
                will-change: transform;

                /* Prevents drawer content from being announced by screen readers when closed */
                visibility: hidden;
                transition:
                    transform 0.52s cubic-bezier(0.77, 0, 0.18, 1),
                    visibility 0s linear 0.52s;
                /* delay visibility change until after close animation */
            }

            .m-drawer.open {
                transform: translateY(0);
                visibility: visible;
                transition:
                    transform 0.52s cubic-bezier(0.77, 0, 0.18, 1),
                    visibility 0s linear 0s;
                /* immediately visible on open */
            }

            /* Decorative top-edge accent shimmer */
            .m-drawer::before {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                height: 1px;
                background: linear-gradient(90deg,
                        transparent 0%,
                        rgba(201, 160, 120, 0.45) 35%,
                        rgba(201, 160, 120, 0.45) 65%,
                        transparent 100%);
            }


            /* ── 4. DRAWER HEADER ────────────────────────────────────── */
            .drawer-header {
                padding-bottom: 24px;
                border-bottom: 1px solid rgba(245, 241, 232, 0.1);
                margin-bottom: 4px;
            }

            .drawer-eyebrow {
                font-size: 10px;
                letter-spacing: 0.32em;
                text-transform: uppercase;
                color: var(--cognac-light);
                font-weight: 500;
                display: flex;
                align-items: center;
                gap: 12px;
                margin-bottom: 12px;

                /* Fades in after drawer lands — subtle layered arrival */
                opacity: 0;
                transition: opacity 0.35s ease;
            }

            .drawer-eyebrow::before {
                content: '';
                width: 28px;
                height: 1px;
                background: var(--cognac-light);
                flex-shrink: 0;
            }

            .m-drawer.open .drawer-eyebrow {
                opacity: 1;
                transition-delay: 0.35s;
            }

            .drawer-tagline {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 18px;
                line-height: 1.35;
                color: rgba(245, 241, 232, 0.45);
                letter-spacing: -0.01em;

                opacity: 0;
                transform: translateY(10px);
                transition: opacity 0.4s ease, transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            }

            .m-drawer.open .drawer-tagline {
                opacity: 1;
                transform: translateY(0);
                transition-delay: 0.40s;
            }


            /* ── 5. NAV LINKS WITH STAGGER ───────────────────────────── */
            .drawer-nav {
                flex: 1;
                display: flex;
                flex-direction: column;
                justify-content: center;
                gap: 0;
                padding: 4px 0;
            }

            .drawer-link {
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding: 15px 0;
                border-bottom: 1px solid rgba(245, 241, 232, 0.07);
                font-family: var(--editorial);
                font-style: italic;
                font-weight: 300;
                font-size: 24px;
                letter-spacing: -0.02em;
                line-height: 1;
                color: var(--paper);
                text-decoration: none;
                cursor: pointer;
                -webkit-tap-highlight-color: transparent;

                /*
            Initial state: invisible + pushed down 20px.
            JS assigns individual transition-delay per item for stagger effect.
            Exit: delays removed → all collapse simultaneously (feels snappier).
          */
                opacity: 0;
                transform: translateY(20px);
                transition:
                    opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                    transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                    color 0.25s ease;
            }

            .m-drawer.open .drawer-link {
                opacity: 1;
                transform: translateY(0);
            }

            /* Hover / tap state */
            .drawer-link:hover {
                color: var(--cognac-light);
            }

            .drawer-link:active {
                opacity: 0.7;
            }

            /* Arrow indicator */
            .drawer-link .link-num {
                font-family: var(--body);
                font-style: normal;
                font-size: 11px;
                letter-spacing: 0.1em;
                color: rgba(245, 241, 232, 0.22);
                font-weight: 500;
                flex-shrink: 0;
                transition: color 0.25s, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            }

            .drawer-link:hover .link-num {
                color: var(--cognac-light);
                transform: translateX(4px);
            }


            /* ── 6. DRAWER FOOTER ────────────────────────────────────── */
            .drawer-footer {
                padding-top: 24px;
                border-top: 1px solid rgba(245, 241, 232, 0.1);
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 16px;
                flex-wrap: wrap;

                opacity: 0;
                transition: opacity 0.4s ease;
            }

            .m-drawer.open .drawer-footer {
                opacity: 1;
                transition-delay: 0.6s;
            }

            /* CTA pill */
            .drawer-cta {
                padding: 13px 24px;
                border: 1px solid rgba(245, 241, 232, 0.28);
                border-radius: 100px;
                font-family: var(--body);
                font-size: 10px;
                letter-spacing: 0.22em;
                text-transform: uppercase;
                font-weight: 500;
                color: var(--paper);
                text-decoration: none;
                cursor: pointer;
                background: transparent;
                transition: background 0.3s ease, border-color 0.3s ease;
                -webkit-tap-highlight-color: transparent;
            }

            .drawer-cta:hover {
                background: rgba(245, 241, 232, 0.08);
                border-color: rgba(245, 241, 232, 0.5);
            }

            .drawer-cta:active {
                opacity: 0.75;
            }

            /* Language pill */
            .drawer-lang {
                display: flex;
                align-items: center;
                gap: 8px;
                font-size: 11px;
                letter-spacing: 0.22em;
                color: rgba(245, 241, 232, 0.45);
                font-weight: 500;
                cursor: pointer;
                -webkit-tap-highlight-color: transparent;
                transition: color 0.25s;
            }

            .drawer-lang:hover {
                color: rgba(245, 241, 232, 0.75);
            }

            .drawer-lang .ldot {
                width: 5px;
                height: 5px;
                border-radius: 50%;
                background: var(--cognac-light);
                flex-shrink: 0;
            }


            /* ── 7. SCROLL LOCK ──────────────────────────────────────── */
            /*
          Applied to <body> via JS when menu opens.
          Uses padding-right to compensate for scrollbar width
          so the page doesn't jump when overflow is hidden.
        */
            body.nav-open {
                overflow: hidden;
                /* compensate for scrollbar width — set via JS */
            }



            /* ── 8. BREAKPOINT — show toggle below 1200px ────────────── */
            @media (max-width: 1200px) {

                /* Show the toggle button */
                .m-toggle {
                    display: flex;
                }

                /* Hide existing desktop-only nav items */
                .nav-left {
                    display: none !important;
                }

                .nav-right>a {
                    display: none !important;
                }

                .nav-right .nav-cta {
                    display: none !important;
                }

                .lang-switch {
                    display: none !important;
                }

                /* Clean up old mobile menu if still present */
                .mobile-menu,
                .mobile-toggle {
                    display: none !important;
                }
            }

            /* Fine-tune padding on smaller phones */
            @media (max-width: 480px) {
                .m-drawer {
                    padding: 72px 24px 32px 24px;
                }

                .drawer-link {
                    font-size: 21px;
                    padding: 13px 0;
                }
            }

            /* Landscape phones — reduce vertical spacing */
            @media (max-height: 500px) and (orientation: landscape) {
                .m-drawer {
                    padding: 68px 32px 20px 32px;
                    overflow-y: scroll;
                }

                .drawer-nav {
                    justify-content: flex-start;
                    gap: 0;
                    padding-top: 8px;
                }

                .drawer-link {
                    font-size: 18px;
                    padding: 9px 0;
                }

                .drawer-header {
                    padding-bottom: 12px;
                    margin-bottom: 0;
                }
            }

            /* end mobile menu */

            @media (max-width: 1200px) {

                .nav-left,
                .nav-right {
                    gap: 18px;
                    font-size: 10.5px;
                    letter-spacing: 0.12em;
                }

                .nav-logo {
                    font-size: 22px;
                }

                .lang-switch {
                    padding: 7px 10px;
                    font-size: 10px;
                }

                .nav-cta {
                    padding: 8px 14px;
                    font-size: 10px;
                    letter-spacing: 0.14em;
                }

            }

            @media (max-width: 1024px) {

                /* Tablet: drop Neighbourhoods (longest word) + Journal, keep Properties + Team */
                .nav {
                    padding: 16px 24px;
                }

                .nav.scrolled {
                    padding: 12px 24px;
                }

            }

            @media (max-width: 1280px) {
                .property-grid {
                    grid-template-columns: repeat(4, 1fr);
                }

                .property.wide {
                    grid-column: span 2;
                }

                .property.narrow {
                    grid-column: span 2;
                }

                .property.full {
                    grid-column: span 4;
                }

                .nbh-grid {
                    grid-template-columns: repeat(2, 1fr);
                }

                .stats-band-grid {
                    grid-template-columns: repeat(2, 1fr);
                }

                .stat-cell {
                    border-right: none;
                    padding-right: 0;
                    padding-left: 0 !important;
                    padding-top: 48px;
                    padding-bottom: 48px;
                    border-bottom: 1px solid rgba(245, 241, 232, 0.14);
                }

                .team-grid {
                    grid-template-columns: repeat(2, 1fr);
                    gap: 48px;
                }

                .footer-top {
                    grid-template-columns: 2fr 1fr 1fr;
                    gap: 48px;
                }
            }

            @media (max-width: 900px) {

                .nav {
                    padding: 16px 20px;
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                }

                .nav.scrolled {
                    padding: 12px 20px;
                }

                .nav-left {
                    display: none;
                }

                .nav-right {
                    display: flex;
                    gap: 8px;
                    align-items: center;
                }

                .nav-right a {
                    display: none;
                }

                .nav-right .lang-switch {
                    display: none;
                }

                .nav-logo {
                    font-size: 20px;
                }

                .menu-toggle {
                    display: flex;
                    flex-direction: column;
                    gap: 5px;
                    padding: 8px;
                }

                .menu-toggle span {
                    width: 22px;
                    height: 1.5px;
                    background: currentColor;
                    display: block;
                }

                /* Hero: stack everything vertically, no absolute positioning overlaps */
                .hero {
                    height: auto;
                    min-height: auto;
                    display: flex;
                    flex-direction: column;
                }

                .hero-top {
                    display: none;
                }

                .hero-mobile-top {
                    display: block;
                    position: relative;
                    z-index: 10;
                    padding: 100px 20px 0 20px;
                }

                .hero-mobile-top .hero-eyebrow {
                    font-size: 10px;
                    letter-spacing: 0.25em;
                    color: rgba(245, 241, 232, 0.85);
                }

                .hero-mobile-top .hero-eyebrow::before {
                    width: 28px;
                }

                .hero-mobile-top .hero-location {
                    font-size: 12px;
                    color: rgba(245, 241, 232, 0.7);
                    margin-top: 10px;
                    font-family: var(--editorial);
                    font-style: italic;
                }

                .hero-eyebrow {
                    font-size: 10px;
                    letter-spacing: 0.25em;
                }

                .hero-eyebrow::before {
                    width: 28px;
                }

                .hero-location {
                    font-size: 12px;
                }

                .hero-content {
                    position: relative;
                    z-index: 10;
                    height: auto;
                    padding: 100px 20px 60px 20px;
                    justify-content: flex-start;
                }

                .hero-headline {
                    font-size: clamp(44px, 13vw, 72px);
                    line-height: 0.96;
                }

                .hero-lede {
                    font-size: 15px;
                    max-width: 100%;
                }

                .hero-bottom {
                    flex-direction: column;
                    align-items: stretch;
                    gap: 24px;
                    margin-top: 36px;
                }

                .hero-actions {
                    flex-direction: column;
                    align-items: stretch;
                    gap: 14px;
                }

                .hero-cta {
                    justify-content: center;
                    padding: 18px 28px;
                }

                .hero-cta-text {
                    justify-content: center;
                }

                .hero-cta-text::before {
                    display: none;
                }

                .hero-corner-br {
                    bottom: 20px;
                    right: 20px;
                    font-size: 11px;
                }

                .hero-scroll {
                    display: none;
                }

                /* Much smaller, positioned tree that doesn't crowd text */
                .hero-palm {
                    width: 170px;
                    height: 200px;
                    right: -10%;
                    top: auto;
                    bottom: 18%;
                    opacity: 0.55;
                }

                /* Press */
                .press {
                    padding: 32px 20px;
                }

                .press-inner {
                    grid-template-columns: 1fr;
                    gap: 20px;
                }

                .press-item {
                    font-size: 18px;
                    gap: 48px;
                }

                .press-track {
                    gap: 48px;
                }

                /* Sections */
                .intro {
                    padding: 80px 20px 60px 20px;
                }

                .intro-inner {
                    grid-template-columns: 1fr;
                    gap: 32px;
                }

                .intro-headline {
                    font-size: clamp(32px, 8vw, 48px);
                }

                .intro-body {
                    grid-template-columns: 1fr;
                    gap: 16px;
                    font-size: 15px;
                }

                .intro-signature {
                    font-size: 16px;
                    margin-top: 40px;
                }

                .marque-type {
                    padding: 48px 20px 32px 20px;
                }

                .marque-type .word {
                    font-size: clamp(72px, 22vw, 120px);
                }

                .marque-type .sub {
                    font-size: 15px;
                }

                .stats-band {
                    padding: 80px 20px;
                }

                .stats-band-head {
                    flex-direction: column;
                    gap: 24px;
                    align-items: flex-start;
                }

                .stats-band-head h2 {
                    font-size: clamp(32px, 8vw, 44px);
                }

                .stats-band-head .meta {
                    text-align: left;
                }

                .stat-cell {
                    padding: 40px 0;
                }

                .stat-num {
                    font-size: clamp(48px, 14vw, 68px);
                }

                .properties-section {
                    padding: 80px 20px 60px 20px;
                }

                .properties-head {
                    grid-template-columns: 1fr;
                    gap: 24px;
                    align-items: start;
                }

                .properties-head h2 {
                    font-size: clamp(40px, 11vw, 56px);
                }

                .properties-filters {
                    justify-content: flex-start;
                    gap: 6px;
                }

                .filter-chip {
                    padding: 8px 14px;
                    font-size: 10px;
                }

                .property-grid {
                    grid-template-columns: 1fr;
                    gap: 40px 0;
                }

                .property.wide,
                .property.narrow,
                .property.full {
                    grid-column: span 1;
                }

                .property.full .property-img-wrap {
                    aspect-ratio: 4/3;
                }

                .property h3 {
                    font-size: 26px;
                }

                .property-price-overlay {
                    font-size: 22px;
                }

                .properties-footer {
                    flex-direction: column;
                    gap: 28px;
                    align-items: flex-start;
                    padding-top: 40px;
                }

                .neighborhoods {
                    padding: 80px 20px;
                }

                .nbh-head {
                    grid-template-columns: 1fr;
                    gap: 24px;
                }

                .nbh-head h2 {
                    font-size: clamp(36px, 9vw, 52px);
                }

                .nbh-head p {
                    font-size: 17px;
                }

                .nbh-grid {
                    grid-template-columns: 1fr;
                }

                .nbh-cell {
                    min-height: 200px;
                    padding: 36px 24px 32px 24px;
                }

                .nbh-cell h3 {
                    font-size: 28px;
                    margin: 36px 0 10px 0;
                }

                .nbh-cell-arr {
                    top: 36px;
                    right: 24px;
                }

                .team {
                    padding: 80px 20px;
                }

                .team-head {
                    grid-template-columns: 1fr;
                    gap: 24px;
                }

                .team-head h2 {
                    font-size: clamp(40px, 11vw, 56px);
                }

                .team-grid {
                    grid-template-columns: 1fr;
                    gap: 48px;
                }

                .team-grid.team-solo {
                    grid-template-columns: 1fr;
                    gap: 40px;
                }

                .team-solo .member {
                    grid-template-columns: 1fr;
                    gap: 32px;
                }

                .team-solo .member h3 {
                    font-size: 36px;
                    margin-bottom: 16px;
                }

                .team-solo .member-bio {
                    font-size: 15px;
                    margin-bottom: 20px;
                }

                .member h3 {
                    font-size: 24px;
                }

                .journal {
                    padding: 80px 20px;
                }

                .journal-head {
                    flex-direction: column;
                    gap: 24px;
                    align-items: flex-start;
                }

                .journal-head h2 {
                    font-size: clamp(40px, 11vw, 56px);
                }

                .journal-grid {
                    grid-template-columns: 1fr;
                    gap: 40px;
                }

                .article h3 {
                    font-size: 24px;
                }

                .article.feature h3 {
                    font-size: 28px;
                }

                .ticker {
                    padding: 36px 0;
                }

                .ticker-item {
                    font-size: 26px;
                    gap: 12px;
                }

                .ticker-track {
                    gap: 60px;
                }

                .services {
                    padding: 80px 20px;
                }

                .services-head h2 {
                    font-size: clamp(40px, 11vw, 64px);
                }

                .services-grid {
                    grid-template-columns: 1fr;
                }

                .service-card {
                    padding: 44px 28px 36px 28px;
                    min-height: auto;
                }

                .service-card h3 {
                    font-size: 44px;
                    margin: 40px 0 16px 0;
                }

                .service-arrow {
                    top: 44px;
                    right: 28px;
                }

                .contact {
                    padding: 80px 20px;
                }

                .contact-inner {
                    grid-template-columns: 1fr;
                    gap: 40px;
                }

                .contact-lead {
                    position: static;
                }

                .contact-headline {
                    font-size: clamp(40px, 11vw, 64px);
                }

                .contact-body {
                    font-size: 15px;
                }

                .contact-card {
                    padding: 36px 24px;
                }

                .contact-form-row {
                    grid-template-columns: 1fr;
                    gap: 16px;
                    padding: 18px 0;
                }

                .contact-info-grid {
                    grid-template-columns: 1fr 1fr;
                    gap: 24px 20px;
                    padding: 32px 0;
                }

                .contact-info-item p {
                    font-size: 14px;
                }

                .contact-buttons {
                    flex-direction: column;
                }

                footer {
                    padding: 64px 20px 32px;
                }

                .footer-top {
                    grid-template-columns: 1fr 1fr;
                    gap: 32px 20px;
                    padding-bottom: 40px;
                    margin-bottom: 40px;
                }

                .footer-brand {
                    grid-column: span 2;
                }

                .footer-logo {
                    font-size: 44px;
                }

                .footer-tag {
                    font-size: 14px;
                }

                .footer-bottom {
                    flex-direction: column;
                    gap: 12px;
                    text-align: center;
                    padding-top: 20px;
                }

                .footer-bottom-left,
                .footer-bottom-right {
                    flex-direction: column;
                    gap: 8px;
                }

                .footer-huge {
                    font-size: clamp(90px, 35vw, 160px);
                    bottom: -30px;
                }
            }

            @media (max-width: 480px) {
                .contact-info-grid {
                    grid-template-columns: 1fr;
                }
            }
        

/* ========================================= */


            /* BREADCRUMBS */
            .breadcrumbs {
                padding: 110px 48px 20px 48px;
                max-width: 1400px;
                margin: 0 auto;
                display: flex;
                align-items: center;
                gap: 12px;
                font-size: 11px;
                letter-spacing: 0.22em;
                text-transform: uppercase;
                font-weight: 500;
                color: var(--muted-2);
            }

            .breadcrumbs a:hover {
                color: var(--cognac);
            }

            .breadcrumbs .current {
                color: var(--ink);
            }

            .breadcrumbs .sep {
                opacity: 0.4;
            }

            /* PAGE HEADER */
            .page-header {
                padding: 40px 48px 100px 48px;
                max-width: 1400px;
                margin: 0 auto;
            }

            .section-label {
                font-size: 11px;
                letter-spacing: 0.32em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                display: flex;
                align-items: center;
                gap: 14px;
                margin-bottom: 32px;
            }

            .section-label::before {
                content: '';
                width: 40px;
                height: 1px;
                background: var(--cognac);
            }

            .page-title {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(56px, 8vw, 128px);
                line-height: 0.92;
                letter-spacing: -0.035em;
                max-width: 14ch;
            }

            .page-title em {
                font-style: italic;
                color: var(--cognac-deep);
            }

            .page-lede {
                margin-top: 48px;
                font-family: var(--editorial);
                font-style: italic;
                font-size: clamp(22px, 2.2vw, 30px);
                line-height: 1.45;
                color: var(--muted);
                max-width: 50ch;
            }

            /* HERO VISUAL BAR */
            .hero-bar {
                padding: 0 48px;
                max-width: 1400px;
                margin: 0 auto;
            }

            .hero-bar-inner {
                height: 360px;
                background:
                    radial-gradient(ellipse 60% 50% at 65% 35%, rgba(255, 230, 190, 0.55), transparent 65%),
                    radial-gradient(ellipse 120% 70% at 50% 25%, rgba(220, 150, 100, 0.45), transparent 70%),
                    linear-gradient(to bottom,
                        #1e2838 0%, #3c3248 14%, #6a4432 28%, #a46038 42%,
                        #c47240 52%, #a05028 66%, #3a1e10 82%, #080402 100%);
                position: relative;
                overflow: hidden;
            }

            .hero-bar-inner::before {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                top: 42%;
                height: 14%;
                background: linear-gradient(to bottom, rgba(55, 38, 42, 0.55), rgba(20, 14, 16, 0.85));
                clip-path: polygon(0 78%, 12% 50%, 25% 65%, 40% 40%, 55% 58%, 72% 38%, 88% 55%, 100% 48%, 100% 100%, 0 100%);
            }

            .hero-bar-inner::after {
                content: '';
                position: absolute;
                left: 10%;
                right: 10%;
                bottom: 14%;
                height: 38%;
                background: linear-gradient(to bottom, rgba(8, 6, 4, 0.85), rgba(2, 1, 1, 0.98));
                clip-path: polygon(0 40%, 16% 40%, 16% 14%, 42% 14%, 42% 0, 74% 0, 74% 40%, 100% 40%, 100% 100%, 0 100%);
            }

            .hero-bar-label {
                position: absolute;
                bottom: 32px;
                left: 40px;
                z-index: 5;
                color: var(--paper);
                font-family: var(--editorial);
                font-style: italic;
                font-size: 15px;
                letter-spacing: 0.02em;
            }

            .hero-bar-label strong {
                display: block;
                font-family: var(--body);
                font-style: normal;
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                font-weight: 500;
                opacity: 0.75;
                margin-bottom: 6px;
            }

            .hero-bar-stamp {
                position: absolute;
                top: 32px;
                right: 40px;
                z-index: 5;
                color: rgba(245, 241, 232, 0.55);
                font-size: 10px;
                letter-spacing: 0.4em;
                text-transform: uppercase;
                font-weight: 500;
            }

            /* PAGE NAV PILLS */
            .page-nav {
                padding: 60px 48px 20px 48px;
                max-width: 1400px;
                margin: 0 auto;
                display: flex;
                gap: 10px;
                flex-wrap: wrap;
                border-bottom: 1px solid var(--line);
                padding-bottom: 40px;
            }

            .page-nav-pill {
                padding: 10px 20px;
                border: 1px solid var(--line-strong);
                border-radius: 100px;
                font-size: 11px;
                letter-spacing: 0.2em;
                text-transform: uppercase;
                font-weight: 500;
                color: var(--muted);
                transition: all 0.3s;
            }

            .page-nav-pill:hover {
                border-color: var(--ink);
                color: var(--ink);
            }

            .page-nav-pill.current {
                background: var(--ink);
                color: var(--paper);
                border-color: var(--ink);
            }

            /* MAIN BODY */
            .body-wrap {
                padding: 80px 48px 120px 48px;
                max-width: 1400px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: 200px 1fr;
                gap: 80px;
                align-items: start;
            }

            /* STICKY TOC */
            .toc {
                position: sticky;
                top: 120px;
                padding-top: 8px;
            }

            .toc-label {
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                padding-bottom: 16px;
                margin-bottom: 16px;
                border-bottom: 1px solid var(--line);
            }

            .toc ul {
                list-style: none;
            }

            .toc li {
                margin-bottom: 12px;
            }

            .toc a {
                font-size: 13px;
                color: var(--muted);
                line-height: 1.35;
                transition: color 0.3s;
                display: block;
                padding-left: 16px;
                position: relative;
            }

            .toc a::before {
                content: '';
                position: absolute;
                left: 0;
                top: 8px;
                width: 6px;
                height: 1px;
                background: var(--muted-2);
                transition: background 0.3s, width 0.3s;
            }

            .toc a:hover {
                color: var(--ink);
            }

            .toc a:hover::before {
                background: var(--cognac);
                width: 10px;
            }

            /* CONTENT */
            .content h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(32px, 3.6vw, 48px);
                line-height: 1.05;
                letter-spacing: -0.03em;
                margin: 80px 0 24px 0;
                max-width: 24ch;
            }

            .content h2:first-child {
                margin-top: 0;
            }

            .content h2 em {
                font-style: italic;
                color: var(--cognac-deep);
            }

            .content h3 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 26px;
                line-height: 1.2;
                letter-spacing: -0.015em;
                margin: 48px 0 14px 0;
            }

            .content h3 em {
                font-style: italic;
            }

            .content h4 {
                font-size: 11px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                margin: 40px 0 14px 0;
            }

            .content p {
                font-size: 17px;
                line-height: 1.75;
                color: var(--muted);
                max-width: 62ch;
                margin-bottom: 18px;
            }

            .content p strong {
                color: var(--ink);
                font-weight: 500;
            }

            .content .lede {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 22px;
                line-height: 1.5;
                color: var(--ink);
                margin-bottom: 40px;
                max-width: 52ch;
            }

            .content ul {
                list-style: none;
                margin: 16px 0 24px 0;
                max-width: 62ch;
            }

            .content ul li {
                padding: 8px 0 8px 22px;
                position: relative;
                font-size: 16px;
                color: var(--muted);
                line-height: 1.55;
            }

            .content ul li::before {
                content: '';
                position: absolute;
                left: 0;
                top: 17px;
                width: 8px;
                height: 1px;
                background: var(--cognac);
            }

            .content ul li strong {
                color: var(--ink);
                font-weight: 500;
            }

            .content ol {
                counter-reset: step;
                list-style: none;
                margin: 24px 0;
                max-width: 62ch;
                border-top: 1px solid var(--line);
            }

            .content ol li {
                counter-increment: step;
                padding: 20px 0 20px 56px;
                border-bottom: 1px solid var(--line);
                position: relative;
                font-size: 16px;
                color: var(--muted);
                line-height: 1.55;
            }

            .content ol li::before {
                content: counter(step, decimal-leading-zero);
                position: absolute;
                left: 0;
                top: 22px;
                font-family: var(--editorial);
                font-style: italic;
                font-size: 14px;
                color: var(--cognac);
            }

            /* PULLQUOTE */
            .pullquote {
                margin: 64px 0;
                padding: 48px 0;
                border-top: 1px solid var(--line);
                border-bottom: 1px solid var(--line);
                font-family: var(--display);
                font-weight: 200;
                font-style: italic;
                font-size: clamp(28px, 3vw, 40px);
                line-height: 1.25;
                letter-spacing: -0.02em;
                color: var(--ink);
                max-width: 28ch;
            }

            .pullquote::before {
                content: '✦';
                display: block;
                font-size: 14px;
                color: var(--cognac);
                margin-bottom: 24px;
                font-style: normal;
            }

            /* CALLOUT BOX */
            .callout {
                background: var(--paper-2);
                padding: 40px;
                border-left: 2px solid var(--cognac);
                margin: 48px 0;
                max-width: 62ch;
            }

            .callout-label {
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                margin-bottom: 14px;
            }

            .callout h4 {
                font-family: var(--display);
                font-weight: 300;
                font-style: italic;
                font-size: 22px;
                line-height: 1.25;
                color: var(--ink);
                margin: 0 0 14px 0;
                letter-spacing: -0.01em;
                text-transform: none;
            }

            .callout p {
                font-size: 15px;
                line-height: 1.65;
                color: var(--muted);
                max-width: 100%;
                margin: 0;
            }

            .callout p+p {
                margin-top: 12px;
            }

            /* TABLE */
            .content table {
                width: 100%;
                border-collapse: collapse;
                margin: 32px 0;
                font-size: 15px;
                max-width: 62ch;
            }

            .content table th {
                text-align: left;
                padding: 14px 16px;
                background: var(--paper-2);
                font-size: 11px;
                letter-spacing: 0.2em;
                text-transform: uppercase;
                font-weight: 500;
                color: var(--cognac);
                border-bottom: 1px solid var(--line-strong);
            }

            .content table td {
                padding: 14px 16px;
                border-bottom: 1px solid var(--line);
                color: var(--muted);
                vertical-align: top;
            }

            .content table td strong {
                color: var(--ink);
            }

            /* CTA BLOCK */
            .cta-block {
                margin-top: 100px;
                padding: 80px 60px;
                background: var(--ink);
                color: var(--paper);
                position: relative;
                overflow: hidden;
            }

            .cta-block .section-label {
                color: var(--cognac-light);
                margin-bottom: 24px;
            }

            .cta-block .section-label::before {
                background: var(--cognac-light);
            }

            .cta-block h3 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(36px, 4vw, 56px);
                line-height: 1;
                letter-spacing: -0.025em;
                max-width: 18ch;
                margin: 0 0 32px 0;
            }

            .cta-block h3 em {
                font-style: italic;
                color: var(--cognac-light);
            }

            .cta-block p {
                font-size: 17px;
                line-height: 1.6;
                color: rgba(245, 241, 232, 0.7);
                max-width: 52ch;
                margin-bottom: 40px;
            }

            .cta-buttons {
                display: flex;
                gap: 14px;
                flex-wrap: wrap;
            }

ze: clamp(32px, 3.4vw, 48px);
                line-height: 1;
                letter-spacing: -0.025em;
                margin-top: 14px;
            }

            .related-grid {
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 32px;
            }

            .related-card {
                padding: 40px 32px;
                background: var(--paper-2);
                border: 1px solid var(--line);
                transition: all 0.3s;
                display: flex;
                flex-direction: column;
                gap: 16px;
                min-height: 260px;
            }

            .related-card:hover {
                background: var(--paper);
                border-color: var(--cognac-light);
                transform: translateY(-2px);
            }

            .related-num {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 14px;
                color: var(--muted-2);
            }

            .related-card h4 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 28px;
                line-height: 1.1;
                letter-spacing: -0.02em;
                margin-top: 8px;
            }

            .related-card h4 em {
                font-style: italic;
            }

            .related-card p {
                font-size: 14px;
                color: var(--muted);
                line-height: 1.55;
                margin-top: 8px;
            }

            .related-card .arrow {
                margin-top: auto;
                font-size: 20px;
                color: var(--cognac);
                transition: transform 0.3s;
            }

            .related-card:hover .arrow {
                transform: translateX(6px);
            }



            @media (max-width: 1024px) {
                .body-wrap {
                    grid-template-columns: 1fr;
                    gap: 48px;
                    padding: 60px 32px 100px 32px;
                }

                .toc {
                    position: static;
                    padding-bottom: 24px;
                    border-bottom: 1px solid var(--line);
                }

                .toc ul {
                    columns: 2;
                    gap: 24px;
                }

                .related-grid {
                    grid-template-columns: 1fr;
                    gap: 16px;
                }
            }

            @media (max-width: 900px) {

                .breadcrumbs {
                    padding: 100px 20px 12px 20px;
                    gap: 8px;
                    flex-wrap: wrap;
                }

                .page-header {
                    padding: 24px 20px 60px 20px;
                }

                .page-title {
                    font-size: clamp(44px, 12vw, 72px);
                }

                .page-lede {
                    font-size: 19px;
                }

                .hero-bar {
                    padding: 0 20px;
                }

                .hero-bar-inner {
                    height: 240px;
                }


                .body-wrap {
                    padding: 48px 20px 80px 20px;
                }

                .toc ul {
                    columns: 1;
                }

                .content h2 {
                    font-size: clamp(26px, 7vw, 34px);
                    margin: 56px 0 18px 0;
                }

                .content h3 {
                    font-size: 22px;
                }

                .content p,
                .content ul li,
                .content ol li {
                    font-size: 15px;
                }

                .content .lede {
                    font-size: 19px;
                }

                .content table {
                    font-size: 14px;
                    display: block;
                    overflow-x: auto;
                }

                .content table th,
                .content table td {
                    padding: 12px;
                }

                .cta-block {
                    padding: 60px 28px;
                }

                .cta-block h3 {
                    font-size: clamp(28px, 8vw, 36px);
                }

                .pullquote {
                    font-size: clamp(22px, 6vw, 28px);
                    padding: 36px 0;
                    margin: 48px 0;
                }

                .callout {
                    padding: 28px;
                }

                .related {
                    padding: 60px 20px;
                }

            }
        

/* ========================================= */


        /* RELATED */
        .related {
            padding: 100px 48px;
            max-width: 1400px;
            margin: 0 auto;
            border-top: 1px solid var(--line);
        }

        .related-head {
            margin-bottom: 48px;
        }

        .related-head h3 {
            font-family: var(--display);
            font-weight: 200;
            font-style: italic;
            font-size: clamp(32px, 3.4vw, 48px);
            line-height: 1;
            letter-spacing: -0.025em;
            margin-top: 14px;
        }

        .related-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 32px;
        }

        .related-card {
            padding: 40px 32px;
            background: var(--paper-2);
            border: 1px solid var(--line);
            transition: all 0.3s;
            display: flex;
            flex-direction: column;
            gap: 16px;
            min-height: 260px;
        }

        .related-card:hover {
            background: var(--paper);
            border-color: var(--cognac-light);
            transform: translateY(-2px);
        }

        .related-num {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 14px;
            color: var(--muted-2);
        }

        .related-card h4 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 28px;
            line-height: 1.1;
            letter-spacing: -0.02em;
            margin-top: 8px;
        }

        .related-card h4 em {
            font-style: italic;
        }

        .related-card p {
            font-size: 14px;
            color: var(--muted);
            line-height: 1.55;
            margin-top: 8px;
        }

        .related-card .arrow {
            margin-top: auto;
            font-size: 20px;
            color: var(--cognac);
            transition: transform 0.3s;
        }

        .related-card:hover .arrow {
            transform: translateX(6px);
        }

        /* =========== PROPERTY DETAIL =========== */
        .prop-gallery {
            padding: 100px 32px 0 32px;
            max-width: 1800px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1.8fr 1fr 1fr;
            grid-template-rows: 320px 320px;
            gap: 8px;
        }

        .prop-gallery .img-cell {
            position: relative;
            overflow: hidden;
            cursor: pointer;
            transition: opacity 0.3s;
        }

        .prop-gallery .img-cell:hover {
            opacity: 0.92;
        }

        .prop-gallery .main {
            grid-column: 1 / 2;
            grid-row: 1 / 3;
        }

        .prop-gallery .cell-2 {
            grid-column: 2;
            grid-row: 1;
        }

        .prop-gallery .cell-3 {
            grid-column: 3;
            grid-row: 1;
        }

        .prop-gallery .cell-4 {
            grid-column: 2;
            grid-row: 2;
        }

        .prop-gallery .cell-5 {
            grid-column: 3;
            grid-row: 2;
        }

        .more-overlay {
            position: absolute;
            inset: 0;
            background: rgba(10, 10, 8, 0.55);
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            color: var(--paper);
            font-size: 11px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            font-weight: 500;
            z-index: 2;
        }

        .more-overlay .num {
            font-family: var(--display);
            font-style: italic;
            font-weight: 300;
            font-size: 48px;
            line-height: 1;
            text-transform: none;
            letter-spacing: -0.02em;
            margin-bottom: 12px;
        }

        /* Gradient-mesh imagery for gallery */
        .g-img-1 {
            background:
                radial-gradient(ellipse 70% 50% at 60% 30%, rgba(255, 230, 190, 0.55), transparent 65%),
                radial-gradient(ellipse 120% 70% at 50% 25%, rgba(220, 150, 100, 0.45), transparent 70%),
                linear-gradient(to bottom, #1e2838 0%, #3c3248 14%, #6a4432 28%, #a46038 42%, #c47240 52%, #a05028 66%, #3a1e10 82%, #080402 100%);
        }

        .g-img-1::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 44%;
            height: 12%;
            background: linear-gradient(to bottom, rgba(55, 38, 42, 0.55), rgba(20, 14, 16, 0.85));
            clip-path: polygon(0 78%, 12% 50%, 25% 65%, 40% 40%, 55% 58%, 72% 38%, 88% 55%, 100% 48%, 100% 100%, 0 100%);
        }

        .g-img-1::after {
            content: '';
            position: absolute;
            left: 10%;
            right: 10%;
            bottom: 16%;
            height: 36%;
            background: linear-gradient(to bottom, rgba(8, 6, 4, 0.85), rgba(2, 1, 1, 0.98));
            clip-path: polygon(0 40%, 16% 40%, 16% 14%, 42% 14%, 42% 0, 74% 0, 74% 40%, 100% 40%, 100% 100%, 0 100%);
        }

        .g-img-2 {
            background:
                radial-gradient(ellipse 80% 60% at 50% 30%, rgba(200, 170, 130, 0.55), transparent 70%),
                linear-gradient(to bottom, #b8a080 0%, #8a6848 45%, #4a3420 75%, #1a1008 100%);
        }

        .g-img-3 {
            background:
                radial-gradient(ellipse 80% 60% at 50% 40%, rgba(180, 190, 205, 0.4), transparent 70%),
                linear-gradient(to bottom, #9bb0c0 0%, #6a8aa0 45%, #345468 80%, #12212e 100%);
        }

        .g-img-4 {
            background:
                radial-gradient(ellipse 60% 40% at 50% 40%, rgba(255, 232, 200, 0.45), transparent 70%),
                linear-gradient(to bottom, #d4c4a8 0%, #a88862 35%, #5a3e24 75%, #1a1008 100%);
        }

        .g-img-5 {
            background:
                radial-gradient(ellipse 90% 50% at 50% 0%, rgba(255, 195, 140, 0.45), transparent 65%),
                linear-gradient(to bottom, #4a5a70 0%, #8a5030 35%, #c86840 55%, #3a2012 85%, #080402 100%);
        }

        .prop-gallery-cta {
            position: absolute;
            right: 28px;
            top: 28px;
            z-index: 5;
            padding: 10px 18px;
            background: var(--paper);
            color: var(--ink);
            border-radius: 100px;
            font-size: 10px;
            letter-spacing: 0.25em;
            text-transform: uppercase;
            font-weight: 500;
        }

        .prop-header {
            padding: 60px 32px 40px 32px;
            max-width: 1800px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1.6fr 1fr;
            gap: 80px;
            align-items: end;
            border-bottom: 1px solid var(--line);
        }

        .prop-badge {
            font-size: 11px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            font-weight: 500;
            color: var(--cognac);
            display: flex;
            align-items: center;
            gap: 14px;
            margin-bottom: 24px;
        }

        .prop-badge::before {
            content: '';
            width: 36px;
            height: 1px;
            background: var(--cognac);
        }

        .prop-num {
            color: var(--muted-2);
            font-family: var(--editorial);
            font-style: italic;
            letter-spacing: 0.02em;
            text-transform: none;
            font-size: 13px;
            margin-left: 8px;
        }

        .prop-title {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(48px, 6vw, 92px);
            line-height: 0.95;
            letter-spacing: -0.035em;
            margin-bottom: 18px;
        }

        .prop-title em {
            font-style: italic;
            color: var(--cognac-deep);
        }

        .prop-loc {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 20px;
            color: var(--muted);
        }

        .prop-price-label {
            font-size: 11px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--muted-2);
            font-weight: 500;
            margin-bottom: 14px;
        }

        .prop-price {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(40px, 5vw, 68px);
            line-height: 1;
            letter-spacing: -0.03em;
            color: var(--ink);
        }

        .prop-price em {
            font-style: italic;
            color: var(--cognac);
        }

        .prop-price-note {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 15px;
            color: var(--muted);
            margin-top: 10px;
        }

        .prop-specs {
            padding: 48px 32px;
            max-width: 1800px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(6, 1fr);
            gap: 0;
            border-bottom: 1px solid var(--line);
        }

        .prop-spec {
            padding: 0 28px;
            border-right: 1px solid var(--line);
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .prop-spec:first-child {
            padding-left: 0;
        }

        .prop-spec:last-child {
            border-right: none;
            padding-right: 0;
        }

        .prop-spec-label {
            font-size: 10px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--muted-2);
            font-weight: 500;
        }

        .prop-spec-value {
            font-family: var(--display);
            font-weight: 300;
            font-size: clamp(26px, 2.4vw, 36px);
            line-height: 1;
            letter-spacing: -0.02em;
        }

        .prop-spec-value em {
            font-style: italic;
            color: var(--cognac);
            font-weight: 300;
        }

        .prop-spec-value .unit {
            font-size: 0.55em;
            font-family: var(--body);
            font-weight: 400;
            color: var(--muted);
            letter-spacing: 0.02em;
            margin-left: 2px;
        }

        .prop-body {
            padding: 100px 32px;
            max-width: 1800px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1.6fr 1fr;
            gap: 100px;
            align-items: start;
        }

        .prop-desc p.lede {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 24px;
            line-height: 1.45;
            color: var(--ink);
            margin-bottom: 32px;
            max-width: 52ch;
        }

        .prop-desc p {
            font-size: 17px;
            line-height: 1.75;
            color: var(--muted);
            max-width: 62ch;
            margin-bottom: 18px;
        }

        .prop-features {
            margin-top: 72px;
        }

        .prop-features h3 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 32px;
            letter-spacing: -0.02em;
            margin-bottom: 32px;
        }

        .prop-features h3 em {
            font-style: italic;
        }

        .features-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 32px 48px;
        }

        .feature-cat h4 {
            font-size: 11px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
            margin-bottom: 16px;
            padding-bottom: 14px;
            border-bottom: 1px solid var(--line);
        }

        .feature-cat ul {
            list-style: none;
        }

        .feature-cat li {
            padding: 8px 0;
            font-size: 15px;
            color: var(--muted);
            line-height: 1.5;
            display: flex;
            align-items: start;
            gap: 10px;
        }

        .feature-cat li::before {
            content: '';
            width: 3px;
            height: 3px;
            border-radius: 50%;
            background: var(--cognac-light);
            margin-top: 10px;
            flex-shrink: 0;
        }

        .prop-sidebar {
            position: sticky;
            top: 100px;
        }

        .agent-card {
            background: var(--paper-2);
            padding: 40px 36px;
            border: 1px solid var(--line);
            margin-bottom: 24px;
        }

        .agent-card-label {
            font-size: 10px;
            letter-spacing: 0.35em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
            margin-bottom: 24px;
            display: flex;
            align-items: center;
            gap: 14px;
        }

        .agent-card-label::before {
            content: '';
            width: 30px;
            height: 1px;
            background: var(--cognac);
        }

        .agent-portrait-wrap {
            display: flex;
            gap: 18px;
            align-items: center;
            margin-bottom: 24px;
        }

        .agent-portrait {
            width: 68px;
            height: 68px;
            flex-shrink: 0;
            border-radius: 50%;
            background:
                radial-gradient(ellipse 55% 50% at 50% 35%, rgba(200, 175, 145, 0.95), rgba(150, 118, 85, 0.85) 55%, rgba(80, 55, 30, 0.95) 95%),
                linear-gradient(to bottom, #d4c4a8 0%, #a88862 30%, #4a3420 80%);
            position: relative;
            overflow: hidden;
        }

        .agent-portrait::after {
            content: '';
            position: absolute;
            left: 16%;
            right: 16%;
            bottom: 0;
            height: 42%;
            background: linear-gradient(to bottom, rgba(40, 28, 18, 0.85), rgba(15, 10, 6, 1));
            clip-path: polygon(22% 0, 78% 0, 96% 100%, 4% 100%);
        }

        .agent-info h4 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 22px;
            letter-spacing: -0.015em;
            margin-bottom: 4px;
        }

        .agent-info h4 em {
            font-style: italic;
        }

        .agent-info .role {
            font-size: 10px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--muted-2);
            font-weight: 500;
        }

        .agent-quote {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 15px;
            line-height: 1.55;
            color: var(--muted);
            padding: 20px 0;
            border-top: 1px solid var(--line);
            border-bottom: 1px solid var(--line);
            margin-bottom: 24px;
        }

        .agent-contact-row {
            display: flex;
            flex-direction: column;
            gap: 14px;
            font-size: 14px;
            margin-bottom: 28px;
        }

        .agent-contact-row a {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 10px 0;
            color: var(--ink);
            border-bottom: 1px solid var(--line);
            transition: color 0.3s;
        }

        .agent-contact-row a:hover {
            color: var(--cognac);
        }

        .agent-contact-row a:last-child {
            border-bottom: none;
        }

        .agent-contact-row .lbl {
            font-size: 10px;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            color: var(--muted-2);
            font-weight: 500;
            min-width: 70px;
        }

        .agent-contact-row .val {
            font-family: var(--editorial);
            font-style: italic;
        }

        .agent-ctas {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .btn-inline {
            padding: 16px 24px;
            text-align: center;
            border-radius: 100px;
            font-size: 11px;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            font-weight: 500;
            transition: all 0.3s;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
        }

        .btn-inline.primary {
            background: var(--ink);
            color: var(--paper);
        }

        .btn-inline.primary:hover {
            background: var(--cognac-deep);
        }

        .btn-inline.secondary {
            border: 1px solid var(--ink);
            color: var(--ink);
        }

        .btn-inline.secondary:hover {
            background: var(--ink);
            color: var(--paper);
        }

        /* Map block */
        .prop-map {
            padding: 0 32px 100px 32px;
            max-width: 1800px;
            margin: 0 auto;
        }

        .prop-map-head {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 80px;
            margin-bottom: 40px;
            align-items: end;
        }

        .prop-map-head h3 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(36px, 4vw, 56px);
            line-height: 1;
            letter-spacing: -0.025em;
            margin-top: 20px;
        }

        .prop-map-head h3 em {
            font-style: italic;
        }

        .prop-map-head p {
            font-size: 15px;
            line-height: 1.65;
            color: var(--muted);
            max-width: 48ch;
        }

        .prop-map-visual {
            height: 440px;
            background: var(--paper-2);
            position: relative;
            overflow: hidden;
            border: 1px solid var(--line);
        }

        .map-mesh {
            position: absolute;
            inset: 0;
            background:
                radial-gradient(ellipse 40% 30% at 70% 40%, rgba(138, 90, 43, 0.15), transparent 70%),
                radial-gradient(ellipse 50% 35% at 25% 70%, rgba(200, 170, 130, 0.2), transparent 70%),
                linear-gradient(135deg, #e8dfc6 0%, #d9cfb3 40%, #c8bb9c 100%);
        }

        .map-streets {
            position: absolute;
            inset: 0;
            opacity: 0.25;
            pointer-events: none;
        }

        .map-streets::before {
            content: '';
            position: absolute;
            left: 10%;
            right: 10%;
            top: 40%;
            height: 1px;
            background: linear-gradient(to right, transparent, var(--ink) 20%, var(--ink) 80%, transparent);
        }

        .map-streets::after {
            content: '';
            position: absolute;
            left: 50%;
            top: 15%;
            bottom: 15%;
            width: 1px;
            background: linear-gradient(to bottom, transparent, var(--ink) 20%, var(--ink) 80%, transparent);
        }

        .map-pin {
            position: absolute;
            left: 50%;
            top: 45%;
            transform: translate(-50%, -50%);
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 4px;
            z-index: 2;
        }

        .map-pin .dot {
            width: 14px;
            height: 14px;
            border-radius: 50%;
            background: var(--ink);
            box-shadow: 0 0 0 6px rgba(10, 10, 8, 0.15);
            position: relative;
        }

        .map-pin .dot::after {
            content: '';
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--cognac-light);
        }

        .map-pin .label {
            background: var(--paper);
            padding: 6px 12px;
            font-size: 10px;
            letter-spacing: 0.25em;
            text-transform: uppercase;
            font-weight: 500;
            color: var(--ink);
            margin-top: 10px;
            white-space: nowrap;
        }

        .map-label-float {
            position: absolute;
            padding: 8px 14px;
            background: rgba(245, 241, 232, 0.85);
            backdrop-filter: blur(8px);
            font-family: var(--editorial);
            font-style: italic;
            font-size: 13px;
            color: var(--muted);
            letter-spacing: 0.02em;
            border: 1px solid var(--line);
        }

        .map-label-float.l1 {
            left: 12%;
            top: 22%;
        }

        .map-label-float.l2 {
            right: 14%;
            top: 30%;
        }

        .map-label-float.l3 {
            left: 18%;
            bottom: 20%;
        }

        .map-label-float.l4 {
            right: 20%;
            bottom: 24%;
        }

        /* Similar properties */
        .similar {
            padding: 100px 32px;
            max-width: 1800px;
            margin: 0 auto;
            border-top: 1px solid var(--line);
        }

        .similar-head {
            margin-bottom: 48px;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 80px;
            align-items: end;
        }

        .similar-head h3 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(36px, 4vw, 56px);
            line-height: 1;
            letter-spacing: -0.025em;
            margin-top: 18px;
        }

        .similar-head h3 em {
            font-style: italic;
        }

        .similar-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 32px;
        }

        .similar-card {
            cursor: pointer;
        }

        .similar-card-img {
            position: relative;
            overflow: hidden;
            aspect-ratio: 4/5;
            margin-bottom: 20px;
        }

        .similar-card-img>div {
            position: absolute;
            inset: 0;
            transition: transform 0.9s;
        }

        .similar-card:hover .similar-card-img>div {
            transform: scale(1.04);
        }

        .similar-card-badge {
            position: absolute;
            top: 16px;
            left: 16px;
            z-index: 2;
            padding: 6px 12px;
            background: var(--paper);
            color: var(--ink);
            font-size: 10px;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            font-weight: 500;
        }

        .similar-card-num {
            position: absolute;
            top: 16px;
            right: 16px;
            z-index: 2;
            font-family: var(--editorial);
            font-style: italic;
            font-size: 13px;
            color: rgba(245, 241, 232, 0.85);
        }

        .similar-card-bottom {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            z-index: 2;
            padding: 20px;
            color: var(--paper);
            background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
        }

        .similar-card-price {
            font-family: var(--display);
            font-style: italic;
            font-weight: 300;
            font-size: 24px;
            letter-spacing: -0.01em;
        }

        .similar-card-meta {
            display: flex;
            justify-content: space-between;
            font-size: 10px;
            letter-spacing: 0.25em;
            text-transform: uppercase;
            color: var(--muted);
            margin-bottom: 10px;
            font-weight: 500;
        }

        .similar-card h4 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 24px;
            letter-spacing: -0.015em;
            margin-bottom: 8px;
        }

        .similar-card h4 em {
            font-style: italic;
        }

        .similar-card-specs {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 13px;
            color: var(--muted);
        }

        /* =========== NEIGHBOURHOOD =========== */
        .nbh-hero {
            padding: 110px 32px 0 32px;
            max-width: 1800px;
            margin: 0 auto;
        }

        .nbh-hero-img {
            height: 560px;
            position: relative;
            overflow: hidden;
            background:
                radial-gradient(ellipse 60% 50% at 55% 35%, rgba(255, 230, 190, 0.55), transparent 65%),
                radial-gradient(ellipse 120% 70% at 50% 25%, rgba(220, 150, 100, 0.45), transparent 70%),
                linear-gradient(to bottom, #1e2838 0%, #3c3248 14%, #6a4432 28%, #a46038 42%, #c47240 52%, #a05028 66%, #3a1e10 82%, #080402 100%);
        }

        .nbh-hero-img::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 45%;
            height: 15%;
            background: linear-gradient(to bottom, rgba(55, 38, 42, 0.5), rgba(20, 14, 16, 0.8));
            clip-path: polygon(0 78%, 12% 50%, 25% 65%, 40% 40%, 55% 58%, 72% 38%, 88% 55%, 100% 48%, 100% 100%, 0 100%);
        }

        .nbh-hero-img::after {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            height: 42%;
            background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
        }

        .nbh-hero-overlay {
            position: absolute;
            left: 48px;
            right: 48px;
            bottom: 48px;
            z-index: 5;
            color: var(--paper);
            display: grid;
            grid-template-columns: 2fr 1fr;
            gap: 48px;
            align-items: end;
        }

        .nbh-hero-overlay .section-label {
            color: var(--cognac-light);
            margin-bottom: 20px;
        }

        .nbh-hero-overlay .section-label::before {
            background: var(--cognac-light);
        }

        .nbh-hero-overlay h1 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(52px, 7vw, 112px);
            line-height: 0.92;
            letter-spacing: -0.035em;
        }

        .nbh-hero-overlay h1 em {
            font-style: italic;
            color: var(--cognac-light);
        }

        .nbh-hero-meta {
            display: flex;
            flex-direction: column;
            gap: 16px;
            font-family: var(--editorial);
            font-style: italic;
            font-size: 15px;
            line-height: 1.5;
        }

        .nbh-hero-meta strong {
            display: block;
            font-family: var(--body);
            font-style: normal;
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            font-weight: 500;
            opacity: 0.8;
            margin-bottom: 4px;
        }

        .nbh-hero-stamp {
            position: absolute;
            top: 32px;
            right: 48px;
            z-index: 5;
            color: rgba(245, 241, 232, 0.6);
            font-size: 10px;
            letter-spacing: 0.35em;
            text-transform: uppercase;
            font-weight: 500;
        }

        .nbh-stats {
            padding: 80px 32px;
            max-width: 1800px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            border-bottom: 1px solid var(--line);
        }

        .nbh-stat {
            padding: 0 32px;
            border-right: 1px solid var(--line);
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .nbh-stat:first-child {
            padding-left: 0;
        }

        .nbh-stat:last-child {
            border-right: none;
            padding-right: 0;
        }

        .nbh-stat-label {
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
        }

        .nbh-stat-value {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(36px, 4vw, 56px);
            line-height: 1;
            letter-spacing: -0.025em;
        }

        .nbh-stat-value em {
            font-style: italic;
            color: var(--cognac);
        }

        .nbh-stat-note {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 13px;
            color: var(--muted);
            line-height: 1.45;
        }

        /* Streets list */
        .streets {
            padding: 80px 32px;
            max-width: 1400px;
            margin: 0 auto;
        }

        .streets-head {
            margin-bottom: 48px;
        }

        .streets-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(40px, 4.5vw, 64px);
            line-height: 1;
            letter-spacing: -0.03em;
            margin-top: 18px;
        }

        .streets-head h2 em {
            font-style: italic;
        }

        .streets-list {
            border-top: 1px solid var(--line-strong);
        }

        .street-row {
            padding: 36px 0;
            border-bottom: 1px solid var(--line);
            display: grid;
            grid-template-columns: 80px 2fr 1fr 1fr auto;
            gap: 32px;
            align-items: center;
            transition: padding 0.3s;
        }

        .street-row:hover {
            padding-left: 16px;
        }

        .street-num {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 15px;
            color: var(--muted-2);
        }

        .street-name {
            font-family: var(--display);
            font-weight: 300;
            font-size: 26px;
            letter-spacing: -0.015em;
        }

        .street-name em {
            font-style: italic;
        }

        .street-profile {
            font-size: 13px;
            color: var(--muted);
            line-height: 1.4;
            font-family: var(--editorial);
            font-style: italic;
        }

        .street-range {
            font-family: var(--display);
            font-weight: 300;
            font-style: italic;
            font-size: 18px;
            color: var(--cognac);
            letter-spacing: -0.01em;
        }

        .street-arr {
            font-size: 18px;
            color: var(--muted-2);
            transition: transform 0.3s;
        }

        .street-row:hover .street-arr {
            transform: translateX(6px);
            color: var(--cognac);
        }

        /* =========== ARTICLE =========== */
        .article-header {
            padding: 130px 32px 40px 32px;
            max-width: 820px;
            margin: 0 auto;
            text-align: center;
        }

        .article-tag-pill {
            display: inline-block;
            padding: 8px 16px;
            border: 1px solid var(--cognac);
            border-radius: 100px;
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            font-weight: 500;
            color: var(--cognac);
            margin-bottom: 40px;
        }

        .article-title-main {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(44px, 5.5vw, 84px);
            line-height: 0.95;
            letter-spacing: -0.035em;
            margin-bottom: 32px;
        }

        .article-title-main em {
            font-style: italic;
            color: var(--cognac-deep);
        }

        .article-deck {
            font-family: var(--editorial);
            font-style: italic;
            font-size: clamp(20px, 2vw, 26px);
            line-height: 1.45;
            color: var(--muted);
            max-width: 48ch;
            margin: 0 auto 48px auto;
        }

        .article-byline {
            display: inline-flex;
            align-items: center;
            gap: 16px;
            padding: 20px 0;
            border-top: 1px solid var(--line);
            border-bottom: 1px solid var(--line);
            font-size: 13px;
            color: var(--muted);
            font-family: var(--editorial);
            font-style: italic;
        }

        .article-byline .author {
            color: var(--ink);
            font-weight: 500;
            font-style: normal;
            font-family: var(--body);
            letter-spacing: 0.05em;
        }

        .article-byline .sep {
            opacity: 0.5;
        }

        .article-hero-img {
            padding: 20px 32px 80px 32px;
            max-width: 1400px;
            margin: 0 auto;
        }

        .article-hero-img-inner {
            height: 480px;
            position: relative;
            overflow: hidden;
            background:
                radial-gradient(ellipse 60% 45% at 55% 30%, rgba(255, 230, 190, 0.5), transparent 65%),
                linear-gradient(to bottom, #2a3545 0%, #4a3428 25%, #8a4828 50%, #a45228 70%, #3a1a10 92%, #080402 100%);
        }

        .article-hero-img-inner::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 45%;
            height: 12%;
            background: linear-gradient(to bottom, rgba(55, 38, 42, 0.5), rgba(20, 14, 16, 0.85));
            clip-path: polygon(0 78%, 15% 55%, 30% 70%, 45% 45%, 60% 60%, 75% 40%, 90% 60%, 100% 50%, 100% 100%, 0 100%);
        }

        .article-hero-img-inner::after {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            height: 20%;
            background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
        }

        .article-caption {
            padding: 16px 32px 0 32px;
            max-width: 1400px;
            margin: 0 auto;
            font-family: var(--editorial);
            font-style: italic;
            font-size: 13px;
            color: var(--muted-2);
            letter-spacing: 0.02em;
        }

        .article-body {
            padding: 0 32px 100px 32px;
            max-width: 760px;
            margin: 0 auto;
        }

        .article-body>p:first-of-type::first-letter {
            font-family: var(--display);
            font-style: italic;
            font-weight: 300;
            font-size: 84px;
            line-height: 0.9;
            float: left;
            margin: 4px 14px 0 -4px;
            color: var(--cognac-deep);
        }

        .article-body p {
            font-size: 18px;
            line-height: 1.75;
            color: var(--ink);
            margin-bottom: 22px;
            font-family: 'Geist', sans-serif;
        }

        .article-body h2 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 32px;
            line-height: 1.1;
            letter-spacing: -0.02em;
            margin: 56px 0 20px 0;
        }

        .article-body h2 em {
            font-style: italic;
        }

        .article-body h3 {
            font-family: var(--display);
            font-weight: 400;
            font-size: 22px;
            letter-spacing: -0.01em;
            margin: 40px 0 14px 0;
        }

        .article-body blockquote {
            margin: 48px 0;
            padding: 32px 0 32px 40px;
            border-left: 3px solid var(--cognac);
            font-family: var(--display);
            font-style: italic;
            font-weight: 300;
            font-size: 28px;
            line-height: 1.3;
            letter-spacing: -0.015em;
            color: var(--ink);
        }

        .article-body blockquote cite {
            display: block;
            margin-top: 14px;
            font-family: var(--body);
            font-style: normal;
            font-weight: 500;
            font-size: 12px;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            color: var(--cognac);
        }

        .article-body ul,
        .article-body ol {
            margin: 20px 0 24px 0;
            padding-left: 20px;
        }

        .article-body li {
            margin-bottom: 10px;
            font-size: 17px;
            line-height: 1.65;
            color: var(--ink);
        }

        .article-body .data-strip {
            margin: 48px -40px;
            padding: 40px;
            background: var(--paper-2);
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 32px;
            border-left: 3px solid var(--cognac);
        }

        .data-strip .d-label {
            font-size: 10px;
            letter-spacing: 0.25em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
            margin-bottom: 6px;
        }

        .data-strip .d-value {
            font-family: var(--display);
            font-weight: 300;
            font-size: 36px;
            line-height: 1;
            letter-spacing: -0.02em;
        }

        .data-strip .d-value em {
            font-style: italic;
            color: var(--cognac);
        }

        .data-strip .d-note {
            font-size: 12px;
            color: var(--muted);
            margin-top: 8px;
            font-family: var(--editorial);
            font-style: italic;
        }

        /* =========== ABOUT =========== */
        .about-hero {
            padding: 140px 32px 80px 32px;
            max-width: 1400px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 80px;
            align-items: center;
        }

        .about-hero-copy h1 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(56px, 7vw, 120px);
            line-height: 0.92;
            letter-spacing: -0.035em;
            margin: 24px 0 32px 0;
        }

        .about-hero-copy h1 em {
            font-style: italic;
            color: var(--cognac-deep);
        }

        .about-hero-copy p {
            font-family: var(--editorial);
            font-style: italic;
            font-size: clamp(20px, 2vw, 26px);
            line-height: 1.5;
            color: var(--muted);
            max-width: 46ch;
        }

        .about-portrait {
            aspect-ratio: 4/5;
            position: relative;
            overflow: hidden;
            background:
                radial-gradient(ellipse 55% 50% at 50% 35%, rgba(200, 175, 145, 0.95), rgba(150, 118, 85, 0.85) 55%, rgba(80, 55, 30, 0.95) 95%),
                linear-gradient(to bottom, #d4c4a8 0%, #a88862 30%, #4a3420 70%, #1a1008 100%);
        }

        .about-portrait::before {
            content: '';
            position: absolute;
            left: 25%;
            right: 25%;
            top: 18%;
            bottom: 30%;
            background: radial-gradient(ellipse 60% 70% at 50% 35%, rgba(230, 200, 170, 0.95), transparent 68%);
            filter: blur(2px);
        }

        .about-portrait::after {
            content: '';
            position: absolute;
            left: 15%;
            right: 15%;
            bottom: 0;
            height: 42%;
            background: linear-gradient(to bottom, rgba(40, 28, 18, 0.9), rgba(15, 10, 6, 1));
            clip-path: polygon(25% 0, 75% 0, 95% 100%, 5% 100%);
        }

        .about-philosophy {
            padding: 80px 32px 120px 32px;
            max-width: 1200px;
            margin: 0 auto;
            border-top: 1px solid var(--line);
        }

        .about-philosophy-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(40px, 5vw, 72px);
            line-height: 1;
            letter-spacing: -0.03em;
            margin: 18px 0 48px 0;
            max-width: 20ch;
        }

        .about-philosophy-head h2 em {
            font-style: italic;
            color: var(--cognac-deep);
        }

        .about-philosophy-body {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 64px;
            font-size: 17px;
            line-height: 1.75;
            color: var(--muted);
            max-width: 100%;
        }

        .about-philosophy-body p+p {
            margin-top: 16px;
        }

        /* Timeline */
        .timeline {
            padding: 100px 32px;
            background: var(--ink);
            color: var(--paper);
            position: relative;
            overflow: hidden;
        }

        .timeline-head {
            max-width: 1400px;
            margin: 0 auto 80px auto;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 80px;
            align-items: end;
        }

        .timeline-head .section-label {
            color: var(--cognac-light);
        }

        .timeline-head .section-label::before {
            background: var(--cognac-light);
        }

        .timeline-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(40px, 5vw, 72px);
            line-height: 1;
            letter-spacing: -0.03em;
            margin-top: 20px;
        }

        .timeline-head h2 em {
            font-style: italic;
            color: var(--cognac-light);
        }

        .timeline-head p {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 18px;
            line-height: 1.55;
            color: rgba(245, 241, 232, 0.7);
            max-width: 40ch;
        }

        .timeline-list {
            max-width: 1400px;
            margin: 0 auto;
            border-top: 1px solid rgba(245, 241, 232, 0.14);
        }

        .timeline-row {
            padding: 40px 0;
            border-bottom: 1px solid rgba(245, 241, 232, 0.14);
            display: grid;
            grid-template-columns: 120px 180px 1fr;
            gap: 40px;
            align-items: start;
        }

        .timeline-year {
            font-family: var(--display);
            font-weight: 300;
            font-style: italic;
            font-size: 28px;
            color: var(--cognac-light);
            letter-spacing: -0.01em;
        }

        .timeline-role {
            font-size: 11px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: rgba(245, 241, 232, 0.65);
            font-weight: 500;
            padding-top: 8px;
        }

        .timeline-desc {
            font-size: 16px;
            line-height: 1.6;
            color: rgba(245, 241, 232, 0.88);
            max-width: 62ch;
        }

        .timeline-desc strong {
            color: var(--paper);
            font-weight: 500;
        }

        /* Case studies */
        .cases {
            padding: 120px 32px;
            max-width: 1400px;
            margin: 0 auto;
        }

        .cases-head {
            margin-bottom: 60px;
        }

        .cases-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(40px, 5vw, 72px);
            line-height: 1;
            letter-spacing: -0.03em;
            margin-top: 18px;
        }

        .cases-head h2 em {
            font-style: italic;
        }

        .cases-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 40px;
        }

        .case {
            padding: 48px;
            background: var(--paper-2);
            border: 1px solid var(--line);
            display: flex;
            flex-direction: column;
            gap: 20px;
        }

        .case-meta {
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 10px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
            padding-bottom: 16px;
            border-bottom: 1px solid var(--line);
        }

        .case-value {
            font-family: var(--display);
            font-weight: 200;
            font-size: 48px;
            line-height: 1;
            letter-spacing: -0.03em;
        }

        .case-value em {
            font-style: italic;
            color: var(--cognac);
        }

        .case h3 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 26px;
            letter-spacing: -0.015em;
            line-height: 1.2;
        }

        .case h3 em {
            font-style: italic;
        }

        .case p {
            font-size: 15px;
            line-height: 1.65;
            color: var(--muted);
            max-width: 50ch;
        }

        /* Press */
        .press-wall {
            padding: 100px 32px;
            background: var(--paper-2);
        }

        .press-wall-head {
            max-width: 1400px;
            margin: 0 auto 60px auto;
            text-align: center;
        }

        .press-wall-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(36px, 4.5vw, 64px);
            line-height: 1;
            letter-spacing: -0.03em;
            margin-top: 20px;
            max-width: 18ch;
            margin-left: auto;
            margin-right: auto;
        }

        .press-wall-head h2 em {
            font-style: italic;
            color: var(--cognac);
        }

        .press-wall-head .section-label {
            justify-content: center;
        }

        .press-wall-grid {
            max-width: 1400px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 40px;
        }

        .press-quote {
            padding: 40px 32px;
            background: var(--paper);
            border: 1px solid var(--line);
            display: flex;
            flex-direction: column;
            gap: 18px;
        }

        .press-quote-source {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 22px;
            color: var(--cognac-deep);
            letter-spacing: -0.01em;
        }

        .press-quote-text {
            font-size: 14px;
            line-height: 1.65;
            color: var(--muted);
            font-family: var(--editorial);
            font-style: italic;
        }

        .press-quote-date {
            font-size: 10px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--muted-2);
            font-weight: 500;
            margin-top: auto;
            padding-top: 20px;
            border-top: 1px solid var(--line);
        }

        /* About contact */
        .about-contact {
            padding: 120px 32px;
            background: var(--ink);
            color: var(--paper);
        }

        .about-contact-inner {
            max-width: 1000px;
            margin: 0 auto;
            text-align: center;
        }

        .about-contact h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(48px, 6vw, 96px);
            line-height: 0.95;
            letter-spacing: -0.035em;
            max-width: 16ch;
            margin: 20px auto 32px auto;
        }

        .about-contact h2 em {
            font-style: italic;
            color: var(--cognac-light);
        }

        .about-contact .section-label {
            color: var(--cognac-light);
            justify-content: center;
        }

        .about-contact .section-label::before {
            background: var(--cognac-light);
        }

        .about-contact p {
            font-size: 18px;
            line-height: 1.6;
            color: rgba(245, 241, 232, 0.75);
            max-width: 52ch;
            margin: 0 auto 48px auto;
        }

        /* =========== RESPONSIVE =========== */
        @media (max-width: 1024px) {
            .related-grid {
                grid-template-columns: 1fr;
                gap: 16px;
            }

            .prop-header,
            .prop-body,
            .prop-map-head,
            .similar-head,
            .about-hero,
            .about-philosophy-body {
                grid-template-columns: 1fr;
                gap: 32px;
            }

            .prop-specs,
            .nbh-stats {
                grid-template-columns: repeat(3, 1fr);
                gap: 24px 0;
            }

            .prop-spec:nth-child(3n) {
                border-right: none;
            }

            .prop-spec,
            .nbh-stat {
                padding: 16px;
            }

            .prop-gallery {
                grid-template-columns: 1fr 1fr;
                grid-template-rows: 280px 180px 180px;
            }

            .prop-gallery .main {
                grid-column: 1 / 3;
                grid-row: 1 / 2;
            }

            .prop-gallery .cell-2 {
                grid-column: 1;
                grid-row: 2;
            }

            .prop-gallery .cell-3 {
                grid-column: 2;
                grid-row: 2;
            }

            .prop-gallery .cell-4 {
                grid-column: 1;
                grid-row: 3;
            }

            .prop-gallery .cell-5 {
                grid-column: 2;
                grid-row: 3;
            }

            .similar-grid {
                grid-template-columns: 1fr 1fr;
            }

            .cases-grid {
                grid-template-columns: 1fr;
            }

            .press-wall-grid {
                grid-template-columns: 1fr 1fr;
            }

            .prop-sidebar {
                position: static;
            }

            .nbh-hero-overlay {
                grid-template-columns: 1fr;
                gap: 24px;
            }

            .timeline-row {
                grid-template-columns: 100px 1fr;
            }

            .timeline-role {
                grid-column: 2;
                grid-row: 1;
            }

            .timeline-desc {
                grid-column: 1/-1;
                margin-top: 12px;
            }
        }

        @media (max-width: 900px) {
            .related {
                padding: 60px 20px;
            }

            .prop-gallery,
            .prop-header,
            .prop-specs,
            .prop-body,
            .prop-map,
            .similar,
            .nbh-hero,
            .nbh-stats,
            .streets,
            .article-body,
            .article-header,
            .article-hero-img,
            .about-hero,
            .about-philosophy,
            .cases,
            .press-wall,
            .about-contact,
            .timeline {
                padding-left: 20px;
                padding-right: 20px;
            }

            .prop-specs,
            .nbh-stats {
                grid-template-columns: 1fr 1fr;
            }

            .prop-spec:nth-child(3n) {
                border-right: 1px solid var(--line);
            }

            .prop-spec:nth-child(2n) {
                border-right: none;
            }

            .prop-spec {
                padding: 12px;
            }

            .prop-gallery {
                grid-template-columns: 1fr;
                grid-template-rows: 240px repeat(4, 140px);
                gap: 6px;
            }

            .prop-gallery .main {
                grid-column: 1;
                grid-row: 1;
            }

            .prop-gallery .cell-2 {
                grid-column: 1;
                grid-row: 2;
            }

            .prop-gallery .cell-3 {
                grid-column: 1;
                grid-row: 3;
            }

            .prop-gallery .cell-4 {
                grid-column: 1;
                grid-row: 4;
            }

            .prop-gallery .cell-5 {
                grid-column: 1;
                grid-row: 5;
            }

            .similar-grid,
            .features-grid {
                grid-template-columns: 1fr;
            }

            .nbh-hero-img {
                height: 400px;
            }

            .nbh-hero-overlay {
                left: 20px;
                right: 20px;
                bottom: 20px;
            }

            .nbh-hero-stamp {
                right: 20px;
                top: 24px;
            }

            .press-wall-grid {
                grid-template-columns: 1fr;
            }

            .street-row {
                grid-template-columns: 40px 1fr;
                gap: 12px;
                padding: 24px 0;
            }

            .street-profile,
            .street-range,
            .street-arr {
                grid-column: 2;
            }

            .street-profile {
                grid-row: 2;
                margin-top: 6px;
            }

            .street-range {
                grid-row: 3;
                margin-top: 6px;
            }

            .street-arr {
                display: none;
            }

            .article-body {
                padding: 0 24px 80px 24px;
            }

            .article-body>p:first-of-type::first-letter {
                font-size: 60px;
            }

            .article-body p,
            .article-body li {
                font-size: 16px;
            }

            .article-body blockquote {
                font-size: 22px;
                padding-left: 24px;
                margin: 32px 0;
            }

            .article-body .data-strip {
                grid-template-columns: 1fr;
                margin: 32px 0;
                gap: 24px;
            }
        }
    

/* ========================================= */


        /* =========== PROPERTY DETAIL =========== */
        .prop-gallery {
            padding: 100px 32px 0 32px;
            max-width: 1800px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1.8fr 1fr 1fr;
            grid-template-rows: 320px 320px;
            gap: 8px;
        }

        .prop-gallery .img-cell {
            position: relative;
            overflow: hidden;
            cursor: pointer;
            transition: opacity 0.3s;
        }

        .prop-gallery .img-cell:hover {
            opacity: 0.92;
        }

        .prop-gallery .main {
            grid-column: 1 / 2;
            grid-row: 1 / 3;
        }

        .prop-gallery .cell-2 {
            grid-column: 2;
            grid-row: 1;
        }

        .prop-gallery .cell-3 {
            grid-column: 3;
            grid-row: 1;
        }

        .prop-gallery .cell-4 {
            grid-column: 2;
            grid-row: 2;
        }

        .prop-gallery .cell-5 {
            grid-column: 3;
            grid-row: 2;
        }

        .more-overlay {
            position: absolute;
            inset: 0;
            background: rgba(10, 10, 8, 0.55);
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            color: var(--paper);
            font-size: 11px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            font-weight: 500;
            z-index: 2;
        }

        .more-overlay .num {
            font-family: var(--display);
            font-style: italic;
            font-weight: 300;
            font-size: 48px;
            line-height: 1;
            text-transform: none;
            letter-spacing: -0.02em;
            margin-bottom: 12px;
        }

        /* Gradient-mesh imagery for gallery */
        .g-img-1 {
            background:
                radial-gradient(ellipse 70% 50% at 60% 30%, rgba(255, 230, 190, 0.55), transparent 65%),
                radial-gradient(ellipse 120% 70% at 50% 25%, rgba(220, 150, 100, 0.45), transparent 70%),
                linear-gradient(to bottom, #1e2838 0%, #3c3248 14%, #6a4432 28%, #a46038 42%, #c47240 52%, #a05028 66%, #3a1e10 82%, #080402 100%);
        }

        .g-img-1::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 44%;
            height: 12%;
            background: linear-gradient(to bottom, rgba(55, 38, 42, 0.55), rgba(20, 14, 16, 0.85));
            clip-path: polygon(0 78%, 12% 50%, 25% 65%, 40% 40%, 55% 58%, 72% 38%, 88% 55%, 100% 48%, 100% 100%, 0 100%);
        }

        .g-img-1::after {
            content: '';
            position: absolute;
            left: 10%;
            right: 10%;
            bottom: 16%;
            height: 36%;
            background: linear-gradient(to bottom, rgba(8, 6, 4, 0.85), rgba(2, 1, 1, 0.98));
            clip-path: polygon(0 40%, 16% 40%, 16% 14%, 42% 14%, 42% 0, 74% 0, 74% 40%, 100% 40%, 100% 100%, 0 100%);
        }

        .g-img-2 {
            background:
                radial-gradient(ellipse 80% 60% at 50% 30%, rgba(200, 170, 130, 0.55), transparent 70%),
                linear-gradient(to bottom, #b8a080 0%, #8a6848 45%, #4a3420 75%, #1a1008 100%);
        }

        .g-img-3 {
            background:
                radial-gradient(ellipse 80% 60% at 50% 40%, rgba(180, 190, 205, 0.4), transparent 70%),
                linear-gradient(to bottom, #9bb0c0 0%, #6a8aa0 45%, #345468 80%, #12212e 100%);
        }

        .g-img-4 {
            background:
                radial-gradient(ellipse 60% 40% at 50% 40%, rgba(255, 232, 200, 0.45), transparent 70%),
                linear-gradient(to bottom, #d4c4a8 0%, #a88862 35%, #5a3e24 75%, #1a1008 100%);
        }

        .g-img-5 {
            background:
                radial-gradient(ellipse 90% 50% at 50% 0%, rgba(255, 195, 140, 0.45), transparent 65%),
                linear-gradient(to bottom, #4a5a70 0%, #8a5030 35%, #c86840 55%, #3a2012 85%, #080402 100%);
        }

        .prop-gallery-cta {
            position: absolute;
            right: 28px;
            top: 28px;
            z-index: 5;
            padding: 10px 18px;
            background: var(--paper);
            color: var(--ink);
            border-radius: 100px;
            font-size: 10px;
            letter-spacing: 0.25em;
            text-transform: uppercase;
            font-weight: 500;
        }

        .prop-header {
            padding: 60px 32px 40px 32px;
            max-width: 1800px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1.6fr 1fr;
            gap: 80px;
            align-items: end;
            border-bottom: 1px solid var(--line);
        }

        .prop-badge {
            font-size: 11px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            font-weight: 500;
            color: var(--cognac);
            display: flex;
            align-items: center;
            gap: 14px;
            margin-bottom: 24px;
        }

        .prop-badge::before {
            content: '';
            width: 36px;
            height: 1px;
            background: var(--cognac);
        }

        .prop-num {
            color: var(--muted-2);
            font-family: var(--editorial);
            font-style: italic;
            letter-spacing: 0.02em;
            text-transform: none;
            font-size: 13px;
            margin-left: 8px;
        }

        .prop-title {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(48px, 6vw, 92px);
            line-height: 0.95;
            letter-spacing: -0.035em;
            margin-bottom: 18px;
        }

        .prop-title em {
            font-style: italic;
            color: var(--cognac-deep);
        }

        .prop-loc {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 20px;
            color: var(--muted);
        }

        .prop-price-label {
            font-size: 11px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--muted-2);
            font-weight: 500;
            margin-bottom: 14px;
        }

        .prop-price {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(40px, 5vw, 68px);
            line-height: 1;
            letter-spacing: -0.03em;
            color: var(--ink);
        }

        .prop-price em {
            font-style: italic;
            color: var(--cognac);
        }

        .prop-price-note {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 15px;
            color: var(--muted);
            margin-top: 10px;
        }

        .prop-specs {
            padding: 48px 32px;
            max-width: 1800px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(6, 1fr);
            gap: 0;
            border-bottom: 1px solid var(--line);
        }

        .prop-spec {
            padding: 0 28px;
            border-right: 1px solid var(--line);
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .prop-spec:first-child {
            padding-left: 0;
        }

        .prop-spec:last-child {
            border-right: none;
            padding-right: 0;
        }

        .prop-spec-label {
            font-size: 10px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--muted-2);
            font-weight: 500;
        }

        .prop-spec-value {
            font-family: var(--display);
            font-weight: 300;
            font-size: clamp(26px, 2.4vw, 36px);
            line-height: 1;
            letter-spacing: -0.02em;
        }

        .prop-spec-value em {
            font-style: italic;
            color: var(--cognac);
            font-weight: 300;
        }

        .prop-spec-value .unit {
            font-size: 0.55em;
            font-family: var(--body);
            font-weight: 400;
            color: var(--muted);
            letter-spacing: 0.02em;
            margin-left: 2px;
        }

        .prop-body {
            padding: 100px 32px;
            max-width: 1800px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1.6fr 1fr;
            gap: 100px;
            align-items: start;
        }

        .prop-desc p.lede {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 24px;
            line-height: 1.45;
            color: var(--ink);
            margin-bottom: 32px;
            max-width: 52ch;
        }

        .prop-desc p {
            font-size: 17px;
            line-height: 1.75;
            color: var(--muted);
            max-width: 62ch;
            margin-bottom: 18px;
        }

        .prop-features {
            margin-top: 72px;
        }

        .prop-features h3 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 32px;
            letter-spacing: -0.02em;
            margin-bottom: 32px;
        }

        .prop-features h3 em {
            font-style: italic;
        }

        .features-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 32px 48px;
        }

        .feature-cat h4 {
            font-size: 11px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
            margin-bottom: 16px;
            padding-bottom: 14px;
            border-bottom: 1px solid var(--line);
        }

        .feature-cat ul {
            list-style: none;
        }

        .feature-cat li {
            padding: 8px 0;
            font-size: 15px;
            color: var(--muted);
            line-height: 1.5;
            display: flex;
            align-items: start;
            gap: 10px;
        }

        .feature-cat li::before {
            content: '';
            width: 3px;
            height: 3px;
            border-radius: 50%;
            background: var(--cognac-light);
            margin-top: 10px;
            flex-shrink: 0;
        }

        .prop-sidebar {
            position: sticky;
            top: 100px;
        }

        .agent-card {
            background: var(--paper-2);
            padding: 40px 36px;
            border: 1px solid var(--line);
            margin-bottom: 24px;
        }

        .agent-card-label {
            font-size: 10px;
            letter-spacing: 0.35em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
            margin-bottom: 24px;
            display: flex;
            align-items: center;
            gap: 14px;
        }

        .agent-card-label::before {
            content: '';
            width: 30px;
            height: 1px;
            background: var(--cognac);
        }

        .agent-portrait-wrap {
            display: flex;
            gap: 18px;
            align-items: center;
            margin-bottom: 24px;
        }

        .agent-portrait {
            width: 68px;
            height: 68px;
            flex-shrink: 0;
            border-radius: 50%;
            background:
                radial-gradient(ellipse 55% 50% at 50% 35%, rgba(200, 175, 145, 0.95), rgba(150, 118, 85, 0.85) 55%, rgba(80, 55, 30, 0.95) 95%),
                linear-gradient(to bottom, #d4c4a8 0%, #a88862 30%, #4a3420 80%);
            position: relative;
            overflow: hidden;
        }

        .agent-portrait::after {
            content: '';
            position: absolute;
            left: 16%;
            right: 16%;
            bottom: 0;
            height: 42%;
            background: linear-gradient(to bottom, rgba(40, 28, 18, 0.85), rgba(15, 10, 6, 1));
            clip-path: polygon(22% 0, 78% 0, 96% 100%, 4% 100%);
        }

        .agent-info h4 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 22px;
            letter-spacing: -0.015em;
            margin-bottom: 4px;
        }

        .agent-info h4 em {
            font-style: italic;
        }

        .agent-info .role {
            font-size: 10px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--muted-2);
            font-weight: 500;
        }

        .agent-quote {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 15px;
            line-height: 1.55;
            color: var(--muted);
            padding: 20px 0;
            border-top: 1px solid var(--line);
            border-bottom: 1px solid var(--line);
            margin-bottom: 24px;
        }

        .agent-contact-row {
            display: flex;
            flex-direction: column;
            gap: 14px;
            font-size: 14px;
            margin-bottom: 28px;
        }

        .agent-contact-row a {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 10px 0;
            color: var(--ink);
            border-bottom: 1px solid var(--line);
            transition: color 0.3s;
        }

        .agent-contact-row a:hover {
            color: var(--cognac);
        }

        .agent-contact-row a:last-child {
            border-bottom: none;
        }

        .agent-contact-row .lbl {
            font-size: 10px;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            color: var(--muted-2);
            font-weight: 500;
            min-width: 70px;
        }

        .agent-contact-row .val {
            font-family: var(--editorial);
            font-style: italic;
        }

        .agent-ctas {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .btn-inline {
            padding: 16px 24px;
            text-align: center;
            border-radius: 100px;
            font-size: 11px;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            font-weight: 500;
            transition: all 0.3s;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
        }

        .btn-inline.primary {
            background: var(--ink);
            color: var(--paper);
        }

        .btn-inline.primary:hover {
            background: var(--cognac-deep);
        }

        .btn-inline.secondary {
            border: 1px solid var(--ink);
            color: var(--ink);
        }

        .btn-inline.secondary:hover {
            background: var(--ink);
            color: var(--paper);
        }

        /* Map block */
        .prop-map {
            padding: 0 32px 100px 32px;
            max-width: 1800px;
            margin: 0 auto;
        }

        .prop-map-head {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 80px;
            margin-bottom: 40px;
            align-items: end;
        }

        .prop-map-head h3 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(36px, 4vw, 56px);
            line-height: 1;
            letter-spacing: -0.025em;
            margin-top: 20px;
        }

        .prop-map-head h3 em {
            font-style: italic;
        }

        .prop-map-head p {
            font-size: 15px;
            line-height: 1.65;
            color: var(--muted);
            max-width: 48ch;
        }

        .prop-map-visual {
            height: 440px;
            background: var(--paper-2);
            position: relative;
            overflow: hidden;
            border: 1px solid var(--line);
        }

        .map-mesh {
            position: absolute;
            inset: 0;
            background:
                radial-gradient(ellipse 40% 30% at 70% 40%, rgba(138, 90, 43, 0.15), transparent 70%),
                radial-gradient(ellipse 50% 35% at 25% 70%, rgba(200, 170, 130, 0.2), transparent 70%),
                linear-gradient(135deg, #e8dfc6 0%, #d9cfb3 40%, #c8bb9c 100%);
        }

        .map-streets {
            position: absolute;
            inset: 0;
            opacity: 0.25;
            pointer-events: none;
        }

        .map-streets::before {
            content: '';
            position: absolute;
            left: 10%;
            right: 10%;
            top: 40%;
            height: 1px;
            background: linear-gradient(to right, transparent, var(--ink) 20%, var(--ink) 80%, transparent);
        }

        .map-streets::after {
            content: '';
            position: absolute;
            left: 50%;
            top: 15%;
            bottom: 15%;
            width: 1px;
            background: linear-gradient(to bottom, transparent, var(--ink) 20%, var(--ink) 80%, transparent);
        }

        .map-pin {
            position: absolute;
            left: 50%;
            top: 45%;
            transform: translate(-50%, -50%);
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 4px;
            z-index: 2;
        }

        .map-pin .dot {
            width: 14px;
            height: 14px;
            border-radius: 50%;
            background: var(--ink);
            box-shadow: 0 0 0 6px rgba(10, 10, 8, 0.15);
            position: relative;
        }

        .map-pin .dot::after {
            content: '';
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--cognac-light);
        }

        .map-pin .label {
            background: var(--paper);
            padding: 6px 12px;
            font-size: 10px;
            letter-spacing: 0.25em;
            text-transform: uppercase;
            font-weight: 500;
            color: var(--ink);
            margin-top: 10px;
            white-space: nowrap;
        }

        .map-label-float {
            position: absolute;
            padding: 8px 14px;
            background: rgba(245, 241, 232, 0.85);
            backdrop-filter: blur(8px);
            font-family: var(--editorial);
            font-style: italic;
            font-size: 13px;
            color: var(--muted);
            letter-spacing: 0.02em;
            border: 1px solid var(--line);
        }

        .map-label-float.l1 {
            left: 12%;
            top: 22%;
        }

        .map-label-float.l2 {
            right: 14%;
            top: 30%;
        }

        .map-label-float.l3 {
            left: 18%;
            bottom: 20%;
        }

        .map-label-float.l4 {
            right: 20%;
            bottom: 24%;
        }

        /* Similar properties */
        .similar {
            padding: 100px 32px;
            max-width: 1800px;
            margin: 0 auto;
            border-top: 1px solid var(--line);
        }

        .similar-head {
            margin-bottom: 48px;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 80px;
            align-items: end;
        }

        .similar-head h3 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(36px, 4vw, 56px);
            line-height: 1;
            letter-spacing: -0.025em;
            margin-top: 18px;
        }

        .similar-head h3 em {
            font-style: italic;
        }

        .similar-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 32px;
        }

        .similar-card {
            cursor: pointer;
        }

        .similar-card-img {
            position: relative;
            overflow: hidden;
            aspect-ratio: 4/5;
            margin-bottom: 20px;
        }

        .similar-card-img>div {
            position: absolute;
            inset: 0;
            transition: transform 0.9s;
        }

        .similar-card:hover .similar-card-img>div {
            transform: scale(1.04);
        }

        .similar-card-badge {
            position: absolute;
            top: 16px;
            left: 16px;
            z-index: 2;
            padding: 6px 12px;
            background: var(--paper);
            color: var(--ink);
            font-size: 10px;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            font-weight: 500;
        }

        .similar-card-num {
            position: absolute;
            top: 16px;
            right: 16px;
            z-index: 2;
            font-family: var(--editorial);
            font-style: italic;
            font-size: 13px;
            color: rgba(245, 241, 232, 0.85);
        }

        .similar-card-bottom {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            z-index: 2;
            padding: 20px;
            color: var(--paper);
            background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
        }

        .similar-card-price {
            font-family: var(--display);
            font-style: italic;
            font-weight: 300;
            font-size: 24px;
            letter-spacing: -0.01em;
        }

        .similar-card-meta {
            display: flex;
            justify-content: space-between;
            font-size: 10px;
            letter-spacing: 0.25em;
            text-transform: uppercase;
            color: var(--muted);
            margin-bottom: 10px;
            font-weight: 500;
        }

        .similar-card h4 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 24px;
            letter-spacing: -0.015em;
            margin-bottom: 8px;
        }

        .similar-card h4 em {
            font-style: italic;
        }

        .similar-card-specs {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 13px;
            color: var(--muted);
        }

        /* =========== NEIGHBOURHOOD =========== */
        .nbh-hero {
            padding: 110px 32px 0 32px;
            max-width: 1800px;
            margin: 0 auto;
        }

        .nbh-hero-img {
            height: 560px;
            position: relative;
            overflow: hidden;
            background:
                radial-gradient(ellipse 60% 50% at 55% 35%, rgba(255, 230, 190, 0.55), transparent 65%),
                radial-gradient(ellipse 120% 70% at 50% 25%, rgba(220, 150, 100, 0.45), transparent 70%),
                linear-gradient(to bottom, #1e2838 0%, #3c3248 14%, #6a4432 28%, #a46038 42%, #c47240 52%, #a05028 66%, #3a1e10 82%, #080402 100%);
        }

        .nbh-hero-img::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 45%;
            height: 15%;
            background: linear-gradient(to bottom, rgba(55, 38, 42, 0.5), rgba(20, 14, 16, 0.8));
            clip-path: polygon(0 78%, 12% 50%, 25% 65%, 40% 40%, 55% 58%, 72% 38%, 88% 55%, 100% 48%, 100% 100%, 0 100%);
        }

        .nbh-hero-img::after {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            height: 42%;
            background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
        }

        .nbh-hero-overlay {
            position: absolute;
            left: 48px;
            right: 48px;
            bottom: 48px;
            z-index: 5;
            color: var(--paper);
            display: grid;
            grid-template-columns: 2fr 1fr;
            gap: 48px;
            align-items: end;
        }

        .nbh-hero-overlay .section-label {
            color: var(--cognac-light);
            margin-bottom: 20px;
        }

        .nbh-hero-overlay .section-label::before {
            background: var(--cognac-light);
        }

        .nbh-hero-overlay h1 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(52px, 7vw, 112px);
            line-height: 0.92;
            letter-spacing: -0.035em;
        }

        .nbh-hero-overlay h1 em {
            font-style: italic;
            color: var(--cognac-light);
        }

        .nbh-hero-meta {
            display: flex;
            flex-direction: column;
            gap: 16px;
            font-family: var(--editorial);
            font-style: italic;
            font-size: 15px;
            line-height: 1.5;
        }

        .nbh-hero-meta strong {
            display: block;
            font-family: var(--body);
            font-style: normal;
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            font-weight: 500;
            opacity: 0.8;
            margin-bottom: 4px;
        }

        .nbh-hero-stamp {
            position: absolute;
            top: 32px;
            right: 48px;
            z-index: 5;
            color: rgba(245, 241, 232, 0.6);
            font-size: 10px;
            letter-spacing: 0.35em;
            text-transform: uppercase;
            font-weight: 500;
        }

        .nbh-stats {
            padding: 80px 32px;
            max-width: 1800px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            border-bottom: 1px solid var(--line);
        }

        .nbh-stat {
            padding: 0 32px;
            border-right: 1px solid var(--line);
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .nbh-stat:first-child {
            padding-left: 0;
        }

        .nbh-stat:last-child {
            border-right: none;
            padding-right: 0;
        }

        .nbh-stat-label {
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
        }

        .nbh-stat-value {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(36px, 4vw, 56px);
            line-height: 1;
            letter-spacing: -0.025em;
        }

        .nbh-stat-value em {
            font-style: italic;
            color: var(--cognac);
        }

        .nbh-stat-note {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 13px;
            color: var(--muted);
            line-height: 1.45;
        }

        /* Streets list */
        .streets {
            padding: 80px 32px;
            max-width: 1400px;
            margin: 0 auto;
        }

        .streets-head {
            margin-bottom: 48px;
        }

        .streets-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(40px, 4.5vw, 64px);
            line-height: 1;
            letter-spacing: -0.03em;
            margin-top: 18px;
        }

        .streets-head h2 em {
            font-style: italic;
        }

        .streets-list {
            border-top: 1px solid var(--line-strong);
        }

        .street-row {
            padding: 36px 0;
            border-bottom: 1px solid var(--line);
            display: grid;
            grid-template-columns: 80px 2fr 1fr 1fr auto;
            gap: 32px;
            align-items: center;
            transition: padding 0.3s;
        }

        .street-row:hover {
            padding-left: 16px;
        }

        .street-num {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 15px;
            color: var(--muted-2);
        }

        .street-name {
            font-family: var(--display);
            font-weight: 300;
            font-size: 26px;
            letter-spacing: -0.015em;
        }

        .street-name em {
            font-style: italic;
        }

        .street-profile {
            font-size: 13px;
            color: var(--muted);
            line-height: 1.4;
            font-family: var(--editorial);
            font-style: italic;
        }

        .street-range {
            font-family: var(--display);
            font-weight: 300;
            font-style: italic;
            font-size: 18px;
            color: var(--cognac);
            letter-spacing: -0.01em;
        }

        .street-arr {
            font-size: 18px;
            color: var(--muted-2);
            transition: transform 0.3s;
        }

        .street-row:hover .street-arr {
            transform: translateX(6px);
            color: var(--cognac);
        }

        /* =========== ARTICLE =========== */
        .article-header {
            padding: 130px 32px 40px 32px;
            max-width: 820px;
            margin: 0 auto;
            text-align: center;
        }

        .article-tag-pill {
            display: inline-block;
            padding: 8px 16px;
            border: 1px solid var(--cognac);
            border-radius: 100px;
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            font-weight: 500;
            color: var(--cognac);
            margin-bottom: 40px;
        }

        .article-title-main {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(44px, 5.5vw, 84px);
            line-height: 0.95;
            letter-spacing: -0.035em;
            margin-bottom: 32px;
        }

        .article-title-main em {
            font-style: italic;
            color: var(--cognac-deep);
        }

        .article-deck {
            font-family: var(--editorial);
            font-style: italic;
            font-size: clamp(20px, 2vw, 26px);
            line-height: 1.45;
            color: var(--muted);
            max-width: 48ch;
            margin: 0 auto 48px auto;
        }

        .article-byline {
            display: inline-flex;
            align-items: center;
            gap: 16px;
            padding: 20px 0;
            border-top: 1px solid var(--line);
            border-bottom: 1px solid var(--line);
            font-size: 13px;
            color: var(--muted);
            font-family: var(--editorial);
            font-style: italic;
        }

        .article-byline .author {
            color: var(--ink);
            font-weight: 500;
            font-style: normal;
            font-family: var(--body);
            letter-spacing: 0.05em;
        }

        .article-byline .sep {
            opacity: 0.5;
        }

        .article-hero-img {
            padding: 20px 32px 80px 32px;
            max-width: 1400px;
            margin: 0 auto;
        }

        .article-hero-img-inner {
            height: 480px;
            position: relative;
            overflow: hidden;
            background:
                radial-gradient(ellipse 60% 45% at 55% 30%, rgba(255, 230, 190, 0.5), transparent 65%),
                linear-gradient(to bottom, #2a3545 0%, #4a3428 25%, #8a4828 50%, #a45228 70%, #3a1a10 92%, #080402 100%);
        }

        .article-hero-img-inner::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 45%;
            height: 12%;
            background: linear-gradient(to bottom, rgba(55, 38, 42, 0.5), rgba(20, 14, 16, 0.85));
            clip-path: polygon(0 78%, 15% 55%, 30% 70%, 45% 45%, 60% 60%, 75% 40%, 90% 60%, 100% 50%, 100% 100%, 0 100%);
        }

        .article-hero-img-inner::after {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            height: 20%;
            background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
        }

        .article-caption {
            padding: 16px 32px 0 32px;
            max-width: 1400px;
            margin: 0 auto;
            font-family: var(--editorial);
            font-style: italic;
            font-size: 13px;
            color: var(--muted-2);
            letter-spacing: 0.02em;
        }

        .article-body {
            padding: 0 32px 100px 32px;
            max-width: 760px;
            margin: 0 auto;
        }

        .article-body>p:first-of-type::first-letter {
            font-family: var(--display);
            font-style: italic;
            font-weight: 300;
            font-size: 84px;
            line-height: 0.9;
            float: left;
            margin: 4px 14px 0 -4px;
            color: var(--cognac-deep);
        }

        .article-body p {
            font-size: 18px;
            line-height: 1.75;
            color: var(--ink);
            margin-bottom: 22px;
            font-family: 'Geist', sans-serif;
        }

        .article-body h2 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 32px;
            line-height: 1.1;
            letter-spacing: -0.02em;
            margin: 56px 0 20px 0;
        }

        .article-body h2 em {
            font-style: italic;
        }

        .article-body h3 {
            font-family: var(--display);
            font-weight: 400;
            font-size: 22px;
            letter-spacing: -0.01em;
            margin: 40px 0 14px 0;
        }

        .article-body blockquote {
            margin: 48px 0;
            padding: 32px 0 32px 40px;
            border-left: 3px solid var(--cognac);
            font-family: var(--display);
            font-style: italic;
            font-weight: 300;
            font-size: 28px;
            line-height: 1.3;
            letter-spacing: -0.015em;
            color: var(--ink);
        }

        .article-body blockquote cite {
            display: block;
            margin-top: 14px;
            font-family: var(--body);
            font-style: normal;
            font-weight: 500;
            font-size: 12px;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            color: var(--cognac);
        }

        .article-body ul,
        .article-body ol {
            margin: 20px 0 24px 0;
            padding-left: 20px;
        }

        .article-body li {
            margin-bottom: 10px;
            font-size: 17px;
            line-height: 1.65;
            color: var(--ink);
        }

        .article-body .data-strip {
            margin: 48px -40px;
            padding: 40px;
            background: var(--paper-2);
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 32px;
            border-left: 3px solid var(--cognac);
        }

        .data-strip .d-label {
            font-size: 10px;
            letter-spacing: 0.25em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
            margin-bottom: 6px;
        }

        .data-strip .d-value {
            font-family: var(--display);
            font-weight: 300;
            font-size: 36px;
            line-height: 1;
            letter-spacing: -0.02em;
        }

        .data-strip .d-value em {
            font-style: italic;
            color: var(--cognac);
        }

        .data-strip .d-note {
            font-size: 12px;
            color: var(--muted);
            margin-top: 8px;
            font-family: var(--editorial);
            font-style: italic;
        }

        /* =========== ABOUT =========== */
        .about-hero {
            padding: 140px 32px 80px 32px;
            max-width: 1400px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 80px;
            align-items: center;
        }

        .about-hero-copy h1 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(56px, 7vw, 120px);
            line-height: 0.92;
            letter-spacing: -0.035em;
            margin: 24px 0 32px 0;
        }

        .about-hero-copy h1 em {
            font-style: italic;
            color: var(--cognac-deep);
        }

        .about-hero-copy p {
            font-family: var(--editorial);
            font-style: italic;
            font-size: clamp(20px, 2vw, 26px);
            line-height: 1.5;
            color: var(--muted);
            max-width: 46ch;
        }

        .about-portrait {
            aspect-ratio: 4/5;
            position: relative;
            overflow: hidden;
            background:
                radial-gradient(ellipse 55% 50% at 50% 35%, rgba(200, 175, 145, 0.95), rgba(150, 118, 85, 0.85) 55%, rgba(80, 55, 30, 0.95) 95%),
                linear-gradient(to bottom, #d4c4a8 0%, #a88862 30%, #4a3420 70%, #1a1008 100%);
        }

        .about-portrait::before {
            content: '';
            position: absolute;
            left: 25%;
            right: 25%;
            top: 18%;
            bottom: 30%;
            background: radial-gradient(ellipse 60% 70% at 50% 35%, rgba(230, 200, 170, 0.95), transparent 68%);
            filter: blur(2px);
        }

        .about-portrait::after {
            content: '';
            position: absolute;
            left: 15%;
            right: 15%;
            bottom: 0;
            height: 42%;
            background: linear-gradient(to bottom, rgba(40, 28, 18, 0.9), rgba(15, 10, 6, 1));
            clip-path: polygon(25% 0, 75% 0, 95% 100%, 5% 100%);
        }

        .about-philosophy {
            padding: 80px 32px 120px 32px;
            max-width: 1200px;
            margin: 0 auto;
            border-top: 1px solid var(--line);
        }

        .about-philosophy-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(40px, 5vw, 72px);
            line-height: 1;
            letter-spacing: -0.03em;
            margin: 18px 0 48px 0;
            max-width: 20ch;
        }

        .about-philosophy-head h2 em {
            font-style: italic;
            color: var(--cognac-deep);
        }

        .about-philosophy-body {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 64px;
            font-size: 17px;
            line-height: 1.75;
            color: var(--muted);
            max-width: 100%;
        }

        .about-philosophy-body p+p {
            margin-top: 16px;
        }

        /* Timeline */
        .timeline {
            padding: 100px 32px;
            background: var(--ink);
            color: var(--paper);
            position: relative;
            overflow: hidden;
        }

        .timeline-head {
            max-width: 1400px;
            margin: 0 auto 80px auto;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 80px;
            align-items: end;
        }

        .timeline-head .section-label {
            color: var(--cognac-light);
        }

        .timeline-head .section-label::before {
            background: var(--cognac-light);
        }

        .timeline-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(40px, 5vw, 72px);
            line-height: 1;
            letter-spacing: -0.03em;
            margin-top: 20px;
        }

        .timeline-head h2 em {
            font-style: italic;
            color: var(--cognac-light);
        }

        .timeline-head p {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 18px;
            line-height: 1.55;
            color: rgba(245, 241, 232, 0.7);
            max-width: 40ch;
        }

        .timeline-list {
            max-width: 1400px;
            margin: 0 auto;
            border-top: 1px solid rgba(245, 241, 232, 0.14);
        }

        .timeline-row {
            padding: 40px 0;
            border-bottom: 1px solid rgba(245, 241, 232, 0.14);
            display: grid;
            grid-template-columns: 120px 180px 1fr;
            gap: 40px;
            align-items: start;
        }

        .timeline-year {
            font-family: var(--display);
            font-weight: 300;
            font-style: italic;
            font-size: 28px;
            color: var(--cognac-light);
            letter-spacing: -0.01em;
        }

        .timeline-role {
            font-size: 11px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: rgba(245, 241, 232, 0.65);
            font-weight: 500;
            padding-top: 8px;
        }

        .timeline-desc {
            font-size: 16px;
            line-height: 1.6;
            color: rgba(245, 241, 232, 0.88);
            max-width: 62ch;
        }

        .timeline-desc strong {
            color: var(--paper);
            font-weight: 500;
        }

        /* Case studies */
        .cases {
            padding: 120px 32px;
            max-width: 1400px;
            margin: 0 auto;
        }

        .cases-head {
            margin-bottom: 60px;
        }

        .cases-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(40px, 5vw, 72px);
            line-height: 1;
            letter-spacing: -0.03em;
            margin-top: 18px;
        }

        .cases-head h2 em {
            font-style: italic;
        }

        .cases-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 40px;
        }

        .case {
            padding: 48px;
            background: var(--paper-2);
            border: 1px solid var(--line);
            display: flex;
            flex-direction: column;
            gap: 20px;
        }

        .case-meta {
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 10px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
            padding-bottom: 16px;
            border-bottom: 1px solid var(--line);
        }

        .case-value {
            font-family: var(--display);
            font-weight: 200;
            font-size: 48px;
            line-height: 1;
            letter-spacing: -0.03em;
        }

        .case-value em {
            font-style: italic;
            color: var(--cognac);
        }

        .case h3 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 26px;
            letter-spacing: -0.015em;
            line-height: 1.2;
        }

        .case h3 em {
            font-style: italic;
        }

        .case p {
            font-size: 15px;
            line-height: 1.65;
            color: var(--muted);
            max-width: 50ch;
        }

        /* Press */
        .press-wall {
            padding: 100px 32px;
            background: var(--paper-2);
        }

        .press-wall-head {
            max-width: 1400px;
            margin: 0 auto 60px auto;
            text-align: center;
        }

        .press-wall-head h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(36px, 4.5vw, 64px);
            line-height: 1;
            letter-spacing: -0.03em;
            margin-top: 20px;
            max-width: 18ch;
            margin-left: auto;
            margin-right: auto;
        }

        .press-wall-head h2 em {
            font-style: italic;
            color: var(--cognac);
        }

        .press-wall-head .section-label {
            justify-content: center;
        }

        .press-wall-grid {
            max-width: 1400px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 40px;
        }

        .press-quote {
            padding: 40px 32px;
            background: var(--paper);
            border: 1px solid var(--line);
            display: flex;
            flex-direction: column;
            gap: 18px;
        }

        .press-quote-source {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 22px;
            color: var(--cognac-deep);
            letter-spacing: -0.01em;
        }

        .press-quote-text {
            font-size: 14px;
            line-height: 1.65;
            color: var(--muted);
            font-family: var(--editorial);
            font-style: italic;
        }

        .press-quote-date {
            font-size: 10px;
            letter-spacing: 0.28em;
            text-transform: uppercase;
            color: var(--muted-2);
            font-weight: 500;
            margin-top: auto;
            padding-top: 20px;
            border-top: 1px solid var(--line);
        }

        /* About contact */
        .about-contact {
            padding: 120px 32px;
            background: var(--ink);
            color: var(--paper);
        }

        .about-contact-inner {
            max-width: 1000px;
            margin: 0 auto;
            text-align: center;
        }

        .about-contact h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(48px, 6vw, 96px);
            line-height: 0.95;
            letter-spacing: -0.035em;
            max-width: 16ch;
            margin: 20px auto 32px auto;
        }

        .about-contact h2 em {
            font-style: italic;
            color: var(--cognac-light);
        }

        .about-contact .section-label {
            color: var(--cognac-light);
            justify-content: center;
        }

        .about-contact .section-label::before {
            background: var(--cognac-light);
        }

        .about-contact p {
            font-size: 18px;
            line-height: 1.6;
            color: rgba(245, 241, 232, 0.75);
            max-width: 52ch;
            margin: 0 auto 48px auto;
        }

        /* =========== RESPONSIVE =========== */
        @media (max-width: 1024px) {

            .prop-header,
            .prop-body,
            .prop-map-head,
            .similar-head,
            .about-hero,
            .about-philosophy-body {
                grid-template-columns: 1fr;
                gap: 32px;
            }

            .prop-specs,
            .nbh-stats {
                grid-template-columns: repeat(3, 1fr);
                gap: 24px 0;
            }

            .prop-spec:nth-child(3n) {
                border-right: none;
            }

            .prop-spec,
            .nbh-stat {
                padding: 16px;
            }

            .prop-gallery {
                grid-template-columns: 1fr 1fr;
                grid-template-rows: 280px 180px 180px;
            }

            .prop-gallery .main {
                grid-column: 1 / 3;
                grid-row: 1 / 2;
            }

            .prop-gallery .cell-2 {
                grid-column: 1;
                grid-row: 2;
            }

            .prop-gallery .cell-3 {
                grid-column: 2;
                grid-row: 2;
            }

            .prop-gallery .cell-4 {
                grid-column: 1;
                grid-row: 3;
            }

            .prop-gallery .cell-5 {
                grid-column: 2;
                grid-row: 3;
            }

            .similar-grid {
                grid-template-columns: 1fr 1fr;
            }

            .cases-grid {
                grid-template-columns: 1fr;
            }

            .press-wall-grid {
                grid-template-columns: 1fr 1fr;
            }

            .prop-sidebar {
                position: static;
            }

            .nbh-hero-overlay {
                grid-template-columns: 1fr;
                gap: 24px;
            }

            .timeline-row {
                grid-template-columns: 100px 1fr;
            }

            .timeline-role {
                grid-column: 2;
                grid-row: 1;
            }

            .timeline-desc {
                grid-column: 1/-1;
                margin-top: 12px;
            }
        }

        @media (max-width: 900px) {

            .prop-gallery,
            .prop-header,
            .prop-specs,
            .prop-body,
            .prop-map,
            .similar,
            .nbh-hero,
            .nbh-stats,
            .streets,
            .article-body,
            .article-header,
            .article-hero-img,
            .about-hero,
            .about-philosophy,
            .cases,
            .press-wall,
            .about-contact,
            .timeline {
                padding-left: 20px;
                padding-right: 20px;
            }

            .prop-specs,
            .nbh-stats {
                grid-template-columns: 1fr 1fr;
            }

            .prop-spec:nth-child(3n) {
                border-right: 1px solid var(--line);
            }

            .prop-spec:nth-child(2n) {
                border-right: none;
            }

            .prop-spec {
                padding: 12px;
            }

            .prop-gallery {
                grid-template-columns: 1fr;
                grid-template-rows: 240px repeat(4, 140px);
                gap: 6px;
            }

            .prop-gallery .main {
                grid-column: 1;
                grid-row: 1;
            }

            .prop-gallery .cell-2 {
                grid-column: 1;
                grid-row: 2;
            }

            .prop-gallery .cell-3 {
                grid-column: 1;
                grid-row: 3;
            }

            .prop-gallery .cell-4 {
                grid-column: 1;
                grid-row: 4;
            }

            .prop-gallery .cell-5 {
                grid-column: 1;
                grid-row: 5;
            }

            .similar-grid,
            .features-grid {
                grid-template-columns: 1fr;
            }

            .nbh-hero-img {
                height: 400px;
            }

            .nbh-hero-overlay {
                left: 20px;
                right: 20px;
                bottom: 20px;
            }

            .nbh-hero-stamp {
                right: 20px;
                top: 24px;
            }

            .press-wall-grid {
                grid-template-columns: 1fr;
            }

            .street-row {
                grid-template-columns: 40px 1fr;
                gap: 12px;
                padding: 24px 0;
            }

            .street-profile,
            .street-range,
            .street-arr {
                grid-column: 2;
            }

            .street-profile {
                grid-row: 2;
                margin-top: 6px;
            }

            .street-range {
                grid-row: 3;
                margin-top: 6px;
            }

            .street-arr {
                display: none;
            }

            .article-body {
                padding: 0 24px 80px 24px;
            }

            .article-body>p:first-of-type::first-letter {
                font-size: 60px;
            }

            .article-body p,
            .article-body li {
                font-size: 16px;
            }

            .article-body blockquote {
                font-size: 22px;
                padding-left: 24px;
                margin: 32px 0;
            }

            .article-body .data-strip {
                grid-template-columns: 1fr;
                margin: 32px 0;
                gap: 24px;
            }
        }
    

/* ========================================= */


        /* BREADCRUMBS */
        .breadcrumbs {
            padding: 110px 48px 20px 48px;
            max-width: 1400px;
            margin: 0 auto;
            display: flex;
            align-items: center;
            gap: 12px;
            font-size: 11px;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            font-weight: 500;
            color: var(--muted-2);
        }

        .breadcrumbs a:hover {
            color: var(--cognac);
        }

        .breadcrumbs .current {
            color: var(--ink);
        }

        .breadcrumbs .sep {
            opacity: 0.4;
        }

        /* PAGE HEADER */
        .page-header {
            padding: 40px 48px 100px 48px;
            max-width: 1400px;
            margin: 0 auto;
        }

        .section-label {
            font-size: 11px;
            letter-spacing: 0.32em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
            display: flex;
            align-items: center;
            gap: 14px;
            margin-bottom: 32px;
        }

        .section-label::before {
            content: '';
            width: 40px;
            height: 1px;
            background: var(--cognac);
        }

        .page-title {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(56px, 8vw, 128px);
            line-height: 0.92;
            letter-spacing: -0.035em;
            max-width: 14ch;
        }

        .page-title em {
            font-style: italic;
            color: var(--cognac-deep);
        }

        .page-lede {
            margin-top: 48px;
            font-family: var(--editorial);
            font-style: italic;
            font-size: clamp(22px, 2.2vw, 30px);
            line-height: 1.45;
            color: var(--muted);
            max-width: 50ch;
        }

        /* HERO VISUAL BAR */
        .hero-bar {
            padding: 0 48px;
            max-width: 1400px;
            margin: 0 auto;
        }

        .hero-bar-inner {
            height: 360px;
            background:
                radial-gradient(ellipse 60% 50% at 65% 35%, rgba(255, 230, 190, 0.55), transparent 65%),
                radial-gradient(ellipse 120% 70% at 50% 25%, rgba(220, 150, 100, 0.45), transparent 70%),
                linear-gradient(to bottom,
                    #1e2838 0%, #3c3248 14%, #6a4432 28%, #a46038 42%,
                    #c47240 52%, #a05028 66%, #3a1e10 82%, #080402 100%);
            position: relative;
            overflow: hidden;
        }

        .hero-bar-inner::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 42%;
            height: 14%;
            background: linear-gradient(to bottom, rgba(55, 38, 42, 0.55), rgba(20, 14, 16, 0.85));
            clip-path: polygon(0 78%, 12% 50%, 25% 65%, 40% 40%, 55% 58%, 72% 38%, 88% 55%, 100% 48%, 100% 100%, 0 100%);
        }

        .hero-bar-inner::after {
            content: '';
            position: absolute;
            left: 10%;
            right: 10%;
            bottom: 14%;
            height: 38%;
            background: linear-gradient(to bottom, rgba(8, 6, 4, 0.85), rgba(2, 1, 1, 0.98));
            clip-path: polygon(0 40%, 16% 40%, 16% 14%, 42% 14%, 42% 0, 74% 0, 74% 40%, 100% 40%, 100% 100%, 0 100%);
        }

        .hero-bar-label {
            position: absolute;
            bottom: 32px;
            left: 40px;
            z-index: 5;
            color: var(--paper);
            font-family: var(--editorial);
            font-style: italic;
            font-size: 15px;
            letter-spacing: 0.02em;
        }

        .hero-bar-label strong {
            display: block;
            font-family: var(--body);
            font-style: normal;
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            font-weight: 500;
            opacity: 0.75;
            margin-bottom: 6px;
        }

        .hero-bar-stamp {
            position: absolute;
            top: 32px;
            right: 40px;
            z-index: 5;
            color: rgba(245, 241, 232, 0.55);
            font-size: 10px;
            letter-spacing: 0.4em;
            text-transform: uppercase;
            font-weight: 500;
        }

        /* PAGE NAV PILLS */
        .page-nav {
            padding: 60px 48px 20px 48px;
            max-width: 1400px;
            margin: 0 auto;
            display: flex;
            gap: 10px;
            flex-wrap: wrap;
            border-bottom: 1px solid var(--line);
            padding-bottom: 40px;
        }

        .page-nav-pill {
            padding: 10px 20px;
            border: 1px solid var(--line-strong);
            border-radius: 100px;
            font-size: 11px;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            font-weight: 500;
            color: var(--muted);
            transition: all 0.3s;
        }

        .page-nav-pill:hover {
            border-color: var(--ink);
            color: var(--ink);
        }

        .page-nav-pill.current {
            background: var(--ink);
            color: var(--paper);
            border-color: var(--ink);
        }

        /* MAIN BODY */
        .body-wrap {
            padding: 80px 48px 120px 48px;
            max-width: 1400px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 200px 1fr;
            gap: 80px;
            align-items: start;
        }

        /* STICKY TOC */
        .toc {
            position: sticky;
            top: 120px;
            padding-top: 8px;
        }

        .toc-label {
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
            padding-bottom: 16px;
            margin-bottom: 16px;
            border-bottom: 1px solid var(--line);
        }

        .toc ul {
            list-style: none;
        }

        .toc li {
            margin-bottom: 12px;
        }

        .toc a {
            font-size: 13px;
            color: var(--muted);
            line-height: 1.35;
            transition: color 0.3s;
            display: block;
            padding-left: 16px;
            position: relative;
        }

        .toc a::before {
            content: '';
            position: absolute;
            left: 0;
            top: 8px;
            width: 6px;
            height: 1px;
            background: var(--muted-2);
            transition: background 0.3s, width 0.3s;
        }

        .toc a:hover {
            color: var(--ink);
        }

        .toc a:hover::before {
            background: var(--cognac);
            width: 10px;
        }

        /* CONTENT */
        .content h2 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(32px, 3.6vw, 48px);
            line-height: 1.05;
            letter-spacing: -0.03em;
            margin: 80px 0 24px 0;
            max-width: 24ch;
        }

        .content h2:first-child {
            margin-top: 0;
        }

        .content h2 em {
            font-style: italic;
            color: var(--cognac-deep);
        }

        .content h3 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 26px;
            line-height: 1.2;
            letter-spacing: -0.015em;
            margin: 48px 0 14px 0;
        }

        .content h3 em {
            font-style: italic;
        }

        .content h4 {
            font-size: 11px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
            margin: 40px 0 14px 0;
        }

        .content p {
            font-size: 17px;
            line-height: 1.75;
            color: var(--muted);
            max-width: 62ch;
            margin-bottom: 18px;
        }

        .content p strong {
            color: var(--ink);
            font-weight: 500;
        }

        .content .lede {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 22px;
            line-height: 1.5;
            color: var(--ink);
            margin-bottom: 40px;
            max-width: 52ch;
        }

        .content ul {
            list-style: none;
            margin: 16px 0 24px 0;
            max-width: 62ch;
        }

        .content ul li {
            padding: 8px 0 8px 22px;
            position: relative;
            font-size: 16px;
            color: var(--muted);
            line-height: 1.55;
        }

        .content ul li::before {
            content: '';
            position: absolute;
            left: 0;
            top: 17px;
            width: 8px;
            height: 1px;
            background: var(--cognac);
        }

        .content ul li strong {
            color: var(--ink);
            font-weight: 500;
        }

        .content ol {
            counter-reset: step;
            list-style: none;
            margin: 24px 0;
            max-width: 62ch;
            border-top: 1px solid var(--line);
        }

        .content ol li {
            counter-increment: step;
            padding: 20px 0 20px 56px;
            border-bottom: 1px solid var(--line);
            position: relative;
            font-size: 16px;
            color: var(--muted);
            line-height: 1.55;
        }

        .content ol li::before {
            content: counter(step, decimal-leading-zero);
            position: absolute;
            left: 0;
            top: 22px;
            font-family: var(--editorial);
            font-style: italic;
            font-size: 14px;
            color: var(--cognac);
        }

        /* PULLQUOTE */
        .pullquote {
            margin: 64px 0;
            padding: 48px 0;
            border-top: 1px solid var(--line);
            border-bottom: 1px solid var(--line);
            font-family: var(--display);
            font-weight: 200;
            font-style: italic;
            font-size: clamp(28px, 3vw, 40px);
            line-height: 1.25;
            letter-spacing: -0.02em;
            color: var(--ink);
            max-width: 28ch;
        }

        .pullquote::before {
            content: '✦';
            display: block;
            font-size: 14px;
            color: var(--cognac);
            margin-bottom: 24px;
            font-style: normal;
        }

        /* CALLOUT BOX */
        .callout {
            background: var(--paper-2);
            padding: 40px;
            border-left: 2px solid var(--cognac);
            margin: 48px 0;
            max-width: 62ch;
        }

        .callout-label {
            font-size: 10px;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            color: var(--cognac);
            font-weight: 500;
            margin-bottom: 14px;
        }

        .callout h4 {
            font-family: var(--display);
            font-weight: 300;
            font-style: italic;
            font-size: 22px;
            line-height: 1.25;
            color: var(--ink);
            margin: 0 0 14px 0;
            letter-spacing: -0.01em;
            text-transform: none;
        }

        .callout p {
            font-size: 15px;
            line-height: 1.65;
            color: var(--muted);
            max-width: 100%;
            margin: 0;
        }

        .callout p+p {
            margin-top: 12px;
        }

        /* TABLE */
        .content table {
            width: 100%;
            border-collapse: collapse;
            margin: 32px 0;
            font-size: 15px;
            max-width: 62ch;
        }

        .content table th {
            text-align: left;
            padding: 14px 16px;
            background: var(--paper-2);
            font-size: 11px;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            font-weight: 500;
            color: var(--cognac);
            border-bottom: 1px solid var(--line-strong);
        }

        .content table td {
            padding: 14px 16px;
            border-bottom: 1px solid var(--line);
            color: var(--muted);
            vertical-align: top;
        }

        .content table td strong {
            color: var(--ink);
        }

        /* CTA BLOCK */
        .cta-block {
            margin-top: 100px;
            padding: 80px 60px;
            background: var(--ink);
            color: var(--paper);
            position: relative;
            overflow: hidden;
        }

        .cta-block .section-label {
            color: var(--cognac-light);
            margin-bottom: 24px;
        }

        .cta-block .section-label::before {
            background: var(--cognac-light);
        }

        .cta-block h3 {
            font-family: var(--display);
            font-weight: 200;
            font-size: clamp(36px, 4vw, 56px);
            line-height: 1;
            letter-spacing: -0.025em;
            max-width: 18ch;
            margin: 0 0 32px 0;
        }

        .cta-block h3 em {
            font-style: italic;
            color: var(--cognac-light);
        }

        .cta-block p {
            font-size: 17px;
            line-height: 1.6;
            color: rgba(245, 241, 232, 0.7);
            max-width: 52ch;
            margin-bottom: 40px;
        }

        .cta-buttons {
            display: flex;
            gap: 14px;
            flex-wrap: wrap;
        }

ze: clamp(32px, 3.4vw, 48px);
            line-height: 1;
            letter-spacing: -0.025em;
            margin-top: 14px;
        }

        .related-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 32px;
        }

        .related-card {
            padding: 40px 32px;
            background: var(--paper-2);
            border: 1px solid var(--line);
            transition: all 0.3s;
            display: flex;
            flex-direction: column;
            gap: 16px;
            min-height: 260px;
        }

        .related-card:hover {
            background: var(--paper);
            border-color: var(--cognac-light);
            transform: translateY(-2px);
        }

        .related-num {
            font-family: var(--editorial);
            font-style: italic;
            font-size: 14px;
            color: var(--muted-2);
        }

        .related-card h4 {
            font-family: var(--display);
            font-weight: 300;
            font-size: 28px;
            line-height: 1.1;
            letter-spacing: -0.02em;
            margin-top: 8px;
        }

        .related-card h4 em {
            font-style: italic;
        }

        .related-card p {
            font-size: 14px;
            color: var(--muted);
            line-height: 1.55;
            margin-top: 8px;
        }

        .related-card .arrow {
            margin-top: auto;
            font-size: 20px;
            color: var(--cognac);
            transition: transform 0.3s;
        }

        .related-card:hover .arrow {
            transform: translateX(6px);
        }





        @media (max-width: 1024px) {
            .body-wrap {
                grid-template-columns: 1fr;
                gap: 48px;
                padding: 60px 32px 100px 32px;
            }

            .toc {
                position: static;
                padding-bottom: 24px;
                border-bottom: 1px solid var(--line);
            }

            .toc ul {
                columns: 2;
                gap: 24px;
            }

            .related-grid {
                grid-template-columns: 1fr;
                gap: 16px;
            }
        }

        @media (max-width: 900px) {
            .nav {
                padding: 16px 20px;
                display: flex;
                justify-content: space-between;
            }

            .nav-left {
                display: none;
            }

            .nav-right {
                gap: 10px;
            }

            .nav-right a {
                display: none;
            }

            .nav-right .lang-switch {
                display: none;
            }

            .menu-toggle {
                display: flex;
                flex-direction: column;
                gap: 5px;
                padding: 8px;
                color: inherit;
            }

            .menu-toggle span {
                width: 22px;
                height: 1.5px;
                background: currentColor;
                display: block;
            }

            .nav-logo {
                font-size: 20px;
            }

            .breadcrumbs {
                padding: 100px 20px 12px 20px;
                gap: 8px;
                flex-wrap: wrap;
            }

            .page-header {
                padding: 24px 20px 60px 20px;
            }

            .page-title {
                font-size: clamp(44px, 12vw, 72px);
            }

            .page-lede {
                font-size: 19px;
            }

            .hero-bar {
                padding: 0 20px;
            }

            .hero-bar-inner {
                height: 240px;
            }

            .page-nav {
                padding: 40px 20px 28px 20px;
                gap: 8px;
            }

            .body-wrap {
                padding: 48px 20px 80px 20px;
            }

            .toc ul {
                columns: 1;
            }

            .content h2 {
                font-size: clamp(26px, 7vw, 34px);
                margin: 56px 0 18px 0;
            }

            .content h3 {
                font-size: 22px;
            }

            .content p,
            .content ul li,
            .content ol li {
                font-size: 15px;
            }

            .content .lede {
                font-size: 19px;
            }

            .content table {
                font-size: 14px;
                display: block;
                overflow-x: auto;
            }

            .content table th,
            .content table td {
                padding: 12px;
            }

            .cta-block {
                padding: 60px 28px;
            }

            .cta-block h3 {
                font-size: clamp(28px, 8vw, 36px);
            }

            .pullquote {
                font-size: clamp(22px, 6vw, 28px);
                padding: 36px 0;
                margin: 48px 0;
            }

            .callout {
                padding: 28px;
            }

            .related {
                padding: 60px 20px;
            }
        }
    

/* ========================================= */


            /* BREADCRUMBS */
            .breadcrumbs {
                padding: 110px 48px 20px 48px;
                max-width: 1400px;
                margin: 0 auto;
                display: flex;
                align-items: center;
                gap: 12px;
                font-size: 11px;
                letter-spacing: 0.22em;
                text-transform: uppercase;
                font-weight: 500;
                color: var(--muted-2);
            }

            .breadcrumbs a:hover {
                color: var(--cognac);
            }

            .breadcrumbs .current {
                color: var(--ink);
            }

            .breadcrumbs .sep {
                x opacity: 0.4;
            }

            /* PAGE HEADER */
            .page-header {
                padding: 40px 48px 100px 48px;
                max-width: 1400px;
                margin: 0 auto;
            }

            .section-label {
                font-size: 11px;
                letter-spacing: 0.32em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                display: flex;
                align-items: center;
                gap: 14px;
                margin-bottom: 32px;
            }

            .section-label::before {
                content: '';
                width: 40px;
                height: 1px;
                background: var(--cognac);
            }

            .page-title {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(56px, 8vw, 128px);
                line-height: 0.92;
                letter-spacing: -0.035em;
                max-width: 14ch;
            }

            .page-title em {
                font-style: italic;
                color: var(--cognac-deep);
            }

            .page-lede {
                margin-top: 48px;
                font-family: var(--editorial);
                font-style: italic;
                font-size: clamp(22px, 2.2vw, 30px);
                line-height: 1.45;
                color: var(--muted);
                max-width: 50ch;
            }

            /* HERO VISUAL BAR */
            .hero-bar {
                padding: 0 48px;
                max-width: 1400px;
                margin: 0 auto;
            }

            .hero-bar-inner {
                height: 360px;
                background:
                    radial-gradient(ellipse 60% 50% at 65% 35%, rgba(255, 230, 190, 0.55), transparent 65%),
                    radial-gradient(ellipse 120% 70% at 50% 25%, rgba(220, 150, 100, 0.45), transparent 70%),
                    linear-gradient(to bottom,
                        #1e2838 0%, #3c3248 14%, #6a4432 28%, #a46038 42%,
                        #c47240 52%, #a05028 66%, #3a1e10 82%, #080402 100%);
                position: relative;
                overflow: hidden;
            }

            .hero-bar-inner::before {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                top: 42%;
                height: 14%;
                background: linear-gradient(to bottom, rgba(55, 38, 42, 0.55), rgba(20, 14, 16, 0.85));
                clip-path: polygon(0 78%, 12% 50%, 25% 65%, 40% 40%, 55% 58%, 72% 38%, 88% 55%, 100% 48%, 100% 100%, 0 100%);
            }

            .hero-bar-inner::after {
                content: '';
                position: absolute;
                left: 10%;
                right: 10%;
                bottom: 14%;
                height: 38%;
                background: linear-gradient(to bottom, rgba(8, 6, 4, 0.85), rgba(2, 1, 1, 0.98));
                clip-path: polygon(0 40%, 16% 40%, 16% 14%, 42% 14%, 42% 0, 74% 0, 74% 40%, 100% 40%, 100% 100%, 0 100%);
            }

            .hero-bar-label {
                position: absolute;
                bottom: 32px;
                left: 40px;
                z-index: 5;
                color: var(--paper);
                font-family: var(--editorial);
                font-style: italic;
                font-size: 15px;
                letter-spacing: 0.02em;
            }

            .hero-bar-label strong {
                display: block;
                font-family: var(--body);
                font-style: normal;
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                font-weight: 500;
                opacity: 0.75;
                margin-bottom: 6px;
            }

            .hero-bar-stamp {
                position: absolute;
                top: 32px;
                right: 40px;
                z-index: 5;
                color: rgba(245, 241, 232, 0.55);
                font-size: 10px;
                letter-spacing: 0.4em;
                text-transform: uppercase;
                font-weight: 500;
            }

            /* PAGE NAV PILLS */
            .page-nav {
                padding: 60px 48px 20px 48px;
                max-width: 1400px;
                margin: 0 auto;
                display: flex;
                gap: 10px;
                flex-wrap: wrap;
                border-bottom: 1px solid var(--line);
                padding-bottom: 40px;
            }

            .page-nav-pill {
                padding: 10px 20px;
                border: 1px solid var(--line-strong);
                border-radius: 100px;
                font-size: 11px;
                letter-spacing: 0.2em;
                text-transform: uppercase;
                font-weight: 500;
                color: var(--muted);
                transition: all 0.3s;
            }

            .page-nav-pill:hover {
                border-color: var(--ink);
                color: var(--ink);
            }

            .page-nav-pill.current {
                background: var(--ink);
                color: var(--paper);
                border-color: var(--ink);
            }

            /* MAIN BODY */
            .body-wrap {
                padding: 80px 48px 120px 48px;
                max-width: 1400px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: 200px 1fr;
                gap: 80px;
                align-items: start;
            }

            /* STICKY TOC */
            .toc {
                position: sticky;
                top: 120px;
                padding-top: 8px;
            }

            .toc-label {
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                padding-bottom: 16px;
                margin-bottom: 16px;
                border-bottom: 1px solid var(--line);
            }

            .toc ul {
                list-style: none;
            }

            .toc li {
                margin-bottom: 12px;
            }

            .toc a {
                font-size: 13px;
                color: var(--muted);
                line-height: 1.35;
                transition: color 0.3s;
                display: block;
                padding-left: 16px;
                position: relative;
            }

            .toc a::before {
                content: '';
                position: absolute;
                left: 0;
                top: 8px;
                width: 6px;
                height: 1px;
                background: var(--muted-2);
                transition: background 0.3s, width 0.3s;
            }

            .toc a:hover {
                color: var(--ink);
            }

            .toc a:hover::before {
                background: var(--cognac);
                width: 10px;
            }

            /* CONTENT */
            .content h2 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(32px, 3.6vw, 48px);
                line-height: 1.05;
                letter-spacing: -0.03em;
                margin: 80px 0 24px 0;
                max-width: 24ch;
            }

            .content h2:first-child {
                margin-top: 0;
            }

            .content h2 em {
                font-style: italic;
                color: var(--cognac-deep);
            }

            .content h3 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 26px;
                line-height: 1.2;
                letter-spacing: -0.015em;
                margin: 48px 0 14px 0;
            }

            .content h3 em {
                font-style: italic;
            }

            .content h4 {
                font-size: 11px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                margin: 40px 0 14px 0;
            }

            .content p {
                font-size: 17px;
                line-height: 1.75;
                color: var(--muted);
                max-width: 62ch;
                margin-bottom: 18px;
            }

            .content p strong {
                color: var(--ink);
                font-weight: 500;
            }

            .content .lede {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 22px;
                line-height: 1.5;
                color: var(--ink);
                margin-bottom: 40px;
                max-width: 52ch;
            }

            .content ul {
                list-style: none;
                margin: 16px 0 24px 0;
                max-width: 62ch;
            }

            .content ul li {
                padding: 8px 0 8px 22px;
                position: relative;
                font-size: 16px;
                color: var(--muted);
                line-height: 1.55;
            }

            .content ul li::before {
                content: '';
                position: absolute;
                left: 0;
                top: 17px;
                width: 8px;
                height: 1px;
                background: var(--cognac);
            }

            .content ul li strong {
                color: var(--ink);
                font-weight: 500;
            }

            .content ol {
                counter-reset: step;
                list-style: none;
                margin: 24px 0;
                max-width: 62ch;
                border-top: 1px solid var(--line);
            }

            .content ol li {
                counter-increment: step;
                padding: 20px 0 20px 56px;
                border-bottom: 1px solid var(--line);
                position: relative;
                font-size: 16px;
                color: var(--muted);
                line-height: 1.55;
            }

            .content ol li::before {
                content: counter(step, decimal-leading-zero);
                position: absolute;
                left: 0;
                top: 22px;
                font-family: var(--editorial);
                font-style: italic;
                font-size: 14px;
                color: var(--cognac);
            }

            /* PULLQUOTE */
            .pullquote {
                margin: 64px 0;
                padding: 48px 0;
                border-top: 1px solid var(--line);
                border-bottom: 1px solid var(--line);
                font-family: var(--display);
                font-weight: 200;
                font-style: italic;
                font-size: clamp(28px, 3vw, 40px);
                line-height: 1.25;
                letter-spacing: -0.02em;
                color: var(--ink);
                max-width: 28ch;
            }

            .pullquote::before {
                content: '✦';
                display: block;
                font-size: 14px;
                color: var(--cognac);
                margin-bottom: 24px;
                font-style: normal;
            }

            /* CALLOUT BOX */
            .callout {
                background: var(--paper-2);
                padding: 40px;
                border-left: 2px solid var(--cognac);
                margin: 48px 0;
                max-width: 62ch;
            }

            .callout-label {
                font-size: 10px;
                letter-spacing: 0.3em;
                text-transform: uppercase;
                color: var(--cognac);
                font-weight: 500;
                margin-bottom: 14px;
            }

            .callout h4 {
                font-family: var(--display);
                font-weight: 300;
                font-style: italic;
                font-size: 22px;
                line-height: 1.25;
                color: var(--ink);
                margin: 0 0 14px 0;
                letter-spacing: -0.01em;
                text-transform: none;
            }

            .callout p {
                font-size: 15px;
                line-height: 1.65;
                color: var(--muted);
                max-width: 100%;
                margin: 0;
            }

            .callout p+p {
                margin-top: 12px;
            }

            /* TABLE */
            .content table {
                width: 100%;
                border-collapse: collapse;
                margin: 32px 0;
                font-size: 15px;
                max-width: 62ch;
            }

            .content table th {
                text-align: left;
                padding: 14px 16px;
                background: var(--paper-2);
                font-size: 11px;
                letter-spacing: 0.2em;
                text-transform: uppercase;
                font-weight: 500;
                color: var(--cognac);
                border-bottom: 1px solid var(--line-strong);
            }

            .content table td {
                padding: 14px 16px;
                border-bottom: 1px solid var(--line);
                color: var(--muted);
                vertical-align: top;
            }

            .content table td strong {
                color: var(--ink);
            }

            /* CTA BLOCK */
            .cta-block {
                margin-top: 100px;
                padding: 80px 60px;
                background: var(--ink);
                color: var(--paper);
                position: relative;
                overflow: hidden;
            }

            .cta-block .section-label {
                color: var(--cognac-light);
                margin-bottom: 24px;
            }

            .cta-block .section-label::before {
                background: var(--cognac-light);
            }

            .cta-block h3 {
                font-family: var(--display);
                font-weight: 200;
                font-size: clamp(36px, 4vw, 56px);
                line-height: 1;
                letter-spacing: -0.025em;
                max-width: 18ch;
                margin: 0 0 32px 0;
            }

            .cta-block h3 em {
                font-style: italic;
                color: var(--cognac-light);
            }

            .cta-block p {
                font-size: 17px;
                line-height: 1.6;
                color: rgba(245, 241, 232, 0.7);
                max-width: 52ch;
                margin-bottom: 40px;
            }

            .cta-buttons {
                display: flex;
                gap: 14px;
                flex-wrap: wrap;
            }

ze: clamp(32px, 3.4vw, 48px);
                line-height: 1;
                letter-spacing: -0.025em;
                margin-top: 14px;
            }

            .related-grid {
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 32px;
            }

            .related-card {
                padding: 40px 32px;
                background: var(--paper-2);
                border: 1px solid var(--line);
                transition: all 0.3s;
                display: flex;
                flex-direction: column;
                gap: 16px;
                min-height: 260px;
            }

            .related-card:hover {
                background: var(--paper);
                border-color: var(--cognac-light);
                transform: translateY(-2px);
            }

            .related-num {
                font-family: var(--editorial);
                font-style: italic;
                font-size: 14px;
                color: var(--muted-2);
            }

            .related-card h4 {
                font-family: var(--display);
                font-weight: 300;
                font-size: 28px;
                line-height: 1.1;
                letter-spacing: -0.02em;
                margin-top: 8px;
            }

            .related-card h4 em {
                font-style: italic;
            }

            .related-card p {
                font-size: 14px;
                color: var(--muted);
                line-height: 1.55;
                margin-top: 8px;
            }

            .related-card .arrow {
                margin-top: auto;
                font-size: 20px;
                color: var(--cognac);
                transition: transform 0.3s;
            }

            .related-card:hover .arrow {
                transform: translateX(6px);
            }





            @media (max-width: 1024px) {
                .body-wrap {
                    grid-template-columns: 1fr;
                    gap: 48px;
                    padding: 60px 32px 100px 32px;
                }

                .toc {
                    position: static;
                    padding-bottom: 24px;
                    border-bottom: 1px solid var(--line);
                }

                .toc ul {
                    columns: 2;
                    gap: 24px;
                }

                .related-grid {
                    grid-template-columns: 1fr;
                    gap: 16px;
                }

            }

            @media (max-width: 900px) {

                .breadcrumbs {
                    padding: 100px 20px 12px 20px;
                    gap: 8px;
                    flex-wrap: wrap;
                }

                .page-header {
                    padding: 24px 20px 60px 20px;
                }

                .page-title {
                    font-size: clamp(44px, 12vw, 72px);
                }

                .page-lede {
                    font-size: 19px;
                }

                .hero-bar {
                    padding: 0 20px;
                }

                .hero-bar-inner {
                    height: 240px;
                }

                .page-nav {
                    padding: 40px 20px 28px 20px;
                    gap: 8px;
                }

                .body-wrap {
                    padding: 48px 20px 80px 20px;
                }

                .toc ul {
                    columns: 1;
                }

                .content h2 {
                    font-size: clamp(26px, 7vw, 34px);
                    margin: 56px 0 18px 0;
                }

                .content h3 {
                    font-size: 22px;
                }

                .content p,
                .content ul li,
                .content ol li {
                    font-size: 15px;
                }

                .content .lede {
                    font-size: 19px;
                }

                .content table {
                    font-size: 14px;
                    display: block;
                    overflow-x: auto;
                }

                .content table th,
                .content table td {
                    padding: 12px;
                }

                .cta-block {
                    padding: 60px 28px;
                }

                .cta-block h3 {
                    font-size: clamp(28px, 8vw, 36px);
                }

                .pullquote {
                    font-size: clamp(22px, 6vw, 28px);
                    padding: 36px 0;
                    margin: 48px 0;
                }

                .callout {
                    padding: 28px;
                }

                .related {
                    padding: 60px 20px;
                }

            }