@font-face {

            font-family: Manrope;

            src: url('/assets/2f6733e50a9e-Manrope-Regular.ttf') format('truetype');

            font-weight: 400;

            font-display: swap;

        }

        @font-face {

            font-family: Libre;

            src: url('/assets/05a954219613-LibreBaskerville.ttf') format('truetype');

            font-weight: 400;

            font-display: swap;

        }

        :root {

            --navy: #13243b;

            --ivory: #f7f6f2;

            --slate: #465363;

            --mist: #e7e8e5;

            --platinum: #9b9d9d;

            --rule: rgba(19, 36, 59, .22);

            --ease: cubic-bezier(.22, 1, .36, 1);

        }

        * {

            box-sizing: border-box;

        }

        html {

            scroll-behavior: smooth;

            scroll-padding-top: 124px;

        }

        body {

            margin: 0;

            background: var(--ivory);

            color: var(--navy);

            font-family: Manrope, Arial, sans-serif;

            font-size: 17px;

            line-height: 1.7;

            -webkit-font-smoothing: antialiased;

        }

        h1, h2, h3 {

            font-family: Libre, Georgia, serif;

            font-weight: 400;

            letter-spacing: -.045em;

            line-height: 1.25;

        }

        .wrap {

            width: min(1200px, calc(100% - 80px));

            margin-inline: auto;

        }

        .essay-wrap {

            width: min(720px, calc(100% - 48px));

            margin-inline: auto;

        }

        .site-header {

            height: 106px;

            position: sticky;

            top: 0;

            z-index: 90;

            background: rgba(247, 246, 242, .97);

            border-bottom: 1px solid var(--rule);

            display: flex;

            align-items: center;

            padding-inline: clamp(24px, 4.5vw, 72px);

        }

        .site-logo img {

            height: 66px;

            width: auto;

        }

        .desktop-nav {

            display: flex;

            gap: 30px;

            margin-left: auto;

            font-size: 13px;

        }

        .desktop-nav a[aria-current="page"] {

            border-bottom: 1px solid var(--navy);

        }

        .button {

            display: inline-flex;

            padding: 14px 22px;

            background: var(--navy);

            color: var(--ivory);

            font-size: 14px;

            border: 1px solid var(--navy);

            transition: all 0.2s var(--ease);

        }

        .button:hover {

            background: var(--slate);

            border-color: var(--slate);

        }

        .editorial-hero {

            padding-block: 100px 60px;

            text-align: center;

        }

        .editorial-hero h1 {

            font-size: clamp(48px, 6vw, 82px);

            margin-bottom: 24px;

        }

        .label-small {

            font-size: 12px;

            text-transform: uppercase;

            letter-spacing: 0.1em;

            color: var(--slate);

            margin-bottom: 16px;

            display: block;

        }

        .arch-strip {

            width: 100%;

            height: 400px;

            background: var(--navy);

            position: relative;

            overflow: hidden;

            margin-block: 40px;

        }

        .arch-strip img {

            width: 100%;

            height: 100%;

            object-fit: cover;

            opacity: 0.4;

        }

        .arch-label {

            position: absolute;

            bottom: 20px;

            right: 20px;

            font-size: 11px;

            color: var(--ivory);

            opacity: 0.7;

        }

        .serif-statement {

            font-family: Libre, serif;

            font-size: 28px;

            line-height: 1.4;

            margin-block: 60px;

            padding-left: 40px;

            border-left: 1px solid var(--rule);

        }

        .team-ribbon {

            display: grid;

            grid-template-columns: repeat(3, 1fr);

            gap: 40px;

            padding-block: 60px;

            border-top: 1px solid var(--rule);

            border-bottom: 1px solid var(--rule);

            margin-block: 80px;

        }

        .team-member h3 {

            font-size: 20px;

            margin-bottom: 8px;

        }

        .team-member p {

            font-size: 14px;

            color: var(--slate);

            line-height: 1.6;

        }

        .next-steps {

            display: grid;

            grid-template-columns: 1fr 1fr;

            gap: 1px;

            background: var(--rule);

            margin-block: 80px;

        }

        .next-card {

            background: var(--ivory);

            padding: 60px 40px;

            transition: background 0.3s var(--ease);

        }

        .next-card:hover {

            background: var(--mist);

        }

        .next-card h2 {

            font-size: 32px;

            margin-bottom: 16px;

        }

        .site-footer {

            padding-block: 80px 40px;

            border-top: 1px solid var(--rule);

            font-size: 14px;

        }

        .footer-grid {

            display: grid;

            grid-template-columns: 1.5fr 1fr 1fr;

            gap: 60px;

        }

        .monogram-bg {

            position: absolute;

            top: 20%;

            right: -5%;

            width: 400px;

            opacity: 0.03;

            pointer-events: none;

            z-index: -1;

        }

        @media (max-width: 768px) {

            .team-ribbon, .next-steps, .footer-grid {

                grid-template-columns: 1fr;

            }

            .editorial-hero {

                padding-block: 60px 40px;

            }

            .arch-strip {

                height: 250px;

            }

            .serif-statement {

                font-size: 22px;

                padding-left: 24px;

            }

        }