:root {
  --ivory: #f4efe7;
  --ink: #211e1a;
  --soft-ink: #8b8175;
  --gold: #b48952;
  --line: rgba(33, 30, 26, .23);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ivory); color: var(--ink); font-family: "Fraunces", Georgia, serif; font-weight: 400; }
button, input { font: inherit; }
button, a { color: inherit; }
a { text-decoration: none; }
.site-header { height: 96px; display: flex; justify-content: space-between; align-items: center; padding: 0 15.5vw; border-bottom: 1px solid rgba(33,30,26,.12); }
.brand { display: inline-flex; flex-direction: column; align-items: center; line-height: 1; }
.brand span { font-family: "Fraunces", Georgia, serif; font-size: 17px; letter-spacing: .42em; padding-left: .42em; }
.brand small { margin-top: 5px; font-size: 5px; letter-spacing: .33em; padding-left: .33em; }
.text-link { padding: 7px 0; border: 0; border-bottom: 1px solid rgba(33,30,26,.28); background: none; font-family: "Fraunces", Georgia, serif; font-size: 10px; letter-spacing: .25em; cursor: pointer; }
.hero { min-height: 690px; padding: 88px 20px 98px; display: flex; flex-direction: column; align-items: center; text-align: center; position: relative; isolation: isolate; overflow: hidden; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -2; background: url("assets/vaelis-water-ritual.webp") 50% 48%/cover no-repeat; opacity: .54; filter: saturate(.64) sepia(.1); transform: scale(1.02); }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(244,239,231,.71), rgba(244,239,231,.43) 48%, rgba(244,239,231,.84)); }
.eyebrow { margin: 0 0 53px; color: var(--soft-ink); font-size: 10px; letter-spacing: .42em; }
h1, h2 { font-family: "Fraunces", Georgia, serif; font-weight: 400; }
h1 { margin: 0; font-size: clamp(64px, 7.2vw, 116px); line-height: .88; letter-spacing: -.045em; }
.subhead { width: 100%; margin: 52px 0 0; color: #6f665c; font-size: 17px; line-height: 1.62; position: relative; }
.subhead::before { content: ""; position: absolute; left: calc(50% - 50vw); right: calc(50% - 50vw); top: -18px; height: 1px; background: var(--line); }
.invitation { margin-top: 58px; border: 0; border-radius: 2px; padding: 20px 38px; background: var(--gold); color: #fffaf2; font-family: "Fraunces", Georgia, serif; font-size: 10px; letter-spacing: .28em; cursor: pointer; transition: background .2s ease; }
.invitation:hover, .invitation:focus-visible { background: #9e7543; }
.principles { padding: 70px 7vw; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.principles p { margin: 0; padding: 30px 34px; font-family: "Fraunces", Georgia, serif; font-size: clamp(25px, 2.25vw, 36px); line-height: 1.08; text-align: center; }
.principles p + p { border-left: 1px solid var(--line); }
.story { padding: 120px max(9vw, 30px) 125px; text-align: center; }
.story .eyebrow { margin-bottom: 42px; }
.story h2 { max-width: 900px; margin: 0 auto 56px; font-size: clamp(42px, 4.6vw, 70px); line-height: 1.02; letter-spacing: -.025em; }
.story-copy { max-width: 760px; margin: 0 auto; color: #746b61; font-size: 16px; line-height: 1.85; }
.story-copy p { margin: 0 0 28px; }
.story-copy p:last-child { margin-bottom: 0; }
.founder { padding: 112px 10vw; display: grid; grid-template-columns: .8fr 1.2fr; gap: 8vw; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); position: relative; isolation: isolate; overflow: hidden; }
.founder::before { content: ""; position: absolute; inset: 0; z-index: -2; background: url("assets/vaelis-stone-spa.webp") center 47%/cover no-repeat; opacity: .36; filter: saturate(.52) sepia(.12); }
.founder::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(244,239,231,.84), rgba(244,239,231,.53), rgba(244,239,231,.76)); }
.founder .eyebrow { max-width: 310px; margin: 10px 0 0; line-height: 1.7; }
.founder h2 { margin: 0 0 42px; font-size: clamp(45px, 4.6vw, 72px); line-height: .98; letter-spacing: -.03em; }
.founder-copy p { max-width: 570px; margin: 0; color: #746b61; font-size: 17px; line-height: 1.8; }
.evidence { padding: 105px 25px 112px; text-align: center; }
.evidence .eyebrow { margin-bottom: 42px; }
.evidence > p:not(.eyebrow) { max-width: 790px; margin: 0 auto 42px; font-family: "Fraunces", Georgia, serif; font-size: clamp(32px, 3.25vw, 52px); line-height: 1.12; }
.evidence a { padding-bottom: 6px; border-bottom: 1px solid rgba(33,30,26,.35); color: var(--soft-ink); font-size: 10px; letter-spacing: .26em; }
.founding-circle { padding: 118px 25px 128px; border-top: 1px solid var(--line); text-align: center; position: relative; isolation: isolate; overflow: hidden; }
.founding-circle::before { content: ""; position: absolute; inset: 0; z-index: -2; background: url("assets/vaelis-founders-invitation.webp") center 42%/cover no-repeat; opacity: .29; filter: saturate(.48) sepia(.14); }
.founding-circle::after { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(244,239,231,.65); }
.founding-circle .eyebrow { margin-bottom: 42px; }
.founding-circle h2 { margin: 0; font-size: clamp(56px, 6vw, 92px); line-height: .92; letter-spacing: -.04em; }
.founding-circle > p:not(.eyebrow) { max-width: 530px; margin: 42px auto 0; color: var(--soft-ink); font-size: 16px; line-height: 1.7; }
footer { min-height: 390px; padding: 78px 8vw 48px; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; border-top: 1px solid rgba(33,30,26,.08); text-align: center; }
.footer-brand { margin-bottom: 38px; }
.footer-brand span { font-size: 15px; }
.footer-line { margin: 0 0 24px; color: var(--gold); font-size: 10px; letter-spacing: .36em; }
.footer-note { margin: 0; color: var(--soft-ink); font-size: 13px; }
.legal { width: 100%; max-width: 1060px; margin-top: 58px; display: flex; justify-content: center; gap: 55px; color: #a49a8e; font-size: 9px; letter-spacing: .21em; }
.legal p { margin: 0; }
dialog { width: min(520px, calc(100vw - 36px)); padding: 62px; border: 0; background: var(--ivory); color: var(--ink); box-shadow: 0 30px 90px rgba(28,23,18,.25); }
dialog::backdrop { background: rgba(34,29,24,.42); backdrop-filter: blur(3px); }
dialog .eyebrow { margin-bottom: 25px; }
dialog h2 { margin: 0; font-size: 45px; line-height: 1.05; }
.dialog-copy { margin: 20px 0 40px; color: var(--soft-ink); font-size: 14px; }
.close { position: absolute; top: 18px; right: 22px; border: 0; background: none; font: 300 27px/1 sans-serif; cursor: pointer; }
form label { display: block; margin-bottom: 10px; font-family: "Fraunces", Georgia, serif; font-size: 8px; letter-spacing: .28em; }
form input { width: 100%; border: 0; border-bottom: 1px solid var(--ink); outline: 0; padding: 11px 0; background: transparent; }
.name-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 28px; }
form .invitation { width: 100%; margin-top: 28px; }
.consent-note { margin: 18px 0 0; color: #91877c; font-size: 10px; line-height: 1.55; }
.invitation:disabled { cursor: wait; opacity: .68; }
.form-status { min-height: 18px; margin: 20px 0 0; color: var(--soft-ink); font-size: 12px; }
@media (max-width: 760px) {
  .site-header { height: 78px; padding: 0 24px; }
  .brand span { font-size: 14px; }
  .text-link { font-size: 8px; }
  .hero { min-height: 610px; padding: 72px 23px 76px; }
  .hero::before { background-position: 49% center; opacity: .46; }
  .eyebrow { margin-bottom: 42px; font-size: 8px; letter-spacing: .33em; }
  h1 { font-size: clamp(58px, 18vw, 82px); line-height: .9; }
  h1 br { display: none; }
  .subhead { margin-top: 52px; font-size: 14px; }
  .desktop-only { display: none; }
  .invitation { margin-top: 55px; padding: 18px 26px; font-size: 9px; }
  .principles { padding: 42px 24px; grid-template-columns: 1fr; }
  .principles p { padding: 26px 5px; font-size: 32px; }
  .principles p + p { border-left: 0; border-top: 1px solid var(--line); }
  .story { padding: 82px 28px 88px; }
  .story h2 { margin-bottom: 48px; font-size: 43px; }
  .story-copy { font-size: 16px; line-height: 1.75; }
  .founder { padding: 78px 28px 84px; grid-template-columns: 1fr; gap: 38px; }
  .founder::before { background-position: 64% center; opacity: .3; }
  .founder .eyebrow { margin: 0; }
  .founder h2 { margin-bottom: 32px; font-size: 47px; }
  .founder-copy p { font-size: 16px; }
  .evidence { padding: 80px 28px 86px; }
  .evidence > p:not(.eyebrow) { font-size: 36px; }
  .founding-circle { padding: 84px 24px 94px; }
  .founding-circle::before { background-position: center 46%; opacity: .24; }
  .founding-circle h2 { font-size: 57px; }
  footer { min-height: 350px; padding: 62px 25px 36px; }
  .footer-line { max-width: 300px; line-height: 1.8; }
  .legal { margin-top: 45px; flex-direction: column; gap: 18px; line-height: 1.7; }
  dialog { padding: 50px 28px 36px; }
  dialog h2 { font-size: 40px; }
  .name-fields { grid-template-columns: 1fr; gap: 25px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
