/* kristjankann.com — built on AllGaia CVI tokens (cvi-tokens.css, 2026-08-07) */
@font-face{ font-family:"Open Sauce One"; font-weight:700; font-display:swap; src:url("/fonts/OpenSauceOne-Bold.ttf") format("truetype"); }
@font-face{ font-family:"Aileron"; font-weight:300; font-display:swap; src:url("/fonts/Aileron-Light.otf") format("opentype"); }
@font-face{ font-family:"Aileron"; font-weight:700; font-display:swap; src:url("/fonts/Aileron-Bold.otf") format("opentype"); }

:root{
  --gaia-teal:#2AA8A8;
  --deep-tide:#357575;
  --charcoal:#2B3333;
  --linen:#ddd9ce;
  --sage:#A9B49E;
  --gaia-sun:#E47839;
  --terracotta:#B86440;
  --espresso:#3c2415;
  --white:#ffffff;
  --cream:#F6F3EC;
  --paper:#FBFAF6;
  --ink:#2B3333;
  --muted:#5B6463;
  --title:"Open Sauce One", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --body:"Aileron", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--body); font-weight:300; color:var(--ink);
  background:var(--white); font-size:18px; line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
.wrap{ max-width:1080px; margin:0 auto; padding:0 24px; }
.narrow{ max-width:720px; }

h1,h2,h3{ font-family:var(--title); font-weight:700; color:var(--charcoal); line-height:1.15; }
h1{ font-size:clamp(2.1rem,5vw,3.4rem); letter-spacing:-0.02em; }
h2{ font-size:clamp(1.5rem,3.4vw,2.1rem); letter-spacing:-0.01em; }
h3{ font-size:1.15rem; }
p{ margin:0 0 1.2em; }
a{ color:var(--deep-tide); text-decoration:none; }
a:hover{ text-decoration:underline; }
strong,b{ font-weight:700; }

/* header */
header{
  position:sticky; top:0; z-index:20; background:rgba(255,255,255,.92);
  backdrop-filter:blur(8px); border-bottom:1px solid var(--linen);
}
.nav{ display:flex; align-items:center; justify-content:space-between; height:64px; }
.nav .name{ font-family:var(--title); font-weight:700; color:var(--charcoal); font-size:1rem; letter-spacing:.01em; }
.nav ul{ display:flex; gap:26px; list-style:none; }
.nav ul a{ color:var(--charcoal); font-size:.95rem; }
.nav ul a:hover{ color:var(--deep-tide); text-decoration:none; }
@media (max-width:640px){ .nav ul{ gap:16px; } .nav ul li.hide-m{ display:none; } }

/* hero */
.hero{ position:relative; overflow:hidden; background:var(--paper); border-bottom:1px solid var(--linen); }
.hero .inner{ position:relative; padding:110px 0 90px; }
.kicker{
  font-family:var(--title); font-weight:700; font-size:.85rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--deep-tide); margin-bottom:18px;
}
.hero p.lead{ max-width:640px; font-size:1.15rem; color:var(--muted); margin-top:22px; }
.cta-row{ display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; }
.btn{
  display:inline-block; font-family:var(--title); font-weight:700; font-size:.95rem;
  padding:13px 26px; border-radius:4px; border:1px solid var(--deep-tide);
  color:var(--deep-tide); background:transparent; transition:all .2s ease; cursor:pointer;
}
.btn:hover{ background:var(--deep-tide); color:#fff; text-decoration:none; }
.btn.solid{ background:var(--deep-tide); color:#fff; }
.btn.solid:hover{ background:var(--charcoal); border-color:var(--charcoal); }

/* flower-of-life watermark */
.fol{ position:absolute; right:-140px; top:-140px; width:560px; height:560px; opacity:.5; pointer-events:none; }
@media (max-width:800px){ .fol{ width:380px; height:380px; right:-120px; top:-120px; } }

/* sections */
section{ padding:88px 0; }
section.band{ background:var(--cream); border-top:1px solid var(--linen); border-bottom:1px solid var(--linen); }
.thesis{ text-align:center; padding:72px 0; }
.thesis p{
  font-family:var(--title); font-weight:700; color:var(--charcoal);
  font-size:clamp(1.4rem,3vw,2rem); max-width:760px; margin:0 auto;
}
.sub{ color:var(--muted); max-width:640px; }

/* cards */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:44px; }
@media (max-width:800px){ .cards{ grid-template-columns:1fr; } }
.card{
  background:var(--paper); border:1px solid var(--linen); border-radius:6px;
  padding:30px 26px; display:flex; flex-direction:column;
}
.card .num{ font-family:var(--title); font-weight:700; color:var(--sage); font-size:.85rem; letter-spacing:.12em; margin-bottom:12px; }
.card h3{ margin-bottom:10px; }
.card p{ color:var(--muted); font-size:.98rem; flex:1; }
.card a.more{ font-family:var(--title); font-weight:700; font-size:.92rem; }

/* book strip */
.bookstrip{ background:var(--charcoal); color:#fff; padding:72px 0; }
.bookstrip h2{ color:#fff; }
.bookstrip p{ color:#c9cfce; max-width:640px; }
.bookstrip .form-row{ margin-top:26px; }

/* forms */
.form-row{ display:flex; gap:12px; flex-wrap:wrap; max-width:520px; }
input[type=email]{
  flex:1; min-width:220px; font-family:var(--body); font-size:1rem; font-weight:300;
  padding:13px 16px; border:1px solid var(--linen); border-radius:4px; background:#fff; color:var(--ink);
}
input[type=email]:focus{ outline:2px solid var(--deep-tide); border-color:var(--deep-tide); }
.formnote{ font-size:.85rem; color:var(--muted); margin-top:10px; }
.bookstrip .formnote{ color:#9aa4a2; }

/* story preview + prose */
.prose p{ margin-bottom:1.4em; }
.prose h2{ margin:2.2em 0 .7em; }
.prose .opening{ font-size:1.25rem; color:var(--charcoal); }

/* connect */
.connect .links{ display:flex; flex-wrap:wrap; gap:20px; margin-top:22px; }
.connect .links a{ font-family:var(--title); font-weight:700; font-size:.95rem; }

/* footer */
footer{ border-top:1px solid var(--linen); background:var(--paper); padding:56px 0 40px; }
footer .foot-grid{ display:flex; justify-content:space-between; gap:32px; flex-wrap:wrap; align-items:flex-start; }
footer .quiet{ font-size:.9rem; color:var(--muted); margin-top:26px; }
footer h3{ font-size:1rem; margin-bottom:12px; }

/* page hero (subpages) */
.pagehero{ background:var(--paper); border-bottom:1px solid var(--linen); padding:88px 0 64px; }
.pagehero p.lead{ color:var(--muted); max-width:640px; margin-top:18px; font-size:1.1rem; }