/* ===========================================================
   PhiDo Labs: shared stylesheet
   Type:  Atkinson Hyperlegible (display + cards) / Literata (prose) / JetBrains Mono (utility)
   Color: ink + bone neutrals; --accent = indigo (links/structure);
          --warm = copper, --warm-soft = light copper (warm accents)
   =========================================================== */

:root{
  --ink:#1A1C22;
  --ink-soft:#2C2F39;
  --bone:#ECECEA;
  --bone-dim:#D6D7D4;
  --accent:#313E6E;
  --accent-bright:#4E61A6;
  --warm:#BC7142;
  --warm-soft:#CF8E63;

  --font-display:"Atkinson Hyperlegible",system-ui,sans-serif;
  --font-body:"Literata",Georgia,serif;
  --font-mono:"JetBrains Mono",ui-monospace,monospace;

  --measure:66ch;
  --pad:clamp(1.25rem,5vw,4rem);
  --maxw:1180px;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}*{animation:none!important;transition:none!important;}}

body{
  margin:0;
  background:var(--bone);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:1.0625rem;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4{font-family:var(--font-display);font-weight:700;line-height:1.1;margin:0;letter-spacing:-0.01em;}
p{margin:0 0 1rem;}
a{color:var(--accent);text-underline-offset:3px;text-decoration-thickness:1px;}
a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:1px;}
img,svg{max-width:100%;}

.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--bone);padding:.6rem 1rem;z-index:50;}
.skip:focus{left:.5rem;top:.5rem;}

.eyebrow{font-family:var(--font-mono);font-size:0.78rem;font-weight:500;letter-spacing:0.14em;text-transform:uppercase;}

.wrap{max-width:var(--maxw);margin-inline:auto;}

/* ---------- header / nav ---------- */
.site-head{
  display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;
  padding:1.15rem var(--pad);border-bottom:1px solid var(--bone-dim);
}
.brand{font-family:var(--font-display);font-weight:700;font-size:1.18rem;letter-spacing:-0.02em;color:var(--ink);text-decoration:none;}
.brand .labs{color:var(--accent);}
.site-nav{display:flex;gap:1.4rem;flex-wrap:wrap;font-family:var(--font-mono);font-size:0.82rem;letter-spacing:0.03em;}
.site-nav a{color:var(--ink-soft);text-decoration:none;padding-bottom:3px;border-bottom:1px solid transparent;}
.site-nav a:hover{color:var(--ink);border-bottom-color:var(--accent);}
.site-nav a[aria-current="page"]{color:var(--accent);border-bottom-color:var(--accent);}

/* ---------- generic section ---------- */
.section{padding:clamp(2.75rem,6vw,5rem) var(--pad);}
.section + .section{border-top:1px solid var(--bone-dim);}
.section-label{
  font-family:var(--font-mono);font-size:0.78rem;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--accent);margin-bottom:1.75rem;display:flex;align-items:center;gap:.75rem;max-width:var(--maxw);margin-inline:auto;
}
.section-label::after{content:"";flex:1;height:1px;background:var(--bone-dim);}

.prose{max-width:var(--measure);font-family:var(--font-body);}
.prose.lead{font-size:1.2rem;line-height:1.55;}
.prose h3{font-size:1.4rem;margin:2rem 0 .6rem;}
/* Prose and namebox inside a section center horizontally. This replaces the
   per-element inline margin styles so the CSP can drop 'unsafe-inline'. */
.section .prose,.section .namebox{margin-inline:auto;}

