:root { color-scheme: light; font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #173c30; background: #f5f3eb; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; display: flex; flex-direction: column; }
header, footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
header { padding: 36px clamp(24px, 6vw, 100px); }
.brand { display: inline-flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; font-size: 18px; font-weight: 650; letter-spacing: -.6px; }
.brand:focus-visible { outline: 2px solid #173c30; outline-offset: 6px; border-radius: 4px; }
.mark { width: 36px; height: 36px; flex: none; }
.brand-dot { color: #677c3a; }
.status { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: #4b6256; white-space: nowrap; }
.status > span { width: 6px; height: 6px; border-radius: 50%; background: #677c3a; }
main { flex: 1; width: 100%; max-width: 1600px; margin-inline: auto; padding: clamp(48px, 8vh, 110px) clamp(24px, 10vw, 160px) clamp(64px, 10vh, 130px); }
.eyebrow { margin: 0 0 32px; text-transform: uppercase; letter-spacing: .15em; font-size: 11px; font-weight: 650; }
h1 { margin: 0; font-size: clamp(60px, 9.5vw, 144px); line-height: .98; font-weight: 500; letter-spacing: -.065em; }
h1 em { font-family: Georgia, "Times New Roman", serif; font-weight: 400; letter-spacing: -.055em; color: #66733e; }
.intro { font-size: clamp(17px, 2vw, 20px); line-height: 1.6; color: #526257; margin: 36px 0 0; }
.coming-soon { display: inline-flex; align-items: center; gap: 44px; border-top: 1px solid #a4ada0; margin: 28px 0 0; padding-top: 14px; font-size: 14px; font-weight: 600; }
.coming-soon span { font-size: 20px; font-weight: 400; }
footer { margin-inline: clamp(24px, 6vw, 100px); border-top: 1px solid #d8dcd0; padding: 22px 0 26px; font-size: 11px; color: #526257; }
@media (max-width: 540px) { header { padding-top: 24px; gap: 12px; } .brand { font-size: 15px; gap: 9px; } .mark { width: 30px; height: 30px; } .status { font-size: 10px; gap: 6px; } main { padding-top: 60px; } .eyebrow { font-size: 10px; } footer { flex-wrap: wrap; gap: 10px; } }