/* ═══════════════════════════════════════════════════════════════════════
   bijan-fallah.com — one stylesheet, every page. Rebuilt 2026-10-08.

   One ivory ground, one serif, one mono for small labels. A single centred
   column, generous air, hairline borders, rounded cards. Mobile-first: the
   phone layout is the base and wider screens add room, never the reverse.

   Constraints this file holds:
     · zero JavaScript — every page is complete with scripting off.
     · zero third-party requests — fonts are self-hosted (assets/fonts).
       The Datenschutzerklärung (section 3) states this as fact.
     · body text ≥ 7:1 contrast, secondary ≥ 4.5:1 (ratios noted inline).
   ═══════════════════════════════════════════════════════════════════════ */

:root{
  --bg:#F5F3EC;
  --surface:#FBFAF6;
  --ink:#1C1A17;          /* 15.6:1 on bg */
  --ink-2:#5E5A52;        /*  6.3:1 on bg */
  --line:#E4E0D5;
  --line-strong:#C9C3B4;
  --accent:#C8613D;       /*  4.6:1 on bg — links, pills, marks */
  --accent-ink:#9E4526;   /*  7.1:1 on bg — link text */
  --accent-soft:#F3DED3;

  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  --measure:40rem;          /* reading line, ~66ch at this size */
  --wide:72rem;             /* grids, masthead, footer */
  --gutter:clamp(1rem,4vw,2.5rem);
  --section:clamp(3.5rem,8vw,6.5rem);
  --radius:14px;
  color-scheme:light;
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body,h1,h2,h3,h4,p,ul,ol,li,figure,figcaption,dl,dd,blockquote{margin:0;padding:0;}
ul,ol{list-style:none;}
img{max-width:100%;height:auto;display:block;}

body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--serif);
  font-size:clamp(1.0625rem,1rem + .3vw,1.1875rem);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  min-height:100vh;
  display:flex;flex-direction:column;
}
main{flex:1;}

::selection{background:var(--accent-soft);}

/* ── links ──────────────────────────────────────────────────────────── */
a{
  color:var(--accent-ink);
  text-decoration-line:underline;
  text-decoration-thickness:1px;
  text-underline-offset:.18em;
  text-decoration-color:rgba(158,69,38,.35);
  transition:color .15s ease,text-decoration-color .15s ease;
}
a:hover{color:var(--ink);text-decoration-color:var(--ink);}
a:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px;}
.ext{font-family:var(--mono);font-size:.72em;padding-inline-start:.15em;}

.skip{position:absolute;left:-9999px;top:0;font-family:var(--mono);font-size:.8rem;}
.skip:focus{
  left:1rem;top:1rem;z-index:9;position:fixed;
  background:var(--ink);color:var(--bg);padding:.6rem .95rem;
  text-decoration:none;border-radius:8px;outline:2px solid var(--accent);
}

/* ── type ───────────────────────────────────────────────────────────── */
h1,h2,h3{font-weight:400;letter-spacing:-.012em;}
h1{font-size:clamp(2.4rem,5vw,4rem);line-height:1.05;text-wrap:balance;}
h2{font-size:clamp(1.75rem,3.2vw,2.5rem);line-height:1.12;text-wrap:balance;}
h3{font-size:clamp(1.25rem,1.6vw,1.5rem);line-height:1.25;}
.eyebrow{
  font-family:var(--mono);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-2);
}
.meta{font-family:var(--mono);font-size:.8rem;color:var(--ink-2);letter-spacing:.01em;}
.lede{font-size:clamp(1.15rem,1.05rem + .5vw,1.4rem);line-height:1.5;color:var(--ink);max-width:var(--measure);}
.muted{color:var(--ink-2);}
.pill{
  display:inline-block;font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;
  padding:.2rem .6rem;border:1px solid var(--line-strong);border-radius:999px;color:var(--ink-2);
  background:var(--surface);
}
.pill.oa{border-color:var(--accent);color:var(--accent-ink);}

/* ── page grid ──────────────────────────────────────────────────────── */
.wrap{max-width:var(--wide);margin-inline:auto;padding-inline:var(--gutter);}
.measure{max-width:var(--measure);}
.sect{padding-block:var(--section) 0;}
.sect:last-child{padding-bottom:var(--section);}
.sect-head{display:flex;flex-direction:column;gap:.75rem;margin-bottom:2rem;}
.sect-head .lede{font-size:clamp(1.05rem,1rem + .25vw,1.2rem);color:var(--ink-2);}

/* ── masthead ───────────────────────────────────────────────────────── */
.masthead{border-bottom:1px solid var(--line);background:var(--bg);}
.bar{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:.5rem 1.25rem;padding-block:1rem;
}
/* Phones: wordmark and language switch share the first row, the four anchor
   links take the second — three rows of chrome would eat the first screen. */