/* ---------- ink world ---------- */
.ink-world{background:var(--ink);color:var(--bone);}
.ink-world .eyebrow{color:var(--warm-soft);}
.ink-world a{color:var(--bone);}
.ink-world .section-label{color:var(--warm-soft);}
.ink-world .section-label::after{background:#4a463d;}

/* ---------- hero ---------- */
.hero{padding:clamp(3rem,8vw,6.5rem) var(--pad) clamp(2.5rem,6vw,4.5rem);}
.hero-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;max-width:var(--maxw);margin-inline:auto;}
.hero-claim{font-size:clamp(1.9rem,4.4vw,3.15rem);margin:1.25rem 0 1.5rem;max-width:18ch;}
.hero-claim em{font-style:normal;color:var(--warm-soft);}
.hero-sub{font-size:1.075rem;color:var(--bone-dim);max-width:46ch;margin:0;}
.hero-nav{margin-top:2rem;display:flex;gap:1.5rem;flex-wrap:wrap;font-family:var(--font-mono);font-size:0.85rem;}
.hero-nav a{color:var(--bone);text-decoration:none;border-bottom:1px solid var(--accent-bright);padding-bottom:2px;}
.hero-nav a:hover{color:var(--warm-soft);}

/* page masthead (lighter hero for inner pages) */
.masthead{padding:clamp(2.75rem,7vw,5rem) var(--pad) clamp(2rem,4vw,3rem);}
.masthead .eyebrow{color:var(--warm-soft);}
.masthead h1{font-size:clamp(2rem,5vw,3.2rem);max-width:20ch;margin:1rem 0 1.1rem;}
.masthead .standfirst{font-family:var(--font-body);font-size:1.15rem;color:var(--bone-dim);max-width:54ch;}

/* ---------- transmission circuit ---------- */
.circuit{width:100%;height:auto;}
.circuit text{font-family:var(--font-mono);fill:var(--bone);font-size:13px;letter-spacing:0.04em;}
.circuit .node{fill:none;stroke:var(--accent-bright);stroke-width:1.5;}
.circuit .arc{fill:none;stroke:var(--warm);stroke-width:1.8;stroke-linecap:round;}
.circuit .arc-head{fill:var(--warm);stroke:none;}
.circuit-cap{font-family:var(--font-mono);font-size:0.72rem;letter-spacing:0.1em;color:var(--bone-dim);text-align:center;margin-top:1rem;text-transform:uppercase;}

