:root {
  --ivory: #fbf7ef;
  --ivory-2: #f4ecdf;
  --paper: #fffdf8;
  --ink: #2f1d1e;
  --ink-soft: #6f5b5b;
  --maroon: #641f22;
  --maroon-deep: #431113;
  --maroon-soft: #8d3c3e;
  --saffron: #eb8b20;
  --saffron-deep: #c86616;
  --gold: #cfa53a;
  --green: #2f7057;
  --line: rgba(75, 37, 38, 0.15);
  --line-light: rgba(255, 244, 221, 0.18);
  --font-display: "Fraunces", Georgia, serif;
  --font-body: "Inter", "Noto Sans Devanagari", system-ui, sans-serif;
  --font-dev: "Noto Serif Devanagari", Georgia, serif;
  --shadow-sm: 0 8px 28px rgba(68, 23, 24, 0.08);
  --shadow-lg: 0 28px 80px rgba(68, 23, 24, 0.16);
  --radius: 24px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; }
body {
  margin: 0;
  background: var(--ivory);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: 0.12;
  background-image: radial-gradient(rgba(92, 26, 27, .12) .55px, transparent .55px);
  background-size: 7px 7px;
  z-index: 1000;
}
a { color: inherit; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--font-display); color: var(--maroon-deep); line-height: 1.08; }
h2 { margin-bottom: 1rem; font-size: clamp(2.5rem, 5vw, 4.6rem); letter-spacing: -0.04em; }
h3 { font-size: clamp(1.55rem, 2.2vw, 2.25rem); letter-spacing: -0.025em; }
.container { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.section { padding: clamp(5.5rem, 10vw, 9rem) 0; }
.skip-link { position: fixed; left: 1rem; top: -80px; z-index: 2000; padding: .7rem 1rem; background: var(--maroon); color: #fff; border-radius: 10px; }
.skip-link:focus { top: 1rem; }

.nav {
  position: sticky;
  top: 0;
  z-index: 100;
  height: 76px;
  background: rgba(251, 247, 239, 0.86);
  border-bottom: 1px solid transparent;
  backdrop-filter: blur(18px);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.nav.is-scrolled { border-color: var(--line); box-shadow: 0 8px 30px rgba(67, 17, 19, .05); }
.nav__inner { height: 100%; display: flex; align-items: center; gap: 2rem; }
.brand { display: inline-flex; align-items: center; gap: .65rem; color: var(--maroon); text-decoration: none; flex: 0 0 auto; }
.brand__mark { width: 32px; height: 32px; }
.brand__word { font-family: var(--font-display); font-size: 1.35rem; font-weight: 700; line-height: 1; }
.nav__links { display: flex; align-items: center; gap: 1.85rem; margin-left: auto; }
.nav__links a { position: relative; color: #5d494a; font-size: .9rem; font-weight: 600; text-decoration: none; }
.nav__links a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -6px; height: 1px; background: var(--saffron); transition: right .2s ease; }
.nav__links a:hover::after, .nav__links a:focus-visible::after { right: 0; }
.nav__actions { display: flex; align-items: center; margin-left: .8rem; }
.nav__mobile-cta, .nav__toggle { display: none; }
.nav__toggle { width: 46px; height: 46px; border: 0; background: transparent; padding: 11px; cursor: pointer; }
.nav__toggle span { display: block; height: 2px; margin: 5px 0; background: var(--maroon); transition: transform .2s ease, opacity .2s ease; }

.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: .78rem 1.35rem; border: 1px solid transparent; border-radius: 999px; font-weight: 700; text-decoration: none; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.btn:hover { transform: translateY(-2px); }
.btn:focus-visible, .text-link:focus-visible, summary:focus-visible, select:focus-visible, input:focus-visible, button:focus-visible { outline: 3px solid rgba(235, 139, 32, .5); outline-offset: 3px; }
.btn--primary { background: var(--saffron); color: #351a0f; box-shadow: 0 10px 25px rgba(200, 102, 22, .22); }
.btn--primary:hover { background: #f09a36; box-shadow: 0 14px 32px rgba(200, 102, 22, .3); }
.btn--sm { min-height: 42px; padding: .58rem 1.15rem; font-size: .88rem; }
.btn--lg { min-height: 56px; padding-inline: 1.6rem; }
.btn--paper { background: var(--paper); color: var(--maroon); }
.text-link { display: inline-flex; align-items: center; gap: .45rem; color: var(--maroon); font-weight: 700; text-underline-offset: 5px; }
.text-link--light { color: #f8d9a7; }

.eyebrow { display: inline-flex; align-items: center; gap: .7rem; margin-bottom: 1.25rem; color: var(--saffron-deep); font-size: .76rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.eyebrow > span { width: 7px; height: 7px; border-radius: 50%; background: var(--saffron); box-shadow: 0 0 0 5px rgba(235, 139, 32, .14); }
.eyebrow--light { color: #f0b663; }
.hero { position: relative; min-height: calc(100vh - 76px); display: grid; align-items: center; overflow: hidden; padding: clamp(3rem, 6vw, 5rem) 0 3.5rem; }
.hero__glow { position: absolute; width: 800px; height: 800px; right: -280px; top: -300px; border-radius: 50%; background: radial-gradient(circle, rgba(235,139,32,.16), rgba(235,139,32,0) 70%); pointer-events: none; }
.hero__inner { position: relative; display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.hero__copy { max-width: 560px; }
.hero h1 { margin-bottom: 1rem; font-size: clamp(3.5rem, 6vw, 5.4rem); letter-spacing: -.055em; }
.hero h1 em { color: var(--saffron-deep); font-weight: 500; }
.hero h1 small { font-size: .58em; font-weight: 600; letter-spacing: -.035em; }
.hero__dev { margin-bottom: 1.3rem; color: var(--maroon-soft); font-family: var(--font-dev); font-size: clamp(1.05rem, 1.8vw, 1.3rem); }
.hero__sub { max-width: 570px; margin-bottom: 1.35rem; color: var(--ink-soft); font-size: clamp(1rem, 1.4vw, 1.08rem); }
.hero__cta { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
.hero__proof { display: flex; gap: .75rem 1.5rem; flex-wrap: wrap; margin: 1.5rem 0 0; padding: 1rem 0 0; border-top: 1px solid var(--line); list-style: none; color: var(--ink-soft); font-size: .8rem; font-weight: 600; }
.hero__proof li { display: flex; align-items: center; gap: .45rem; }
.hero__proof li::before { content: "✓"; display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: rgba(47, 112, 87, .12); color: var(--green); font-size: .7rem; }

.product-window { position: relative; background: var(--paper); border: 1px solid rgba(83, 37, 38, .18); border-radius: 28px; box-shadow: var(--shadow-lg); overflow: hidden; transform: rotate(1deg); }
.product-window::before { content: ""; position: absolute; inset: -1px; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(255,255,255,.8); pointer-events: none; z-index: 4; }
.product-window__bar { height: 62px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem; padding: 0 1.15rem; border-bottom: 1px solid var(--line); background: rgba(255,253,248,.92); }
.product-window__brand { display: flex; align-items: center; gap: .45rem; color: var(--maroon); font-family: var(--font-display); font-weight: 700; }
.mini-mark { position: relative; display: inline-block; width: 20px; height: 20px; border: 1.8px solid currentColor; border-radius: 50%; }
.mini-mark::before, .mini-mark::after { content: ""; position: absolute; width: 7px; height: 7px; border: 1.7px solid currentColor; border-radius: 50%; background: var(--paper); bottom: -5px; }
.mini-mark::before { left: -4px; }.mini-mark::after { right: -4px; }
.product-window__family { color: var(--ink-soft); font-size: .8rem; font-weight: 600; }
.product-window__mode { justify-self: end; padding: .3rem .65rem; border-radius: 999px; background: rgba(47,112,87,.1); color: var(--green); font-size: .68rem; font-weight: 700; }
.product-window__body { position: relative; height: 525px; overflow: hidden; background-color: #f7f1e7; background-image: radial-gradient(rgba(102,65,65,.12) .7px, transparent .7px); background-size: 18px 18px; }
.product-window__tools { position: absolute; z-index: 3; top: 16px; left: 16px; display: flex; gap: .35rem; padding: .35rem; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,253,248,.9); box-shadow: var(--shadow-sm); }
.product-window__tools span { display: grid; place-items: center; width: 32px; height: 32px; color: var(--maroon); font-size: .9rem; font-weight: 700; }
.tree-preview { position: absolute; inset: 72px 32px 88px; }
.tree-row { position: relative; z-index: 2; display: flex; justify-content: center; align-items: center; gap: 14px; }
.tree-row--two { margin-top: 72px; gap: 22px; }
.tree-row--three { margin-top: 70px; }
.person { width: 145px; min-height: 86px; padding: .8rem; border: 1px solid var(--line); border-radius: 15px; background: var(--paper); box-shadow: 0 6px 20px rgba(68,23,24,.07); text-align: center; }
.person > span { display: grid; place-items: center; width: 27px; height: 27px; margin: 0 auto .35rem; border-radius: 50%; background: var(--ivory-2); color: var(--maroon); font-size: .58rem; font-weight: 700; }
.person strong, .person small { display: block; line-height: 1.25; }
.person strong { overflow: hidden; color: var(--maroon-deep); font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.person small { margin-top: .22rem; color: var(--ink-soft); font-size: .58rem; }
.person--elder { background: #fff6df; border-color: rgba(207,165,58,.45); }
.person--focus { border-color: rgba(235,139,32,.55); box-shadow: 0 8px 26px rgba(200,102,22,.15); }
.person--you { width: 165px; background: var(--maroon); border-color: var(--maroon); }
.person--you strong { color: #fff9ed; }.person--you small { color: #e8c799; }.person--you > span { background: var(--saffron); color: var(--maroon-deep); }
.union { width: 18px; height: 2px; background: var(--saffron-deep); }
.tree-line { position: absolute; z-index: 1; background: rgba(200,102,22,.6); }
.tree-line--vertical { width: 2px; height: 74px; left: 50%; top: 82px; }
.tree-line--branch { width: 62%; height: 2px; left: 19%; top: 155px; }
.tree-line--branch::before, .tree-line--branch::after { content: ""; position: absolute; top: 0; width: 2px; height: 26px; background: inherit; }
.tree-line--branch::before { left: 0; }.tree-line--branch::after { right: 0; }
.tree-line--child { width: 2px; height: 72px; left: 50%; top: 242px; }
.product-window__caption { position: absolute; left: 18px; right: 18px; bottom: 16px; z-index: 3; display: flex; align-items: flex-start; gap: .75rem; padding: .85rem 1rem; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,253,248,.93); backdrop-filter: blur(10px); box-shadow: var(--shadow-sm); }
.product-window__caption p { margin: 0; color: var(--ink-soft); font-size: .74rem; line-height: 1.45; }.product-window__caption strong { color: var(--maroon); }
.status-dot { display: inline-block; flex: 0 0 auto; width: 9px; height: 9px; margin-top: .35rem; border-radius: 50%; background: #3c956f; box-shadow: 0 0 0 5px rgba(60,149,111,.13); }

.principles { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(255,253,248,.58); }
.principles__grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.principles p { margin: 0; padding: 1.5rem 1.2rem; border-right: 1px solid var(--line); }.principles p:first-child { padding-left: 0; }.principles p:last-child { border-right: 0; }
.principles strong, .principles span { display: block; }.principles strong { color: var(--maroon); font-size: .82rem; }.principles span { margin-top: .2rem; color: var(--ink-soft); font-size: .7rem; line-height: 1.45; }

.section-head { max-width: 780px; margin-bottom: 3.4rem; }
.section-head > p { color: var(--ink-soft); font-size: 1.05rem; }
.section-head--split { display: grid; grid-template-columns: 1.15fr .85fr; gap: 5rem; max-width: none; align-items: end; }.section-head--split > p { margin: 0 0 .8rem; }
.bento { display: grid; grid-template-columns: 1.25fr .75fr; grid-template-areas: "tree archive" "tree ritual" "elder elder"; gap: 1rem; }
.bento-card { position: relative; overflow: hidden; padding: clamp(1.7rem, 3vw, 2.6rem); border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); box-shadow: var(--shadow-sm); }
.bento-card h3 { margin-bottom: .8rem; }.bento-card > p, .bento-card__copy > p:last-child { color: var(--ink-soft); }
.bento-card--tree { grid-area: tree; min-height: 630px; background: var(--maroon-deep); }.bento-card--tree h3, .bento-card--tree .card-kicker { color: #fff3db; }.bento-card--tree .bento-card__copy > p:last-child { color: #cdb7ae; max-width: 540px; }
.bento-card--archive { grid-area: archive; }.bento-card--ritual { grid-area: ritual; }.bento-card--elder { grid-area: elder; display: grid; grid-template-columns: .65fr 1fr 1.3fr auto; align-items: center; gap: 1.6rem; }.bento-card--elder h3, .bento-card--elder p { margin-bottom: 0; }
.card-label { display: flex; justify-content: flex-end; margin-bottom: 1.3rem; }.card-label span { padding: .35rem .65rem; border: 1px solid rgba(47,112,87,.2); border-radius: 999px; background: rgba(47,112,87,.08); color: var(--green); font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }.bento-card--tree .card-label span { border-color: var(--line-light); background: rgba(255,255,255,.07); color: #f0b663; }
.card-kicker { margin-bottom: .65rem; color: var(--saffron-deep); font-size: .72rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.branch-demo { position: absolute; left: 2.6rem; right: 2.6rem; bottom: 2.6rem; height: 270px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; align-items: end; padding-top: 82px; }
.branch-demo::before { content: ""; position: absolute; left: 16%; right: 16%; top: 120px; height: 1px; background: rgba(240,182,99,.45); }.branch-demo::after { content: ""; position: absolute; left: 50%; top: 69px; height: 52px; width: 1px; background: rgba(240,182,99,.45); }
.branch-demo span { position: relative; z-index: 1; padding: 1rem; border: 1px solid var(--line-light); border-radius: 15px; background: rgba(255,255,255,.07); color: #fff2dc; font-family: var(--font-dev); text-align: center; }.branch-demo span::before { content: ""; position: absolute; left: 50%; bottom: 100%; height: 45px; width: 1px; background: rgba(240,182,99,.45); }.branch-demo small { color: #cdb7ae; font-family: var(--font-body); }.branch-demo .branch-demo__root { position: absolute; left: 50%; top: 0; width: 110px; transform: translateX(-50%); background: var(--saffron); color: var(--maroon-deep); font-family: var(--font-body); font-weight: 700; }.branch-demo .branch-demo__root::before { display: none; }
.memory-note { display: flex; align-items: center; gap: .8rem; margin-top: 1.6rem; padding: .85rem; border: 1px solid var(--line); border-radius: 14px; background: var(--ivory); }.memory-note__avatar { display: grid; place-items: center; flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%; background: var(--maroon); color: #fff4df; font-size: .7rem; font-weight: 700; }.memory-note p, .memory-note strong, .memory-note small { display: block; margin: 0; line-height: 1.35; }.memory-note strong { color: var(--maroon); font-size: .78rem; }.memory-note small { color: var(--ink-soft); font-size: .65rem; }
.date-chip { display: inline-flex; align-items: center; gap: .8rem; margin-top: 1.2rem; padding: .7rem .9rem; border-radius: 14px; background: #fff3d5; }.date-chip > span { font-family: var(--font-display); color: var(--maroon); font-size: 2rem; font-weight: 700; }.date-chip p, .date-chip strong, .date-chip small { display: block; margin: 0; line-height: 1.2; }.date-chip strong { color: var(--saffron-deep); font-size: .72rem; text-transform: uppercase; }.date-chip small { color: var(--ink-soft); font-size: .7rem; }
.voice-sample { display: inline-flex; align-items: center; gap: .55rem; padding: .75rem 1rem; border: 1px solid var(--line); border-radius: 999px; background: var(--ivory); color: var(--maroon); font-weight: 700; cursor: pointer; }.voice-sample:hover { background: var(--ivory-2); }

.engine { background: var(--maroon-deep); color: #f3dfd0; }
.engine__grid { display: grid; grid-template-columns: 1fr .9fr; gap: clamp(3rem, 8vw, 8rem); align-items: center; }.engine h2 { color: #fff5e4; }.engine__copy > p:not(.eyebrow) { max-width: 580px; color: #d7c0b7; font-size: 1.05rem; }
.engine__quote { display: flex; align-items: center; gap: 1.2rem; margin-top: 2rem; padding-top: 1.8rem; border-top: 1px solid var(--line-light); }.engine__quote > span { color: #f5bc69; font-family: var(--font-dev); font-size: 2.8rem; font-weight: 700; }.engine__quote p { max-width: 300px; margin: 0; color: #d7c0b7; font-size: .86rem; }
.relation-tool { padding: clamp(1.7rem, 3vw, 2.5rem); border: 1px solid var(--line-light); border-radius: var(--radius); background: #fff9ed; color: var(--ink); box-shadow: 0 24px 60px rgba(0,0,0,.22); }
.relation-tool label { display: block; margin-bottom: .55rem; color: var(--maroon); font-size: .82rem; font-weight: 700; }.relation-tool select { width: 100%; padding: .85rem 2.5rem .85rem 1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); color: var(--ink); }
.relation-result { margin: 1.4rem 0 1rem; padding: 1.6rem; border-radius: 18px; background: var(--maroon); color: #fff; text-align: center; }.relation-result__side { display: block; margin-bottom: .45rem; color: #efc287; font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }.relation-result strong { display: block; color: #ffd499; font-family: var(--font-dev); font-size: 2.7rem; line-height: 1.2; }.relation-result h3 { margin: .15rem 0 0; color: #fff; font-size: 1.4rem; }
.relation-regions { display: grid; grid-template-columns: repeat(3, 1fr); gap: .55rem; }.engine__region { padding: .65rem; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); text-align: center; }.engine__region-label, .engine__region-term { display: block; }.engine__region-label { color: var(--ink-soft); font-size: .58rem; text-transform: uppercase; }.engine__region-term { margin-top: .15rem; color: var(--maroon); font-size: .72rem; font-weight: 700; }.relation-tool__note { margin: 1rem 0 0; color: var(--ink-soft); font-size: .72rem; line-height: 1.5; }

.how .section-head { max-width: 900px; }.steps { margin: 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }.steps li { display: grid; grid-template-columns: .25fr .75fr; gap: 2rem; padding: 2.2rem 0; border-bottom: 1px solid var(--line); }.steps__num { color: var(--saffron-deep); font-family: var(--font-display); font-size: 1.8rem; }.steps h3 { margin-bottom: .55rem; }.steps p { max-width: 630px; margin: 0; color: var(--ink-soft); }

.privacy { padding-top: 0; }.privacy__panel { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2.5rem, 7vw, 7rem); padding: clamp(2.5rem, 6vw, 5.5rem); border-radius: 32px; background: var(--maroon); color: #efdcd0; box-shadow: var(--shadow-lg); }.privacy h2 { color: #fff5e4; }.privacy__copy > p:not(.eyebrow) { color: #d9bdb5; }.privacy__list { margin: 0; padding: 0; list-style: none; }.privacy__list li { display: flex; gap: 1rem; padding: 1.1rem 0; border-bottom: 1px solid var(--line-light); }.privacy__list li:first-child { padding-top: 0; }.privacy__list li > span { color: #efb75f; font-family: var(--font-display); font-size: 1.15rem; }.privacy__list p, .privacy__list strong, .privacy__list small { display: block; margin: 0; }.privacy__list strong { color: #fff3dd; }.privacy__list small { margin-top: .3rem; color: #d3b6af; font-size: .82rem; line-height: 1.45; }

.beta { background: var(--ivory-2); }.beta__grid { display: grid; grid-template-columns: 1fr .85fr; gap: clamp(3rem, 8vw, 8rem); align-items: start; }.beta .section-head { margin-bottom: 0; }.beta__status { padding: 2rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); box-shadow: var(--shadow-sm); }.beta__status-title { display: flex; gap: .75rem; align-items: center; color: var(--maroon); font-weight: 700; }.beta__status ul { margin: 1.3rem 0; padding: 0; list-style: none; }.beta__status li { position: relative; padding: .65rem 0 .65rem 1.7rem; border-bottom: 1px solid var(--line); color: var(--ink-soft); }.beta__status li::before { content: "✓"; position: absolute; left: 0; color: var(--green); font-weight: 700; }.beta__status-note { margin: 0; color: var(--ink-soft); font-size: .8rem; }

.faq__grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: clamp(3rem, 8vw, 8rem); }.faq .section-head { position: sticky; top: 116px; align-self: start; }.faq__items details { border-top: 1px solid var(--line); }.faq__items details:last-child { border-bottom: 1px solid var(--line); }.faq__items summary { position: relative; padding: 1.45rem 2.5rem 1.45rem 0; color: var(--maroon-deep); font-family: var(--font-display); font-size: 1.25rem; font-weight: 600; cursor: pointer; list-style: none; }.faq__items summary::-webkit-details-marker { display: none; }.faq__items summary::after { content: "+"; position: absolute; right: .2rem; color: var(--saffron-deep); font-family: var(--font-body); font-size: 1.35rem; }.faq__items details[open] summary::after { content: "−"; }.faq__items details p { padding: 0 2.5rem 1.4rem 0; color: var(--ink-soft); }

.waitlist { padding-top: 0; }.waitlist__panel { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(2.5rem, 7vw, 7rem); align-items: center; padding: clamp(2.5rem, 6vw, 5rem); border-radius: 32px; background: var(--maroon-deep); color: #e8cec2; }.waitlist h2 { color: #fff4df; }.waitlist__form label { display: block; margin-bottom: .55rem; color: #f4d4a5; font-size: .82rem; font-weight: 700; }.waitlist__row { display: flex; gap: .6rem; }.waitlist input { min-width: 0; flex: 1; padding: 1rem 1.15rem; border: 1px solid var(--line-light); border-radius: 999px; background: rgba(255,255,255,.1); color: #fff; }.waitlist input::placeholder { color: #b99b92; }.waitlist__note { margin: .8rem 0 0; color: #bfa39a; font-size: .75rem; }.waitlist__note.is-success { color: #c9e7d7; }.honeypot { position: absolute; left: -9999px; }

.footer { padding: 4rem 0 2rem; border-top: 1px solid var(--line); background: #f5eddf; }.footer__grid { display: grid; grid-template-columns: 1fr .5fr .5fr; gap: 3rem; }.brand--footer .mini-mark { color: var(--maroon); }.footer__grid > div > p { max-width: 360px; margin: 1rem 0 0; color: var(--ink-soft); font-size: .85rem; }.footer nav { display: flex; flex-direction: column; gap: .65rem; }.footer nav a { color: var(--ink-soft); font-size: .82rem; text-decoration: none; }.footer nav a:hover { color: var(--maroon); }.footer__bottom { display: flex; justify-content: space-between; margin-top: 3rem; padding-top: 1.2rem; border-top: 1px solid var(--line); color: var(--ink-soft); font-size: .72rem; }

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; }.reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 1020px) {
  .nav__links { gap: 1.1rem; }.nav__links a { font-size: .82rem; }
  .hero__inner { grid-template-columns: 1fr; }.hero__copy { max-width: 720px; }.product-window { width: min(760px, 100%); margin-inline: auto; transform: none; }
  .bento-card--elder { grid-template-columns: 1fr 1fr; }.bento-card--elder .card-label { grid-column: 1 / -1; justify-content: flex-start; }.bento-card--elder .voice-sample { justify-self: start; }
}

@media (max-width: 820px) {
  .container { width: min(100% - 32px, 680px); }
  .nav__links { position: fixed; left: 16px; right: 16px; top: 68px; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: .75rem; border: 1px solid var(--line); border-radius: 18px; background: var(--paper); box-shadow: var(--shadow-lg); }.nav__links.is-open { display: flex; }.nav__links a { padding: .85rem 1rem; border-bottom: 1px solid var(--line); font-size: .95rem; }.nav__links a::after { display: none; }.nav__links a:last-child { border: 0; }.nav__mobile-cta { display: block !important; margin-top: .5rem; border-radius: 12px; background: var(--saffron); color: var(--maroon-deep) !important; text-align: center; }
  .nav__actions > .btn { display: none; }.nav__toggle { display: block; }.nav__toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }.nav__toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }.nav__toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .principles__grid { grid-template-columns: 1fr 1fr; }.principles p:nth-child(2) { border-right: 0; }.principles p:nth-child(-n+2) { border-bottom: 1px solid var(--line); }.principles p:first-child, .principles p:nth-child(3) { padding-left: 0; }
  .section-head--split, .engine__grid, .privacy__panel, .beta__grid, .faq__grid, .waitlist__panel { grid-template-columns: 1fr; }.section-head--split { gap: 1rem; }.faq .section-head { position: static; }.faq__grid { gap: 1rem; }
  .bento { grid-template-columns: 1fr; grid-template-areas: "tree" "archive" "ritual" "elder"; }.bento-card--elder { display: block; }.bento-card--elder > * { margin-bottom: 1rem; }.bento-card--elder .card-label { justify-content: flex-end; }
  .footer__grid { grid-template-columns: 1fr 1fr; }.footer__grid > div { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
  html { scroll-padding-top: 70px; }.nav { height: 68px; }.brand__word { font-size: 1.2rem; }
  .section { padding: 5rem 0; }.hero { min-height: auto; padding: 3.8rem 0 4rem; }.hero h1 { font-size: clamp(3.15rem, 16vw, 4.6rem); }.hero__cta { align-items: stretch; flex-direction: column; }.hero__cta .btn { width: 100%; }.hero__cta .text-link { justify-content: center; }.hero__proof { display: grid; grid-template-columns: 1fr; }
  .product-window__bar { grid-template-columns: 1fr auto; }.product-window__family { display: none; }.product-window__body { height: 470px; }.product-window__tools { top: 10px; left: 10px; }.tree-preview { inset: 66px 10px 80px; }.tree-row--one { gap: 6px; }.tree-row--two { gap: 6px; margin-top: 64px; }.tree-row--three { margin-top: 60px; }.person { width: 98px; min-height: 73px; padding: .55rem .35rem; }.person strong { font-size: .61rem; }.person small { font-size: .49rem; }.person > span { width: 22px; height: 22px; }.person--you { width: 120px; }.tree-line--vertical { top: 72px; height: 66px; }.tree-line--branch { top: 137px; width: 68%; left: 16%; }.tree-line--child { top: 216px; height: 64px; }.product-window__caption { left: 10px; right: 10px; bottom: 10px; }
  .principles__grid { grid-template-columns: 1fr; }.principles p { padding: 1rem 0 !important; border-right: 0; border-bottom: 1px solid var(--line); }.principles p:last-child { border-bottom: 0; }
  .bento-card--tree { min-height: 570px; }.branch-demo { left: 1rem; right: 1rem; bottom: 1.5rem; gap: .45rem; }.branch-demo span { padding: .7rem .3rem; font-size: .85rem; }
  .relation-regions { grid-template-columns: 1fr; }.engine__quote { align-items: flex-start; flex-direction: column; }.steps li { grid-template-columns: 1fr; gap: .6rem; }.privacy__panel, .waitlist__panel { width: calc(100% - 20px); padding: 2rem 1.3rem; border-radius: 24px; }.waitlist__row { flex-direction: column; }.waitlist input { min-height: 54px; }.footer__grid { grid-template-columns: 1fr; }.footer__grid > div { grid-column: auto; }.footer__bottom { align-items: flex-start; flex-direction: column; gap: .4rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }.reveal { opacity: 1; transform: none; transition: none; }.btn, .nav, .nav__toggle span { transition: none; }
}

/* ================================================================
   LIVING ARCHIVE — 2026 DESIGN SYSTEM
   A contemporary editorial system inspired by family ledgers,
   botanical archives and the warmth of a well-used home library.
   ================================================================ */
:root {
  --ivory: #f3efe5;
  --ivory-2: #e8e1d4;
  --paper: #fbf8f1;
  --ink: #19241f;
  --ink-soft: #606b65;
  --maroon: #1f4a3d;
  --maroon-deep: #16372f;
  --maroon-soft: #507468;
  --saffron: #d66d45;
  --saffron-deep: #b65334;
  --gold: #c8a75f;
  --green: #2f6f59;
  --line: rgba(25, 48, 39, .16);
  --line-light: rgba(246, 239, 221, .2);
  --font-display: "Newsreader", Georgia, serif;
  --font-body: "Manrope", "Noto Sans Devanagari", system-ui, sans-serif;
  --shadow-sm: 0 10px 32px rgba(22, 55, 47, .08);
  --shadow-lg: 0 35px 90px rgba(13, 42, 34, .22);
  --radius: 16px;
}

body {
  background-color: var(--ivory);
  background-image:
    linear-gradient(rgba(31, 74, 61, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(31, 74, 61, .025) 1px, transparent 1px);
  background-size: 32px 32px;
  color: var(--ink);
  letter-spacing: -.008em;
}
body::before { display: none; }
h1, h2, h3 { color: var(--maroon-deep); font-weight: 500; }
h2 { letter-spacing: -.045em; }
.container { width: min(1260px, calc(100% - 64px)); }

.nav {
  height: 88px;
  background: rgba(243, 239, 229, .9);
  border-bottom: 1px solid rgba(31, 74, 61, .08);
  backdrop-filter: blur(20px) saturate(120%);
}
.nav.is-scrolled { border-color: var(--line); box-shadow: 0 12px 36px rgba(22, 55, 47, .06); }
.brand { color: var(--maroon-deep); gap: .75rem; }
.brand__mark { width: 35px; height: 35px; }
.brand__word { font-size: 1.5rem; font-weight: 600; letter-spacing: -.035em; }
.nav__links { gap: 2rem; }
.nav__links a { color: #41544c; font-size: .78rem; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.nav__links a::after { bottom: -10px; background: var(--saffron); }

.btn { min-height: 50px; border-radius: 10px; font-size: .84rem; font-weight: 800; letter-spacing: .01em; }
.btn--primary { background: var(--saffron); color: #fffaf3; box-shadow: 0 12px 28px rgba(182, 83, 52, .22); }
.btn--primary:hover { background: #e07950; box-shadow: 0 16px 36px rgba(182, 83, 52, .28); }
.btn--sm { min-height: 44px; padding-inline: 1.25rem; }
.btn--lg { min-height: 58px; padding-inline: 1.7rem; }
.text-link { color: inherit; font-size: .84rem; text-decoration-color: currentColor; }
.eyebrow { color: var(--saffron); font-size: .69rem; letter-spacing: .2em; }
.eyebrow > span { border-radius: 2px; background: var(--saffron); box-shadow: 0 0 0 5px rgba(214, 109, 69, .15); transform: rotate(45deg); }

.hero {
  min-height: calc(100vh - 88px);
  padding: 22px 0 72px;
  overflow: visible;
}
.hero::after {
  content: "A living archive for every generation";
  position: absolute;
  right: 1.5rem;
  bottom: 2.3rem;
  color: var(--ink-soft);
  font-size: .64rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  writing-mode: vertical-rl;
}
.hero__glow { display: none; }
.hero__inner {
  position: relative;
  grid-template-columns: .88fr 1.12fr;
  gap: clamp(2rem, 5vw, 5.5rem);
  min-height: min(760px, calc(100vh - 132px));
  padding: clamp(3rem, 5vw, 5.4rem);
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 30px;
  background:
    radial-gradient(circle at 12% 12%, rgba(200,167,95,.13), transparent 30%),
    linear-gradient(135deg, #173a31 0%, #102d27 100%);
  box-shadow: 0 30px 80px rgba(17, 50, 42, .2);
  overflow: hidden;
}
.hero__inner::before {
  content: "वंश · स्मृति · विरासत";
  position: absolute;
  left: clamp(3rem, 5vw, 5.4rem);
  bottom: 1.1rem;
  color: rgba(246, 239, 221, .28);
  font-family: var(--font-dev);
  font-size: .75rem;
  letter-spacing: .12em;
}
.hero__copy { position: relative; z-index: 2; max-width: 590px; }
.hero .eyebrow { color: #e7a384; }
.hero h1 { margin: 0 0 1.35rem; color: #f8f3e8; font-size: clamp(4rem, 6.4vw, 6.2rem); font-weight: 500; letter-spacing: -.065em; line-height: .92; }
.hero h1 em { color: #e99b78; font-weight: 400; }
.hero h1 small { display: block; margin-top: .8em; color: #d7cdb9; font-family: var(--font-body); font-size: .19em; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.hero__dev { color: #d9b878; font-size: 1.1rem; }
.hero__sub { color: #bdc9c3; font-size: 1rem; line-height: 1.75; }
.hero .text-link { color: #f4ead8; }
.hero__proof { border-top-color: rgba(255,255,255,.12); color: #aebdb6; }
.hero__proof li::before { border-radius: 4px; background: rgba(200,167,95,.15); color: #d7b975; }

.product-window {
  border: 8px solid rgba(255,255,255,.08);
  border-radius: 22px;
  background: var(--paper);
  box-shadow: 0 45px 90px rgba(0,0,0,.3);
  transform: rotate(-1.5deg) translateY(12px);
}
.product-window::before { box-shadow: inset 0 0 0 1px rgba(23,58,49,.1); }
.product-window__bar { height: 58px; background: #f2ecdf; }
.product-window__brand { color: var(--maroon-deep); }
.product-window__mode { border-radius: 6px; background: rgba(47,111,89,.12); color: var(--green); }
.product-window__body { height: 520px; background-color: #e9e2d5; background-image: radial-gradient(rgba(31,74,61,.15) .7px, transparent .7px); }
.product-window__tools { border-radius: 9px; background: rgba(251,248,241,.94); }
.product-window__tools span { color: var(--maroon-deep); }
.person { border-radius: 10px; background: #fbf8f1; box-shadow: 0 8px 22px rgba(22,55,47,.1); }
.person > span { background: #e8e1d4; color: var(--maroon-deep); }
.person strong { color: var(--maroon-deep); }
.person--elder { background: #f5ead0; border-color: rgba(200,167,95,.55); }
.person--focus { border-color: rgba(214,109,69,.65); box-shadow: 0 10px 28px rgba(182,83,52,.16); }
.person--you { background: var(--maroon-deep); border-color: var(--maroon-deep); }
.person--you > span { background: var(--saffron); color: #fff; }
.person--you strong { color: #fff; }
.person--you small { color: #c8d2cd; }
.union, .tree-line { background: rgba(182,83,52,.66); }
.product-window__caption { border-radius: 10px; background: rgba(251,248,241,.94); }
.product-window__caption strong { color: var(--maroon-deep); }

@media (max-width: 1020px) {
  .hero__inner { grid-template-columns: 1fr; min-height: auto; padding: 4rem; }
  .product-window { transform: none; }
  .hero::after { display: none; }
}
@media (max-width: 820px) {
  .container { width: min(100% - 28px, 680px); }
  .nav { height: 74px; }
  .nav__links { top: 70px; border-radius: 12px; background: var(--paper); }
  .nav__mobile-cta { border-radius: 8px; background: var(--saffron); color: #fff !important; }
  .hero { min-height: auto; padding-top: 14px; }
  .hero__inner { padding: 3.2rem 2rem; border-radius: 22px; }
}
@media (max-width: 560px) {
  .nav { height: 68px; }
  .hero { padding: 10px 0 56px; }
  .hero__inner { padding: 2.6rem 1.3rem 3.2rem; }
  .hero__inner::before { left: 1.3rem; bottom: .8rem; }
  .hero h1 { font-size: clamp(3.5rem, 17vw, 5rem); }
  .product-window { border-width: 5px; border-radius: 16px; }
  .product-window__body { height: 430px; }
}

/* ---------- Landing composition ---------- */
.section { padding: clamp(6rem, 10vw, 10rem) 0; }
.principles {
  border: 0;
  background: var(--paper);
}
.principles__grid { border-left: 1px solid var(--line); border-right: 1px solid var(--line); }
.principles p { position: relative; min-height: 132px; padding: 2rem 1.6rem; }
.principles p::before { display: block; margin-bottom: 1.25rem; color: var(--saffron); font-family: var(--font-display); font-size: .75rem; }
.principles p:nth-child(1)::before { content: "01"; }
.principles p:nth-child(2)::before { content: "02"; }
.principles p:nth-child(3)::before { content: "03"; }
.principles p:nth-child(4)::before { content: "04"; }
.principles strong { color: var(--maroon-deep); font-size: .76rem; letter-spacing: .04em; text-transform: uppercase; }
.principles span { margin-top: .45rem; font-size: .73rem; }

.section-head { margin-bottom: 4.5rem; }
.section-head h2 { max-width: 850px; }
.section-head > p { color: var(--ink-soft); line-height: 1.75; }
.section-head--split { grid-template-columns: 1fr .72fr; gap: 7rem; align-items: end; }

.product { background: #f7f3ea; }
.bento { grid-template-columns: 1.2fr .8fr; gap: 1.25rem; }
.bento-card {
  border-color: rgba(31,74,61,.14);
  border-radius: 14px;
  box-shadow: none;
  transition: transform .25s ease, box-shadow .25s ease;
}
.bento-card:hover { transform: translateY(-4px); box-shadow: 0 24px 60px rgba(22,55,47,.1); }
.bento-card--tree {
  min-height: 660px;
  background:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px),
    #173a31;
  background-size: 28px 28px;
}
.bento-card--tree h3, .bento-card--tree .card-kicker { color: #f5efe3; }
.bento-card--tree .bento-card__copy > p:last-child { color: #b9c6c0; }
.bento-card--archive { background: #ede4d4; }
.bento-card--ritual { background: #f8f0df; }
.bento-card--elder { background: #dce6df; }
.card-label { justify-content: flex-start; }
.card-label span { border-radius: 5px; background: transparent; color: var(--green); }
.bento-card--tree .card-label span { color: #e6b38f; }
.card-kicker { color: var(--saffron); }
.branch-demo::before, .branch-demo::after, .branch-demo span::before { background: rgba(214,109,69,.55); }
.branch-demo span { border-radius: 8px; background: rgba(255,255,255,.06); color: #f5efe3; }
.branch-demo small { color: #b9c6c0; }
.branch-demo .branch-demo__root { border-radius: 8px; background: var(--saffron); color: #fff; }
.memory-note { border-radius: 8px; background: rgba(251,248,241,.68); }
.memory-note__avatar { background: var(--maroon-deep); }
.memory-note strong { color: var(--maroon-deep); }
.date-chip { border-radius: 8px; background: #eed8b9; }
.date-chip > span { color: var(--maroon-deep); }
.voice-sample { border-radius: 8px; background: rgba(251,248,241,.58); color: var(--maroon-deep); }

.engine {
  position: relative;
  background: #302b3d;
  color: #efe9df;
  overflow: hidden;
}
.engine::before {
  content: "RELATIONSHIP / 53 KINSHIP KEYS";
  position: absolute;
  left: 50%;
  top: 2rem;
  color: rgba(255,255,255,.12);
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .22em;
  transform: translateX(-50%);
}
.engine h2 { color: #fffaf0; }
.engine__copy > p:not(.eyebrow) { color: #c9c2cc; }
.engine__quote { border-top-color: rgba(255,255,255,.14); }
.engine__quote > span { color: #e99b78; }
.engine__quote p { color: #c9c2cc; }
.relation-tool { border-radius: 14px; background: #f5efe3; box-shadow: 26px 26px 0 rgba(214,109,69,.18); }
.relation-tool label { color: var(--maroon-deep); }
.relation-tool select { border-radius: 8px; }
.relation-result { border-radius: 10px; background: var(--maroon-deep); }
.relation-result__side, .relation-result strong { color: #e8b98f; }
.engine__region { border-radius: 7px; }
.engine__region-term { color: var(--maroon-deep); }

.how { position: relative; background: var(--ivory); }
.how::before { content: "HOW FAMILIES GROW"; position: absolute; right: 3vw; top: 6rem; color: rgba(31,74,61,.14); font-size: .63rem; font-weight: 800; letter-spacing: .2em; writing-mode: vertical-rl; }
.steps { counter-reset: steps; border-top-color: var(--maroon-deep); }
.steps li { grid-template-columns: 150px 1fr; gap: 3.5rem; padding: 2.8rem 0; transition: padding .25s ease, background .25s ease; }
.steps li:hover { padding-inline: 1.5rem; background: rgba(251,248,241,.55); }
.steps__num { color: var(--saffron); font-size: 2.2rem; }
.steps h3 { font-size: clamp(1.8rem, 3vw, 2.8rem); }
.steps p { line-height: 1.75; }

.privacy { background: #f7f3ea; }
.privacy__panel {
  position: relative;
  border-radius: 16px;
  background:
    radial-gradient(circle at 85% 15%, rgba(200,167,95,.15), transparent 25%),
    #173a31;
  box-shadow: none;
  overflow: hidden;
}
.privacy__panel::after { content: "PRIVATE BY DEFAULT"; position: absolute; right: -2rem; bottom: 2.6rem; color: rgba(255,255,255,.08); font-family: var(--font-display); font-size: clamp(3rem, 7vw, 7rem); line-height: .8; transform: rotate(-90deg); transform-origin: bottom right; }
.privacy h2 { color: #f7f1e5; }
.privacy__copy > p:not(.eyebrow) { color: #b9c6c0; }
.privacy__list li { border-bottom-color: rgba(255,255,255,.12); }
.privacy__list li > span { color: #e99b78; }
.privacy__list strong { color: #f7f1e5; }
.privacy__list small { color: #aebdb6; }

.beta { background: #dfe7e1; }
.beta__status { border-radius: 12px; background: rgba(251,248,241,.82); box-shadow: none; }
.beta__status-title { color: var(--maroon-deep); }
.beta__status li { border-bottom-color: rgba(31,74,61,.12); }

.faq { background: var(--paper); }
.faq__items details { border-color: var(--line); }
.faq__items summary { color: var(--maroon-deep); font-size: 1.4rem; font-weight: 500; }
.faq__items summary::after { color: var(--saffron); }

.waitlist { background: var(--paper); }
.waitlist__panel {
  border-radius: 14px;
  background: var(--saffron);
  color: #feeede;
  box-shadow: 24px 24px 0 #173a31;
}
.waitlist h2 { color: #fffaf3; }
.waitlist .eyebrow { color: #fff0e7; }
.waitlist .btn--paper { border-radius: 9px; color: var(--maroon-deep); }
.waitlist__note { color: #ffe3d4; }

.footer { border-top: 0; background: #102d27; color: #d8e0dc; }
.brand--footer { color: #f4ecdd; }
.brand--footer .mini-mark { color: #e99b78; }
.footer__grid > div > p, .footer nav a, .footer__bottom { color: #9eb0a8; }
.footer nav a:hover { color: #fff; }
.footer__bottom { border-top-color: rgba(255,255,255,.12); }

@media (max-width: 820px) {
  .section-head--split { gap: 1.4rem; }
  .engine::before, .how::before { display: none; }
  .relation-tool { box-shadow: 12px 12px 0 rgba(214,109,69,.18); }
  .privacy__panel::after { display: none; }
  .waitlist__panel { box-shadow: 10px 10px 0 #173a31; }
}
@media (max-width: 560px) {
  .section { padding: 5.5rem 0; }
  .principles__grid { border-inline: 0; }
  .principles p { min-height: auto; }
  .bento-card--tree { min-height: 590px; }
  .steps li { grid-template-columns: 1fr; gap: .3rem; }
  .steps li:hover { padding-inline: .6rem; }
  .privacy__panel, .waitlist__panel { width: calc(100% - 16px); border-radius: 12px; }
}

/* ================================================================
   REFINEMENT PASS — calmer rhythm and dependable responsive layout
   ================================================================ */
.section { padding: clamp(4.75rem, 7vw, 7rem) 0; }
.section-head { margin-bottom: clamp(2.4rem, 4vw, 3.5rem); }
.section-head--split { gap: clamp(2rem, 5vw, 5rem); }
.hero { min-height: auto; padding-bottom: 56px; }
.hero__inner { min-height: 680px; padding: clamp(2.8rem, 4.5vw, 4.5rem); }
.hero h1 { font-size: clamp(4rem, 6vw, 5.75rem); }
.product-window__body { height: 470px; }
.bento-card--tree { min-height: 570px; }
.steps li { padding-block: 2.15rem; }

@media (max-width: 1020px) {
  .section-head--split,
  .engine__grid,
  .privacy__panel,
  .beta__grid,
  .faq__grid,
  .waitlist__panel { grid-template-columns: 1fr; }
  .section-head--split { gap: .9rem; }
  .faq .section-head { position: static; }
  .faq__grid { gap: 1rem; }
  .principles__grid { grid-template-columns: repeat(2, 1fr); }
  .principles p:nth-child(2) { border-right: 0; }
  .principles p:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .bento {
    grid-template-columns: 1fr 1fr;
    grid-template-areas: "tree tree" "archive ritual" "elder elder";
  }
  .bento-card--tree { min-height: 520px; }
  .bento-card--elder { grid-template-columns: .7fr 1fr 1.2fr auto; }
  .privacy__panel, .waitlist__panel { gap: 2.25rem; }
  .footer__grid { grid-template-columns: 1fr 1fr; }
  .footer__grid > div { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
  .nav { height: 68px; }
  .nav__links { top: 64px; }
  .hero { padding: 10px 0 42px; }
  .hero__inner { gap: 2.25rem; padding: 2.6rem 2rem 3rem; }
  .hero__inner::before { left: 2rem; }
  .hero h1 { font-size: clamp(3.8rem, 10vw, 4.8rem); }
  .product-window { width: 100%; }
  .product-window__body { height: 390px; }
  .section { padding: 4.75rem 0; }
}

@media (max-width: 600px) {
  .container { width: min(100% - 32px, 680px); }
  .hero__inner { gap: 1.75rem; padding: 2rem 1.25rem 2.25rem; border-radius: 18px; }
  .hero__inner::before { display: none; }
  .hero h1 { margin-bottom: 1rem; font-size: clamp(3.15rem, 14vw, 3.6rem); line-height: .94; }
  .hero h1 small { margin-top: .65em; font-size: .18em; }
  .hero__dev { margin-bottom: 1rem; font-size: .92rem; line-height: 1.5; }
  .hero__sub { margin-bottom: 1.45rem; font-size: .94rem; line-height: 1.62; }
  .hero__cta { gap: .75rem; }
  .hero__proof { grid-template-columns: 1fr 1fr; gap: .65rem .8rem; margin-top: 1.5rem; padding-top: 1.25rem; }
  .hero__proof li { font-size: .73rem; }
  .hero__proof li:last-child { grid-column: 1 / -1; }
  .product-window { border-width: 4px; border-radius: 14px; }
  .product-window__bar { height: 50px; padding-inline: .75rem; }
  .product-window__body { height: 310px; }
  .product-window__tools { top: 8px; left: 8px; }
  .product-window__tools span { width: 27px; height: 27px; }
  .tree-preview { inset: 56px 8px 66px; }
  .tree-row--two { margin-top: 56px; }
  .tree-row--three, .tree-line--child { display: none; }
  .tree-line--vertical { top: 68px; height: 54px; }
  .tree-line--branch { top: 121px; }
  .person { width: 90px; min-height: 66px; padding: .45rem .25rem; }
  .person strong { font-size: .57rem; }
  .person small { font-size: .45rem; }
  .product-window__caption { left: 8px; right: 8px; bottom: 8px; padding: .65rem .75rem; }
  .product-window__caption p { font-size: .66rem; line-height: 1.35; }
  .section { padding: 4.25rem 0; }
  .section h2 { font-size: clamp(2.65rem, 12vw, 3.4rem); }
  .section-head { margin-bottom: 2.2rem; }
  .section-head > p { font-size: .94rem; line-height: 1.62; }
  .principles__grid { grid-template-columns: 1fr; border-inline: 0; }
  .principles p { min-height: auto; padding: 1.25rem 0 !important; border-right: 0; border-bottom: 1px solid var(--line); }
  .principles p::before { display: inline-block; margin: 0 .75rem 0 0; }
  .bento { grid-template-columns: 1fr; grid-template-areas: "tree" "archive" "ritual" "elder"; }
  .bento-card { padding: 1.4rem; }
  .bento-card--tree { min-height: 470px; }
  .bento-card--elder { display: block; }
  .bento-card--elder > * { margin-bottom: 1rem; }
  .branch-demo { left: 1rem; right: 1rem; bottom: 1.2rem; height: 225px; }
  .branch-demo::before { top: 104px; }
  .branch-demo::after { top: 55px; height: 50px; }
  .branch-demo span { padding: .65rem .25rem; font-size: .78rem; }
  .steps li { gap: .35rem; padding-block: 1.65rem; }
  .steps h3 { font-size: 1.7rem; }
  .privacy__panel, .waitlist__panel { width: 100%; padding: 1.75rem 1.3rem; }
  .privacy__list li { gap: .75rem; padding: .9rem 0; }
  .faq__items summary { padding-block: 1.15rem; font-size: 1.18rem; }
  .waitlist__panel { box-shadow: 7px 7px 0 #173a31; }
  .waitlist__row { flex-direction: column; }
  .footer { padding-top: 3rem; }
  .footer__grid { grid-template-columns: 1fr; gap: 2rem; }
  .footer__grid > div { grid-column: auto; }
}