/* Tarkika shared styles: tokens, type, buttons, nav, menu, cursor, footer. Used by books. and blog. pages. */
:root{
  --paper:#F2ECDF;--paper-2:#E9E0CC;--sheet:#FBF8F1;
  --ink:#16182A;--ink-2:#4A4C60;--ink-3:#8A8B99;
  --rule:rgba(22,24,42,.13);--rule-2:rgba(22,24,42,.25);
  --ochre:#A3660E;--gold:#E2A93F;--cover:#151A26;--red:#B0413E;--green:#2E7568;--blue:#2C4C8C;
  --serif:"Newsreader","Iowan Old Style",Georgia,serif;
  --sans:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --gut:clamp(18px,4vw,64px);--sec:clamp(48px,5.5vw,80px);--sec-s:clamp(32px,4vw,56px);--ease:cubic-bezier(.16,1,.3,1);
  color-scheme:light;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body,*{scrollbar-width:none;-ms-overflow-style:none}
html::-webkit-scrollbar,body::-webkit-scrollbar,*::-webkit-scrollbar{display:none;width:0;height:0}
html{background:var(--paper);overflow-x:clip}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{background:var(--paper);color:var(--ink);font:400 17px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:inherit;text-decoration:none}
img,svg,canvas{display:block;max-width:100%}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--ochre);outline-offset:3px;border-radius:4px}
.gut{padding-inline:var(--gut)}
.max{max-width:1320px;margin-inline:auto}
.kick{font-size:14px;font-weight:600;color:var(--ochre);letter-spacing:.01em}
h1,h2,h3{font-family:var(--serif);font-weight:400;text-wrap:balance}
.h2{font-size:clamp(40px,5.4vw,88px);line-height:.96;letter-spacing:-.035em;font-variation-settings:"opsz" 72;font-weight:350}
.h2>div{padding-block:.1em .04em;margin-block:-.1em -.04em}
.lede{font-family:var(--serif);font-size:clamp(19px,1.6vw,24px);line-height:1.45;color:var(--ink-2);max-width:40ch}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:54px;padding:0 28px;border-radius:999px;background:var(--ink);color:var(--paper);font:600 15.5px/1 var(--sans);border:1px solid var(--ink);white-space:nowrap;cursor:pointer;transition:transform .5s var(--ease),background .3s,color .3s}
.btn:hover{transform:translateY(-2px)}
.btn.line{background:transparent;color:var(--ink);border-color:var(--rule-2)}
.btn.sm{height:42px;padding:0 20px;font-size:14.5px}
.tlink{font-weight:600;font-size:15px;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1.5px no-repeat;padding-bottom:3px;transition:background-size .6s var(--ease)}
.tlink:hover{background-size:0% 1.5px;background-position:100% 100%}
.grain{position:fixed;inset:0;pointer-events:none;z-index:90;opacity:.4;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .38 0 0 0 0 .25 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E")}

/* nav: one bar across tarkika.com, books. and blog., with the section named after the logo */
.nav{position:fixed;left:0;right:0;top:0;z-index:60;padding-top:env(safe-area-inset-top,0px);transition:background .5s,border-color .5s;border-bottom:1px solid transparent}
.nav.solid{background:rgba(242,236,223,.86);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-color:var(--rule)}
.nav .in{display:flex;align-items:center;gap:32px;height:68px}
.brand{display:flex;align-items:center;gap:12px}
.navlogo{display:block;height:30px;width:auto;overflow:visible}
.navlogo path{fill:none;stroke:var(--ink);stroke-width:20;stroke-linecap:round;stroke-linejoin:round}
.navlogo .dt{fill:var(--ochre)}.navlogo .tdot{fill:var(--ink)}
.sect{font:500 15px var(--sans);color:var(--ink-3);display:flex;gap:10px;align-items:center}
.sect::before{content:"/";color:var(--rule-2)}
.nav .links{display:flex;gap:28px;font-size:15px;color:var(--ink-2)}
.nav .links a:hover,.nav .links a[aria-current]{color:var(--ink)}
.nav .end{margin-left:auto;display:flex;gap:12px;align-items:center}
.menu{display:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--rule-2);background:transparent;align-items:center;justify-content:center;cursor:pointer}
.menu .x{display:none}.menu[aria-expanded="true"] .x{display:block}.menu[aria-expanded="true"] .o{display:none}
.sheet{position:fixed;inset:0;z-index:55;background:var(--paper);display:flex;flex-direction:column;padding:96px var(--gut) 40px;clip-path:inset(0 0 100% 0);visibility:hidden}
.sheet a.big{font-family:var(--serif);font-size:44px;line-height:1.1;letter-spacing:-.03em;padding:10px 0;border-bottom:1px solid var(--rule)}
.sheet a.big small{display:block;font:400 14px var(--sans);color:var(--ink-3);letter-spacing:0}
.sheet .btn{margin-top:auto}

/* cursor: a small ink dot that grows into a labelled circle over actions (mouse only) */
.cur{position:fixed;left:0;top:0;z-index:150;pointer-events:none;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:var(--ink);display:grid;place-items:center;transition:width .4s var(--ease),height .4s var(--ease),margin .4s var(--ease)}
.cur span{font:600 12px var(--sans);color:var(--paper);opacity:0;transition:opacity .2s;white-space:nowrap}
.cur.big{width:84px;height:84px;margin:-42px 0 0 -42px}.cur.big span{opacity:1}
@media (hover:none){.cur{display:none}}

/* footer */
footer{background:var(--paper-2);border-top:1px solid var(--rule);padding-block:80px 30px;overflow:hidden}
.fg{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:40px}
footer h5{font:600 14px var(--sans);margin-bottom:12px}
footer ul{list-style:none;display:grid;gap:8px;font-size:15px;color:var(--ink-2)}
footer ul a:hover{color:var(--ink)}
.giant{margin-top:70px;width:100%}
.giant .navlogo{height:auto;width:100%}
.colo{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:30px;font-size:13px;color:var(--ink-3)}

@media (max-width:980px){.nav .links,.nav .end .line{display:none}.menu{display:flex}}
@media (max-width:760px){
  .nav .in{height:60px;gap:12px}.navlogo{height:23px}.sect{font-size:14px}
  .fg{grid-template-columns:1fr 1fr}.fg>div:first-child{grid-column:1/-1}
}
/* newsletter sign-up, shared by every page */
.subf{display:flex;gap:8px;align-items:center;padding:6px 6px 6px 22px;border-radius:999px;border:1px solid var(--rule-2);background:var(--sheet);max-width:520px;transition:border-color .3s}
.subf:focus-within{border-color:var(--ink)}
.subf input{flex:1;min-width:0;border:0;background:transparent;font:16px var(--sans);color:var(--ink)}
.subf input:focus{outline:none}
.okmsg{font-size:14px;color:var(--green);margin-top:10px;min-height:20px}
.sr{position:absolute;left:-9999px}
.subf.busy{opacity:.6;pointer-events:none}.okmsg.bad{color:var(--red)}
/* phones: footer links get a finger-sized target */
@media(max-width:760px){footer ul{gap:2px}footer ul a{display:inline-block;padding-block:8px}}