/* ---------- entry-point cards (home) ---------- */
.entries{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;max-width:var(--maxw);margin-inline:auto;}
.entry{display:block;text-decoration:none;color:var(--ink);border:1px solid var(--bone-dim);border-radius:3px;background:#fff;padding:1.5rem 1.4rem 1.65rem;transition:border-color .15s,transform .15s;}
.entry:hover{border-color:var(--accent);transform:translateY(-2px);}
.entry .n{font-family:var(--font-mono);font-size:0.78rem;color:var(--warm);font-weight:700;letter-spacing:0.08em;}
.entry h3{font-size:1.45rem;margin:.5rem 0 .55rem;}
.entry p{font-family:var(--font-display);font-size:0.97rem;color:var(--ink-soft);margin:0;line-height:1.5;}
.entry .go{font-family:var(--font-mono);font-size:0.8rem;color:var(--accent);margin-top:.9rem;display:inline-block;}

/* ---------- card system (research) ---------- */
.catalog{display:flex;flex-direction:column;gap:2rem;max-width:780px;margin-inline:auto;}
.card{border:1.5px solid var(--ink);border-radius:3px;background:#fff;box-shadow:6px 6px 0 var(--bone-dim);}
.card-head{padding:1.5rem clamp(1.25rem,3vw,2.25rem) 1.25rem;border-bottom:1.5px solid var(--ink);}
.card-kind{font-family:var(--font-mono);font-size:0.78rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;}
.card-kind.pattern{color:var(--warm);}
.card-kind.study{color:var(--accent);}
.card-kind.taxonomy{color:var(--accent);}
.card-name{font-size:clamp(1.45rem,3vw,1.95rem);margin:.4rem 0 .55rem;}
.card-meta{font-family:var(--font-mono);font-size:0.8rem;color:var(--accent);letter-spacing:0.02em;}
.card-body{padding:1.4rem clamp(1.25rem,3vw,2.25rem) 1.7rem;font-family:var(--font-display);}
.field{margin-bottom:1.1rem;}
.field:last-child{margin-bottom:0;}
.field .k{font-family:var(--font-mono);font-size:0.72rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:.3rem;}
.field .v{font-size:1.0rem;line-height:1.55;font-family:var(--font-display);}
.field .v em{font-style:italic;color:var(--ink);}

/* ---------- work / aszora ---------- */
.stage-row{display:flex;gap:1.5rem;flex-wrap:wrap;max-width:var(--maxw);margin:2rem auto 0;}
.stage{flex:1;min-width:180px;border-left:2px solid var(--accent);padding:.2rem 0 .2rem 1rem;}
.stage .k{font-family:var(--font-mono);font-size:0.72rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:.35rem;}
.stage .v{font-family:var(--font-display);font-size:1.02rem;}

/* project card (building) */
.project{border:1.5px solid var(--ink);border-radius:3px;background:#fff;box-shadow:6px 6px 0 var(--bone-dim);padding:1.6rem clamp(1.25rem,3vw,2.25rem) 1.8rem;max-width:780px;margin:2.25rem auto 0;}
.project .eyebrow{color:var(--warm);display:block;margin-bottom:.55rem;}
.project h3{font-size:1.65rem;margin:0 0 .3rem;}
.project .tagline{font-family:var(--font-mono);font-size:0.82rem;color:var(--accent);letter-spacing:0.02em;margin:0 0 1.1rem;}
.project p{font-family:var(--font-display);font-size:1.0rem;color:var(--ink-soft);line-height:1.55;margin:0 0 .9rem;}
.project p:last-child{margin-bottom:0;}
.project a{color:var(--accent);}

/* ---------- about / theo ---------- */
.about-grid{display:grid;grid-template-columns:1fr;gap:2.5rem;max-width:var(--maxw);margin-inline:auto;}
.theo-figure{margin:0;text-align:center;}
.theo-figure svg{width:min(300px,70vw);height:auto;}
.theo-figure figcaption{font-family:var(--font-mono);font-size:0.8rem;color:var(--ink-soft);margin-top:1rem;letter-spacing:0.03em;}
.namebox{border:1.5px solid var(--ink);border-radius:3px;background:#fff;box-shadow:6px 6px 0 var(--bone-dim);padding:1.5rem 1.6rem;max-width:var(--measure);}
.namebox .eyebrow{color:var(--warm);}
.namebox p{font-family:var(--font-display);margin:.8rem 0 0;}
.namebox .name{font-size:1.25rem;font-weight:700;}
.namebox .diss-line{font-family:var(--font-mono);font-size:0.85rem;color:var(--ink-soft);}

/* ---------- contact ---------- */
.contact-card{max-width:640px;margin-inline:auto;}
.contact-lines{display:flex;flex-direction:column;gap:1.25rem;margin-top:1.75rem;}
.contact-line{border-top:1px solid var(--bone-dim);padding-top:1.1rem;}
.contact-line .k{font-family:var(--font-mono);font-size:0.74rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:.35rem;}
.contact-line .v{font-family:var(--font-display);font-size:1.05rem;}
.maillink{font-family:var(--font-mono);font-size:1.05rem;}

.note{font-family:var(--font-mono);font-size:0.8rem;color:var(--ink-soft);max-width:64ch;line-height:1.65;margin-inline:auto;}
.note strong{color:var(--ink);}

/* ---------- footer ---------- */
.site-foot{background:var(--ink);color:var(--bone-dim);padding:clamp(2.25rem,5vw,3.5rem) var(--pad);}
.foot-grid{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap;max-width:var(--maxw);margin-inline:auto;align-items:flex-start;}
.foot-brand{font-family:var(--font-display);font-weight:700;color:var(--bone);font-size:1.1rem;}
.foot-tag{font-family:var(--font-mono);font-size:0.78rem;margin-top:.5rem;letter-spacing:0.04em;color:#8d887d;}
.foot-nav{display:flex;flex-direction:column;gap:.5rem;font-family:var(--font-mono);font-size:0.82rem;}
.foot-nav a{color:var(--bone-dim);text-decoration:none;}
.foot-nav a:hover{color:var(--warm-soft);}

/* ---------- responsive ---------- */
@media (max-width:820px){
  .hero-grid{grid-template-columns:1fr;}
  .entries{grid-template-columns:1fr;}
}

/* ---------- research threads ---------- */
.threads{display:flex;flex-direction:column;gap:1.5rem;max-width:var(--maxw);margin-inline:auto;}
.thread{border:1px solid var(--bone-dim);border-radius:3px;background:#fff;padding:1.4rem 1.5rem 1.5rem;display:grid;grid-template-columns:auto 1fr;gap:1.25rem;}
.thread .tnum{font-family:var(--font-mono);font-size:0.8rem;font-weight:700;color:var(--warm);letter-spacing:0.08em;}
.thread h3{font-size:1.3rem;margin:0 0 .15rem;}
.thread .tstate{font-family:var(--font-mono);font-size:0.72rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--accent);}
.thread p{font-family:var(--font-display);font-size:0.98rem;color:var(--ink-soft);margin:.6rem 0 0;line-height:1.5;}

/* ---------- research: lifecycle lines ---------- */
.section-label.stage{color:var(--warm);}
.line-intro{max-width:var(--measure);margin-inline:auto;margin-bottom:2rem;}
.line-intro h3{font-size:clamp(1.4rem,3vw,1.9rem);margin:0 0 .6rem;}
.line-lede{font-family:var(--font-body);font-size:1.08rem;color:var(--ink-soft);margin:0;line-height:1.55;}

/* pattern card extras */
.field .v ul{margin:.35rem 0 0;padding-left:1.1rem;}
.field .v li{margin-bottom:.2rem;}
.knownuses{font-family:var(--font-mono);font-size:0.85rem;color:var(--accent);}

/* ---------- publications ---------- */
.pubs{max-width:820px;margin-inline:auto;}
.pub-group{margin-bottom:2rem;}
.pub-group:last-child{margin-bottom:0;}
.pub-grouphead{font-family:var(--font-mono);font-size:0.76rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--warm);margin-bottom:1rem;border-bottom:1px solid var(--bone-dim);padding-bottom:.5rem;}
.pub{display:grid;grid-template-columns:1fr auto;gap:1rem 1.5rem;padding:1rem 0;border-bottom:1px solid var(--bone-dim);align-items:start;}
.pub:last-child{border-bottom:0;}
.pub-cite{font-family:var(--font-display);font-size:1.0rem;line-height:1.5;}
.pub-cite .title{font-weight:700;}
.pub-venue{font-family:var(--font-mono);font-size:0.8rem;color:var(--accent);margin-top:.35rem;display:block;letter-spacing:0.01em;}
.pub-venue a{color:var(--accent);}
.pub-status{font-family:var(--font-mono);font-size:0.72rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--ink-soft);white-space:nowrap;padding-top:.15rem;}
.diss{border:1.5px solid var(--ink);border-radius:3px;background:#fff;box-shadow:6px 6px 0 var(--bone-dim);padding:1.3rem 1.5rem;max-width:820px;margin:1.5rem auto 0;}
.diss .k{font-family:var(--font-mono);font-size:0.72rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:.4rem;}
.diss .title{font-family:var(--font-display);font-weight:700;font-size:1.1rem;line-height:1.35;}
.diss .sub{font-family:var(--font-mono);font-size:0.8rem;color:var(--ink-soft);margin-top:.5rem;}

@media (max-width:680px){
  .thread{grid-template-columns:1fr;gap:.5rem;}
  .pub{grid-template-columns:1fr;gap:.5rem;}
  .pub-status{padding-top:0;}
}