@media (max-width:40rem){
  .bar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.6rem 1rem;}
  .masthead .bar .right{display:contents;}
  .masthead .bar .langs{grid-column:2;grid-row:1;justify-self:end;}
  .masthead .bar nav:not(.langs){grid-column:1 / -1;grid-row:2;}
}
.stamp{font-family:var(--serif);font-size:1.1rem;letter-spacing:-.01em;}
.stamp a{color:var(--ink);text-decoration:none;}
.stamp a:hover{color:var(--accent-ink);}
.bar nav{display:flex;flex-wrap:wrap;gap:.25rem 1.1rem;align-items:center;}
.bar nav a{
  color:var(--ink);text-decoration:none;font-size:1rem;padding:.2rem 0;
  border-bottom:1px solid transparent;
}
.bar nav a:hover,.bar nav a[aria-current="page"]{border-bottom-color:var(--ink);}
.bar .right{display:flex;flex-wrap:wrap;gap:.25rem 1.5rem;align-items:center;}
.langs{font-family:var(--mono);font-size:.78rem;}
.langs a,.langs span[aria-current]{color:var(--ink-2);text-decoration:none;}
.langs span[aria-current]{color:var(--ink);}
.langs .sep{padding-inline:.35rem;color:var(--line-strong);}

/* ── hero ───────────────────────────────────────────────────────────── */
.hero{
  display:grid;grid-template-columns:1fr;gap:2rem;align-items:end;
  padding-block:clamp(2.5rem,6vw,5rem) 0;
}
.hero .text{display:flex;flex-direction:column;gap:1.25rem;max-width:46rem;}
.hero h1{margin-top:.25rem;}
.hero .cta{display:flex;flex-wrap:wrap;gap:.75rem 1rem;align-items:center;margin-top:.5rem;}
.btn{
  display:inline-block;background:var(--ink);color:var(--bg);text-decoration:none;
  padding:.7rem 1.15rem;border-radius:999px;font-size:1rem;line-height:1;
  border:1px solid var(--ink);transition:background .15s ease,color .15s ease;
}
.btn:hover{background:var(--accent);border-color:var(--accent);color:#fff;}
.portrait{width:7rem;aspect-ratio:4/5;overflow:hidden;border-radius:var(--radius);border:1px solid var(--line);}
.portrait img{width:100%;height:100%;object-fit:cover;}
@media (min-width:48rem){
  .hero{grid-template-columns:minmax(0,1fr) auto;}
  .portrait{width:11rem;}
}

/* ── cards & grids ──────────────────────────────────────────────────── */
.grid{display:grid;grid-template-columns:1fr;gap:1rem;}
@media (min-width:40rem){.grid.two{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:60rem){.grid.three{grid-template-columns:repeat(3,minmax(0,1fr));}}
.card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.35rem 1.4rem;display:flex;flex-direction:column;gap:.6rem;
  transition:border-color .15s ease;min-width:0;
}
.card:hover{border-color:var(--line-strong);}
.card h3 a{color:var(--ink);text-decoration:none;}
.card h3 a:hover{color:var(--accent-ink);}
.card p{color:var(--ink-2);font-size:1rem;line-height:1.55;}
.card .meta{margin-top:auto;padding-top:.4rem;}
.more{margin-top:1.5rem;}

/* ── atlas ──────────────────────────────────────────────────────────── */
.atlas-grid{display:grid;grid-template-columns:1fr;gap:1.25rem;}
@media (min-width:52rem){.atlas-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
.map{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;
}
.map .frame{aspect-ratio:1/1.08;background:var(--bg);}
.map .frame img{width:100%;height:100%;object-fit:contain;}
.map figcaption{padding:1.1rem 1.3rem 1.3rem;display:flex;flex-direction:column;gap:.45rem;}
.map figcaption h3{font-size:1.25rem;}
.map figcaption .sub{font-family:var(--mono);font-size:.78rem;color:var(--ink-2);}
.map figcaption p{font-size:.95rem;line-height:1.5;color:var(--ink-2);}
.fine{font-size:.9rem;line-height:1.5;color:var(--ink-2);margin-top:1.25rem;max-width:var(--measure);}
.fine + .fine{margin-top:.75rem;}

/* ── publications ───────────────────────────────────────────────────── */
.pubs{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--line);margin-top:.5rem;}
.pub-year{
  display:grid;grid-template-columns:1fr;gap:.25rem 2rem;padding-block:1.5rem;
  border-bottom:1px solid var(--line);
}
.pub-year > .year{font-family:var(--mono);font-size:.85rem;color:var(--ink-2);padding-top:.35rem;}
.pub-year ol{display:flex;flex-direction:column;gap:1.1rem;}
.pub{display:flex;flex-direction:column;gap:.2rem;min-width:0;}
.pub .t a{color:var(--ink);text-decoration:none;}
.pub .t a:hover{color:var(--accent-ink);text-decoration:underline;}
.pub .a{color:var(--ink-2);font-size:.98rem;line-height:1.5;}
.pub .v{display:flex;flex-wrap:wrap;gap:.35rem .75rem;align-items:center;}
.pub .v .meta{overflow-wrap:anywhere;}
@media (min-width:48rem){.pub-year{grid-template-columns:5rem minmax(0,1fr);}}

/* ── book ───────────────────────────────────────────────────────────── */
.book{display:grid;grid-template-columns:1fr;gap:1.5rem;align-items:start;}
.book + .book{margin-top:2.5rem;padding-top:2.5rem;border-top:1px solid var(--line);}
.book + .more{margin-top:1.5rem;}
.book .cover{
  display:block;width:min(100%,14rem);overflow:hidden;border-radius:var(--radius);
  border:1px solid var(--line);background:var(--surface);
}
/* The cover's own proportions, from the img width/height attributes: covers differ. */
.book .cover img{display:block;width:100%;height:auto;}
.book .text{display:flex;flex-direction:column;gap:.9rem;max-width:var(--measure);}
.book .get{display:flex;flex-wrap:wrap;gap:.6rem 1rem;align-items:center;}
@media (min-width:48rem){.book{grid-template-columns:14rem minmax(0,1fr);gap:2.5rem;}}

/* ── talks, contact ─────────────────────────────────────────────────── */
.talks{display:flex;flex-direction:column;gap:.9rem;max-width:var(--measure);}
.talks li{display:flex;flex-direction:column;gap:.15rem;}
.links{display:flex;flex-wrap:wrap;gap:.6rem;}
.links a{
  display:inline-block;border:1px solid var(--line-strong);border-radius:999px;
  padding:.45rem .95rem;text-decoration:none;color:var(--ink);background:var(--surface);font-size:.98rem;
}
.links a:hover{border-color:var(--ink);}
.email{font-size:clamp(1.2rem,2.4vw,1.6rem);overflow-wrap:anywhere;}

/* ── article pages (notes, reference, legal) ────────────────────────── */
.article{padding-block:clamp(2.5rem,6vw,4.5rem) var(--section);}
.article header{display:flex;flex-direction:column;gap:.9rem;margin-bottom:2.25rem;max-width:46rem;}
.article header .meta a{color:inherit;}
.prose{max-width:var(--measure);}
.prose > *+*{margin-top:1.1em;}
.prose h2{font-size:clamp(1.45rem,2.2vw,1.85rem);margin-top:2.2em;}
.prose ul,.prose ol{padding-inline-start:1.3em;}
.prose ul{list-style:disc;}
.prose ol{list-style:decimal;}
.prose li+li{margin-top:.4em;}
.prose blockquote{border-inline-start:2px solid var(--line-strong);padding-inline-start:1rem;color:var(--ink-2);}
.prose code{font-family:var(--mono);font-size:.86em;background:var(--surface);border:1px solid var(--line);border-radius:5px;padding:.05em .35em;}
.prose hr{border:0;border-top:1px solid var(--line);margin-block:2.2em;}
.prose .disclaimer{font-size:.92rem;line-height:1.55;color:var(--ink-2);border-top:1px solid var(--line);padding-top:1.25rem;margin-top:2.5rem;}
.prose .cite,.cite{font-size:.92rem;color:var(--ink-2);}
.fig{margin-block:1.8em;}
.fig .plate-img{display:block;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--surface);}
.fig img{width:100%;}
.fig figcaption{font-size:.9rem;color:var(--ink-2);margin-top:.6rem;line-height:1.5;}
.related{margin-top:3rem;max-width:var(--measure);}
.related ul{display:flex;flex-direction:column;gap:.6rem;margin-top:.9rem;}
.related li{display:flex;flex-wrap:wrap;gap:.25rem .75rem;align-items:baseline;justify-content:space-between;}

