:root{
  --ink:#241B12; --ink-2:#3A2E22;
  --cream:#F4ECD9; --cream-2:#EBE1C9; --paper:#FBF6EA;
  --forest:#2E6B41; --forest-deep:#1F4D2E;
  --ember:#E08838; --coral:#E8675A; --sky:#8FA3CA;
  --hair:rgba(36,27,18,.16); --hair-soft:rgba(36,27,18,.09);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--cream);color:var(--ink);font-family:"Hanken Grotesk",system-ui,sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased;}
h1,h2,h3{font-family:"Fraunces",Georgia,serif;font-weight:600;line-height:1.04;letter-spacing:-.01em;margin:0;}
.eyebrow{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--forest);margin:0;}
a{color:inherit;}
.wrap{max-width:1080px;margin:0 auto;padding:0 28px;}
.stroke{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;}
.fill{fill:currentColor;}
nav{position:sticky;top:0;z-index:20;background:rgba(244,236,217,.88);backdrop-filter:blur(8px);border-bottom:1px solid var(--hair-soft);}
.navin{display:flex;align-items:center;justify-content:space-between;height:62px;}
.brand{display:flex;align-items:center;gap:11px;font-family:"Fraunces",serif;font-weight:600;font-size:19px;letter-spacing:-.01em;text-decoration:none;color:inherit;}
.brand svg{width:26px;height:30px;color:var(--ink);}
.navlinks{display:flex;gap:26px;align-items:center;font-size:14px;}
.navlinks a{text-decoration:none;color:var(--ink-2);transition:color .2s;}
.navlinks a:hover{color:var(--forest);}
.btn{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;border:1.5px solid var(--ink);background:transparent;color:var(--ink);padding:9px 15px;border-radius:2px;cursor:pointer;transition:all .2s;text-decoration:none;display:inline-block;}
.btn:hover{background:var(--ink);color:var(--cream);}
.btn-key::before{content:"";display:inline-block;width:9px;height:9px;border:1.5px solid currentColor;border-radius:50%;margin-right:7px;vertical-align:middle;position:relative;top:-1px;}
.hero{padding:54px 0 30px;text-align:center;}
.crest{width:200px;height:236px;color:var(--ink);margin:0 auto 22px;display:block;}
.hero h1{font-size:clamp(46px,9vw,86px);font-weight:600;}
.hero .loc{margin:16px 0 0;}
.hero .lede{max-width:540px;margin:18px auto 0;font-size:17px;color:var(--ink-2);}
.rule{width:54px;height:2px;background:var(--ink);margin:30px auto;opacity:.5;}
.nature{background:var(--forest);color:var(--cream);padding:62px 0;}
.nature .is-line{font-family:"Fraunces",serif;font-style:italic;font-size:clamp(20px,3.4vw,30px);font-weight:400;max-width:760px;margin:0 auto;text-align:center;line-height:1.3;}
.nature .en-line{text-align:center;color:rgba(244,236,217,.78);max-width:560px;margin:18px auto 0;font-size:15px;}
.icons{display:flex;flex-wrap:wrap;justify-content:center;gap:40px;margin-top:44px;}
.ico{text-align:center;width:104px;}
.ico svg{width:52px;height:52px;color:var(--cream);}
.ico div{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;margin-top:10px;color:rgba(244,236,217,.85);}
.skog{padding:78px 0;}
.skog .grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;}
.skog h2{font-size:clamp(30px,4.6vw,46px);margin-bottom:22px;}
.skog p{font-size:16.5px;color:var(--ink-2);margin:0 0 16px;max-width:46ch;}
.counter{background:var(--paper);border:1px solid var(--hair);border-radius:4px;padding:28px 30px;}
.counter .big{font-family:"Fraunces",serif;font-size:60px;font-weight:600;color:var(--forest);line-height:1;}
.counter .big small{font-size:20px;color:var(--ink-2);font-weight:500;}
.counter .lbl{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);margin-top:8px;}
.counter .sub{font-size:13.5px;color:var(--ink-2);margin-top:10px;font-style:italic;}
.seasons{display:flex;gap:22px;margin-top:18px;border-top:1px solid var(--hair-soft);padding-top:18px;}
.seasons .n{font-family:"Fraunces",serif;font-size:26px;font-weight:600;display:block;}
.seasons .t{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);margin-top:2px;display:block;}
.meaning{background:var(--cream-2);padding:78px 0;}
.meaning .head{text-align:center;max-width:640px;margin:0 auto 50px;}
.meaning h2{font-size:clamp(28px,4.4vw,42px);}
.meaning .theme{margin-top:18px;font-size:16px;color:var(--ink-2);}
.meaning .theme b{color:var(--forest);font-weight:600;}
.syms{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;}
.sym{background:var(--paper);border:1px solid var(--hair-soft);border-radius:4px;padding:24px 20px;text-align:center;}
.sym svg{width:58px;height:58px;color:var(--ink);}
.sym h3{font-size:21px;margin:14px 0 4px;}
.sym .sub{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--forest);}
.sym p{font-size:13.5px;color:var(--ink-2);margin:11px 0 0;line-height:1.5;}
footer{background:var(--ink);color:var(--cream);padding:44px 0;}
.ftin{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;}
.ftin .brand,.ftin .brand svg{color:var(--cream);}
.ftnote{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.06em;color:rgba(244,236,217,.6);}
input,textarea{font-family:"Hanken Grotesk",sans-serif;font-size:15px;color:var(--ink);background:var(--paper);border:1.5px solid var(--hair);border-radius:3px;padding:12px 14px;width:100%;resize:vertical;}
input:focus,textarea:focus{outline:none;border-color:var(--forest);}
/* family */
#family-view{display:none;background:var(--ink);color:var(--cream);min-height:100vh;}
#family-view.show{display:block;}
#family-view nav{background:rgba(36,27,18,.9);border-bottom:1px solid rgba(244,236,217,.12);}
#family-view .brand,#family-view .brand svg{color:var(--cream);}
.fam-hero{padding:50px 0 6px;}
.fam-hero .eyebrow{color:var(--ember);}
.fam-hero h1{font-size:clamp(32px,5.5vw,54px);color:var(--cream);margin-top:10px;}
.vision-lead{color:rgba(244,236,217,.82);max-width:64ch;margin-top:16px;font-size:16px;}
.fam-sec{padding:40px 0;border-top:1px solid rgba(244,236,217,.12);}
.fam-sec h2{font-family:"Fraunces",serif;font-size:30px;color:var(--cream);margin-bottom:6px;}
.fam-sec .sec-eye{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ember);}
.fam-sec .lead{color:rgba(244,236,217,.75);max-width:64ch;margin-top:10px;font-size:15px;}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:26px;}
.pillar{background:var(--ink-2);border:1px solid rgba(244,236,217,.12);border-radius:4px;padding:22px;}
.pillar svg{width:34px;height:34px;color:var(--ember);}
.pillar h3{font-family:"Fraunces",serif;font-size:21px;color:var(--cream);margin:12px 0 8px;}
.pillar p{font-size:13.5px;color:rgba(244,236,217,.72);margin:0;line-height:1.55;}
.cycle{background:var(--ink-2);border:1px solid rgba(244,236,217,.12);border-radius:6px;padding:22px;margin-top:24px;}
.cycle svg{width:100%;height:auto;display:block;}
.cycle .cap{font-size:13.5px;color:rgba(244,236,217,.74);margin:16px 4px 0;line-height:1.6;}
.phases{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:24px;}
.phase{background:var(--ink-2);border:1px solid rgba(244,236,217,.12);border-radius:4px;padding:18px;}
.phase .ph{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--sky);}
.phase h3{font-family:"Fraunces",serif;font-size:21px;color:var(--cream);margin:6px 0 8px;}
.phase p{font-size:13px;color:rgba(244,236,217,.72);margin:0;line-height:1.5;}
.phase.cond{border-style:dashed;border-color:var(--sky);}
.phase .cond-tag{display:inline-block;font-family:"IBM Plex Mono",monospace;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--sky);border:1px solid var(--sky);border-radius:2px;padding:2px 6px;margin-top:10px;}
.gate-note{font-size:13px;color:rgba(244,236,217,.7);margin-top:20px;font-style:italic;}
table.fin{width:100%;border-collapse:collapse;margin-top:22px;font-size:14px;}
table.fin th,table.fin td{text-align:left;padding:13px 14px;border-bottom:1px solid rgba(244,236,217,.12);vertical-align:top;}
table.fin th{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--sky);font-weight:500;}
table.fin td.ph{font-family:"Fraunces",serif;font-size:16px;color:var(--cream);white-space:nowrap;}
table.fin .num{font-family:"IBM Plex Mono",monospace;color:var(--cream);}
table.fin .ret{color:#9FD3AE;}
table.fin .hot{color:var(--ember);font-family:"IBM Plex Mono",monospace;}
.fin-note{font-size:12px;color:rgba(244,236,217,.55);margin-top:14px;font-family:"IBM Plex Mono",monospace;line-height:1.6;}
.geo-next{margin-top:18px;padding-left:18px;color:rgba(244,236,217,.78);font-size:13.5px;line-height:1.65;}
.geo-next li{margin-bottom:6px;}
.todo-add{display:flex;gap:10px;margin-top:20px;}
.todo-add input{background:var(--ink-2);border-color:rgba(244,236,217,.18);color:var(--cream);}
.todo-add input::placeholder{color:rgba(244,236,217,.4);}
.todo-list{margin-top:18px;display:flex;flex-direction:column;gap:8px;}
.todo{display:flex;align-items:center;gap:13px;background:var(--ink-2);border:1px solid rgba(244,236,217,.1);border-radius:3px;padding:12px 14px;}
.todo .chk{width:20px;height:20px;border:1.5px solid var(--sky);border-radius:50%;cursor:pointer;flex:0 0 auto;display:flex;align-items:center;justify-content:center;transition:all .2s;}
.todo .chk.on{background:var(--forest);border-color:var(--forest);}
.todo .chk.on::after{content:"\2713";color:var(--cream);font-size:12px;}
.todo .txt{flex:1;font-size:15px;color:var(--cream);}
.todo.done .txt{text-decoration:line-through;color:rgba(244,236,217,.45);}
.todo .del{background:none;border:none;color:rgba(244,236,217,.4);cursor:pointer;font-size:18px;line-height:1;padding:2px 6px;}
.todo .del:hover{color:var(--coral);}
.sg-form{display:flex;flex-direction:column;gap:12px;margin-top:20px;max-width:640px;}
.sg-form input,.sg-form textarea{background:var(--ink-2);border-color:rgba(244,236,217,.18);color:var(--cream);}
.sg-form input::placeholder,.sg-form textarea::placeholder{color:rgba(244,236,217,.4);}
.sg-list{margin-top:26px;display:flex;flex-direction:column;gap:12px;max-width:640px;}
.sg-item{background:var(--ink-2);border:1px solid rgba(244,236,217,.1);border-left:3px solid var(--ember);border-radius:3px;padding:13px 16px;}
.sg-item .meta{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.06em;color:rgba(244,236,217,.5);margin-top:6px;}
.empty{color:rgba(244,236,217,.5);font-size:14px;font-style:italic;padding:6px 0;}
#family-view .btn{border-color:var(--cream);color:var(--cream);}
#family-view .btn:hover{background:var(--cream);color:var(--ink);}
.submit{align-self:flex-start;}
.btn-solid{background:var(--ink);color:var(--cream);}
.fam-status{font-family:"IBM Plex Mono",monospace;font-size:11px;color:rgba(244,236,217,.45);margin-top:8px;min-height:14px;}
@media (max-width:860px){
  .skog .grid{grid-template-columns:1fr;gap:34px;}
  .syms{grid-template-columns:repeat(2,1fr);}
  .phases{grid-template-columns:repeat(2,1fr);}
  .pillars{grid-template-columns:1fr;}
  .navlinks a:not(.btn){display:none;}
}
@media (max-width:560px){
  .syms{grid-template-columns:1fr;}
  .phases{grid-template-columns:1fr;}
  .icons{gap:26px;}
}
@media (prefers-reduced-motion:no-preference){
  .reveal{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s ease;}
  .reveal.in{opacity:1;transform:none;}
}
