:root { --ink: #24463e; --muted: #617872; --cream: #f5f6ee; --mint: #c9e0d1; --lavender: #dcd9eb; --line: rgba(36,70,62,.18); }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; color: var(--ink); background: var(--cream); font-family: "DM Sans", sans-serif; }
.shell { position: relative; display: flex; flex-direction: column; min-height: 100vh; max-width: 1280px; margin: 0 auto; padding: 32px 7vw 26px; overflow: hidden; }
.nav, .footer { display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 2; }
.brand { color: var(--ink); font-size: 1.35rem; font-weight: 600; letter-spacing: -.04em; text-decoration: none; }
.brand-mark { display: inline-flex; align-items: center; justify-content: center; width: 25px; height: 25px; margin-right: 2px; color: var(--cream); background: var(--ink); border-radius: 50%; font-family: Georgia, serif; font-size: 1.1rem; font-style: italic; }
.language-switcher { display: flex; gap: 8px; align-items: center; color: var(--muted); font-size: .72rem; letter-spacing: .08em; }
.language { padding: 4px 0; border: 0; color: inherit; background: transparent; font: inherit; cursor: pointer; }
.language.active { color: var(--ink); font-weight: 600; }
.hero { position: relative; z-index: 1; display: flex; flex: 1; flex-direction: column; align-items: center; justify-content: center; width: min(700px, 100%); margin: 0 auto; padding: 80px 0 100px; text-align: center; }
.eyebrow { margin: 0 0 25px; color: var(--muted); font-size: .69rem; font-weight: 600; letter-spacing: .24em; }
h1 { max-width: 680px; margin: 0; font-family: "Playfair Display", Georgia, serif; font-size: clamp(3.1rem, 7vw, 6.6rem); font-weight: 500; letter-spacing: -.055em; line-height: .98; }
.intro { max-width: 450px; margin: 32px auto 0; color: var(--muted); font-size: 1.05rem; line-height: 1.7; }
.divider { display: flex; align-items: center; gap: 14px; width: 160px; margin: 34px auto 22px; color: #a88978; }
.divider span { height: 1px; flex: 1; background: var(--line); }.divider i { font-size: .8rem; font-style: normal; }
.teaser { margin: 0 0 22px; color: var(--ink); font-size: .87rem; }
.notify-form { display: flex; width: min(440px, 100%); padding: 5px; border: 1px solid var(--line); border-radius: 50px; background: rgba(255,255,255,.42); }
.notify-form input { min-width: 0; flex: 1; padding: 13px 17px; border: 0; outline: 0; color: var(--ink); background: transparent; font: inherit; }.notify-form input::placeholder { color: #84958f; }
.notify-form button { padding: 12px 20px; border: 0; border-radius: 30px; color: #fff; background: var(--ink); font: inherit; font-size: .8rem; font-weight: 600; cursor: pointer; transition: transform .2s, background .2s; }.notify-form button:hover { background: #326055; transform: translateY(-1px); }
.form-note { margin: 12px 0 0; color: var(--muted); font-size: .72rem; }.footer { color: var(--muted); font-size: .7rem; letter-spacing: .03em; }
.orb { position: absolute; z-index: -1; border-radius: 50%; filter: blur(2px); opacity: .65; }.orb-one { width: 460px; height: 460px; top: 2%; left: -30%; background: radial-gradient(circle at 60% 40%, var(--mint), transparent 68%); }.orb-two { width: 540px; height: 540px; right: -40%; bottom: -8%; background: radial-gradient(circle at 40% 40%, var(--lavender), transparent 68%); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 520px) { .shell { padding: 25px 22px 22px; }.hero { padding: 70px 0 90px; }.intro { font-size: .96rem; }.notify-form { flex-direction: column; padding: 7px; border-radius: 17px; }.notify-form button { width: 100%; }.footer { font-size: .66rem; } }
