:root { color-scheme: light; --green: #103d32; --orange: #ffab4f; --paper: #faf7ef; --muted: #53635b; }
    * { box-sizing: border-box; }
    body { margin: 0; background: var(--paper); color: var(--green); font-family: 'Segoe UI', Arial, sans-serif; -webkit-font-smoothing: antialiased; }
    a { color: inherit; }
    a:focus-visible { outline: 3px solid var(--green); outline-offset: 6px; }
    .page { min-height: 100svh; display: grid; grid-template-columns: 48% 52%; }
    .content { display: flex; flex-direction: column; padding: 34px clamp(28px, 4.8vw, 88px) 24px; }
    .brand { display: inline-flex; gap: 12px; align-items: center; text-decoration: none; width: fit-content; }
    .brand img { width: 56px; height: 56px; object-fit: contain; mix-blend-mode: multiply; }
    .brand span { font-size: 23px; font-weight: 800; letter-spacing: -1px; }
    .brand span b { color: #ac5a09; font-weight: inherit; }
    .copy { margin: auto 0; padding: 64px 0 52px; }
    .eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 27px; font-size: 11px; font-weight: 750; letter-spacing: 2.5px; text-transform: uppercase; }
    .eyebrow::before { content: ''; width: 8px; height: 8px; background: #d67c20; border-radius: 50%; }
    h1 { font-size: clamp(48px, 5.15vw, 82px); line-height: 1.03; font-weight: 800; letter-spacing: -.065em; margin: 0 0 28px; }
    h1 span { display: block; }
    h1 em { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; letter-spacing: -.065em; }
    .intro { max-width: 380px; font-size: 17px; line-height: 1.75; color: var(--muted); margin: 0 0 32px; }
    .contact { display: inline-flex; align-items: center; justify-content: space-between; gap: 44px; padding: 16px 24px; background: var(--orange); color: #173c2e; text-decoration: none; border-radius: 6px; font-size: 14px; font-weight: 750; transition: background .15s; }
    .contact:hover { background: #ffb969; }
    .contact span { font-size: 22px; line-height: 1; }
    .note { font-size: 12px; margin: 15px 0 0; color: var(--muted); }
    .features { border-top: 1px solid #d7ddd3; padding: 22px 0; display: flex; flex-wrap: wrap; gap: 12px 24px; list-style: none; margin: 0; font-size: 12px; font-weight: 600; }
    .features li { display: flex; align-items: center; gap: 7px; }
    .features li::before { content: '✓'; color: #577b52; }
    footer { border-top: 1px solid #d7ddd3; padding-top: 18px; font-size: 11px; color: var(--muted); display: flex; justify-content: space-between; gap: 20px; }
    .art { position: relative; min-height: 100%; overflow: hidden; background: #e2d8c8; }
    .art > img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; object-position: 76% center; }
    .art::after { content: ''; position: absolute; inset: 50% 0 0; background: linear-gradient(transparent, #182b2280); pointer-events: none; }
    .art-label { position: absolute; top: 36px; right: 34px; padding: 11px 17px; border: 1px solid #ffffff9c; border-radius: 100px; background: #fff8eced; color: #234537; font-size: 11px; letter-spacing: 1px; font-weight: 700; }
    .caption { position: absolute; z-index: 1; bottom: 48px; left: 42px; right: 42px; color: white; }
    .app-entry, .app-entry:hover { color: inherit; font: inherit; text-decoration: none; cursor: default; }
    .app-entry:focus-visible { outline: 2px solid white; outline-offset: 3px; }
    .caption p { font-size: 11px; text-transform: uppercase; letter-spacing: 2px; margin: 0 0 12px; }
    .caption strong { display: block; max-width: 400px; font-size: clamp(25px, 2.7vw, 42px); letter-spacing: -1px; font-weight: 650; line-height: 1.18; text-wrap: balance; }
    @media (min-width: 1600px) { .content { padding-left: max(70px, calc((100vw - 1440px) / 2)); } }
    @media (max-width: 900px) { .page { grid-template-columns: 1fr 1fr; } .content { padding: 26px; } .copy { padding: 55px 0 40px; } h1 { font-size: 54px; } .caption { left: 26px; right: 26px; bottom: 34px; } .features { gap: 12px; } }
    @media (max-width: 650px) { .page { grid-template-columns: 1fr; } .content { padding: 24px; } .brand img { width: 46px; height: 46px; } .brand span { font-size: 21px; } .copy { padding: 48px 0 36px; } h1 { font-size: clamp(50px, 12.7vw, 74px); } .intro { max-width: 430px; font-size: 16px; } .art { min-height: 440px; } .art > img { object-position: 80% center; } .caption { bottom: 30px; } .caption strong { font-size: 30px; max-width: 300px; } .art-label { top: 22px; right: 22px; } footer { padding-bottom: 8px; } }
    @media (prefers-reduced-motion: reduce) { .contact { transition: none; } }