/* notes archive */
.archive{display:flex;flex-direction:column;gap:1rem;}

/* newsletter (plain HTML; off while NEWSLETTER_ACTION is None) */
.nl{display:flex;flex-direction:column;gap:.6rem;max-width:30rem;}
.nl-hp{position:absolute;left:-9999px;}
.nl-row{display:flex;flex-wrap:wrap;gap:.6rem;}
.nl input[type=email]{
  flex:1 1 14rem;font:inherit;padding:.6rem .8rem;border:1px solid var(--line-strong);
  border-radius:10px;background:var(--surface);color:var(--ink);
}
.nl button{
  font:inherit;padding:.6rem 1.1rem;border-radius:999px;border:1px solid var(--ink);
  background:var(--ink);color:var(--bg);cursor:pointer;
}

/* ── footer ─────────────────────────────────────────────────────────── */
.foot{border-top:1px solid var(--line);margin-top:var(--section);padding-block:2rem 2.5rem;}
.foot-inner{display:flex;flex-direction:column;gap:.9rem;}
.foot nav{display:flex;flex-wrap:wrap;gap:.4rem 1.25rem;}
.foot nav a{color:var(--ink-2);text-decoration:none;font-size:.95rem;}
.foot nav a:hover{color:var(--ink);}
.foot p{font-size:.85rem;color:var(--ink-2);line-height:1.5;}

/* ── redirect stubs ─────────────────────────────────────────────────── */
.stub{padding-block:4rem;max-width:var(--measure);}
