:root{
  --paper: #f8f6f3;
  --paper-raised: #ffffff;
  --ink: #161311;
  --ink-soft: #5b5550;
  --ink-faint: #928c85;
  --line: #e6e1da;
  --accent: #d9600a;
  --accent-strong: #b84e06;
  --accent-soft: #fbe3cd;
  --shadow: rgba(20,15,10,0.10);
  --artwork-bg: url("kanizsa-artwork.jpg");
  --artwork-opacity: 0.16;
  --artwork-filter: none;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper: #0a0a0a;
    --paper-raised: #17140f;
    --ink: #f5f1ec;
    --ink-soft: #b8b1a8;
    --ink-faint: #79726a;
    --line: #2a251e;
    --accent: #ed6d05;
    --accent-strong: #ff8c3d;
    --accent-soft: #3a2410;
    --shadow: rgba(0,0,0,0.5);
    --artwork-opacity: 0.14;
    --artwork-filter: invert(1) brightness(0.9);
  }
}
:root[data-theme="dark"]{
  --paper: #0a0a0a;
  --paper-raised: #17140f;
  --ink: #f5f1ec;
  --ink-soft: #b8b1a8;
  --ink-faint: #79726a;
  --line: #2a251e;
  --accent: #ed6d05;
  --accent-strong: #ff8c3d;
  --accent-soft: #3a2410;
  --shadow: rgba(0,0,0,0.5);
  --artwork-opacity: 0.14;
  --artwork-filter: invert(1) brightness(0.9);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"Raleway", ui-sans-serif, system-ui, sans-serif;
  font-size:16px;
  line-height:1.55;
  padding-inline:20px;
  -webkit-font-smoothing:antialiased;
  position:relative;
}
.bg-art{
  position:fixed; inset:0; z-index:-1;
  background-image:var(--artwork-bg);
  background-repeat:no-repeat;
  background-position:center 8%;
  background-size:min(1100px, 130vw);
  opacity:var(--artwork-opacity);
  filter:var(--artwork-filter);
  pointer-events:none;
}
.bg-art::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 0%, var(--paper) 92%);
}
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ animation-duration:0.01ms !important; transition-duration:0.01ms !important; }
}

.wrap{ max-width:1080px; margin-inline:auto; }

h1,h2,h3{ font-family:"Raleway", ui-sans-serif, sans-serif; font-weight:800; text-wrap:balance; margin:0; }
.eyebrow{
  font-family:"Raleway", ui-sans-serif, sans-serif;
  font-weight:700;
  font-size:12.5px;
  letter-spacing:0.09em;
  text-transform:uppercase;
  color:var(--accent);
  display:flex; align-items:center; gap:10px;
}
.eyebrow::before{ content:""; width:22px; height:1px; background:var(--accent); display:inline-block; }
p{ margin:0; }
a{ color:inherit; }
.tnum{ font-variant-numeric:tabular-nums; }

/* ---------- top bar (shared across both homepages) ---------- */
.topbar{
  position:sticky; top:0; z-index:40;
  background:color-mix(in srgb, var(--paper) 88%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
  padding-block:14px;
  margin-inline:-20px; padding-inline:20px;
}
.topbar .wrap{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.mark{ display:flex; align-items:center; gap:8px; font-family:"Raleway", sans-serif; font-weight:800; font-size:16.5px; }
.mark-part{ text-decoration:none; color:var(--ink-faint); font-weight:400; border-bottom:1px solid transparent; }
.mark-part:hover{ color:var(--accent-strong); border-bottom-color:var(--accent-strong); }
.mark-part.current{ color:var(--ink); font-weight:600; cursor:default; }
.mark-sep{ color:var(--ink-faint); font-weight:400; }
.nav{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; font-size:14px; color:var(--ink-soft); }
.nav a{ text-decoration:none; }
.nav a:hover{ color:var(--ink); }

/* ---------- hero ---------- */
.hero{ display:flex; flex-direction:column; align-items:flex-start; gap:8px; padding-block:76px 44px; max-width:640px; }
@media (max-width:860px){ .hero{ padding-block:44px 30px; } }
.hero h1{ font-size:clamp(2.2rem, 5vw, 3.2rem); line-height:1.03; }
.hero .sub{
  font-family:"Raleway", sans-serif; font-style:italic; font-weight:600;
  font-size:clamp(1.05rem, 2vw, 1.3rem); color:var(--ink-soft); margin-top:2px;
}
.hero .lede{ margin-top:12px; max-width:58ch; color:var(--ink-soft); font-size:16px; }
.cta-row{ display:flex; gap:12px; margin-top:20px; flex-wrap:wrap; }
.btn{
  font-family:"Raleway", sans-serif; font-weight:700; font-size:13px; letter-spacing:0.02em;
  padding:11px 18px; border-radius:8px; text-decoration:none; display:inline-flex; align-items:center; gap:8px;
  border:1px solid var(--line);
}
.btn.primary{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.btn.primary:hover{ opacity:0.88; }
.btn.ghost{ color:var(--ink); }
.btn.ghost:hover{ border-color:var(--ink-soft); }

/* ---------- sections ---------- */
section{ padding-block:52px; border-top:1px solid var(--line); }
.section-head{ display:flex; flex-direction:column; gap:10px; margin-bottom:32px; max-width:62ch; }
.section-head h2{ font-size:clamp(1.5rem, 2.6vw, 2rem); }
.branch-intro{ max-width:62ch; color:var(--ink-soft); font-size:15.5px; margin-bottom:30px; }
.subhead{ font-family:"Raleway", sans-serif; font-weight:700; font-size:12px; text-transform:uppercase; letter-spacing:0.07em; color:var(--ink-faint); margin:36px 0 14px; }

/* agenda / programme */
.agenda{ list-style:none; padding:0; margin:0; border-top:1px solid var(--line); }
.agenda > li{
  display:grid; grid-template-columns:96px 1fr; gap:20px; padding-block:20px;
  border-bottom:1px solid var(--line);
}
@media (max-width:600px){ .agenda > li{ grid-template-columns:1fr; gap:6px; } }
.agenda .slot{ font-family:"Raleway", sans-serif; font-weight:600; font-size:13px; color:var(--ink-faint); padding-top:3px; }
.agenda .slot-title{ font-size:15px; color:var(--ink); }
.agenda li.tba .slot-title{ color:var(--ink-faint); font-style:italic; }
.agenda li.keynote-link{ background:var(--paper-raised); margin-inline:-20px; padding-inline:20px; border-radius:12px; border-bottom:1px solid var(--line); }
@media (max-width:600px){ .agenda li.keynote-link{ margin-inline:0; } }
.agenda li.keynote-link a{ text-decoration:none; color:var(--accent-strong); font-weight:500; }
.agenda li.keynote-link a:hover{ text-decoration:underline; }
.prog-note{ margin-top:20px; font-size:13px; color:var(--ink-faint); font-style:italic; }

/* event card (Kanizsa Lecture keynote) */
.event-card{
  background:var(--paper-raised); border:1px solid var(--line); border-radius:14px;
  padding:clamp(22px,3.5vw,40px); box-shadow:0 1px 2px var(--shadow);
  display:grid; grid-template-columns:1fr 1fr; gap:36px;
}
@media (max-width:760px){ .event-card{ grid-template-columns:1fr; } }
.badge{
  display:inline-flex; align-self:flex-start; font-family:"Raleway", sans-serif; font-weight:700; font-size:12px;
  background:var(--accent-soft); color:var(--accent-strong); padding:5px 11px; border-radius:999px; letter-spacing:0.03em;
}
.talk-title{ font-family:"Raleway", sans-serif; font-weight:800; font-size:clamp(1.25rem,2.6vw,1.6rem); margin-top:14px; text-wrap:balance; }
.speaker{ margin-top:8px; color:var(--ink-soft); font-size:15px; }
.speaker strong{ color:var(--ink); font-weight:600; }
.abstract{ margin-top:18px; font-size:14.5px; color:var(--ink-soft); }
.abstract summary{ cursor:pointer; font-family:"Raleway",sans-serif; font-weight:700; font-size:12px; color:var(--accent-strong); letter-spacing:0.02em; }
.abstract p{ margin-top:12px; }

dl.meta{ display:grid; grid-template-columns:auto 1fr; gap:9px 16px; font-size:14.5px; align-content:start; }
dl.meta dt{ font-family:"Raleway", sans-serif; font-weight:700; font-size:11.5px; text-transform:uppercase; letter-spacing:0.06em; color:var(--ink-faint); padding-top:2px; }
dl.meta dd{ margin:0; color:var(--ink); }

/* prose / about */
.prose-grid{ display:grid; grid-template-columns:1fr 1fr; gap:48px; }
@media (max-width:760px){ .prose-grid{ grid-template-columns:1fr; gap:36px; } }
.prose p{ color:var(--ink-soft); font-size:15.5px; max-width:56ch; }
.prose p + p{ margin-top:14px; }
.prose .lead-cap::first-letter{ font-family:"Raleway", sans-serif; font-size:2.6em; float:left; line-height:0.85; padding-right:8px; padding-top:4px; color:var(--ink); font-weight:800; }

.kanizsa-frame{
  position:relative; border-radius:14px; overflow:hidden; border:1px solid var(--line);
  background: var(--artwork-bg) center / cover no-repeat, linear-gradient(155deg, var(--paper-raised), var(--paper));
  min-height:280px; display:flex; align-items:flex-end; padding:18px;
}
html[data-theme="dark"] .kanizsa-frame{ filter:invert(1) brightness(0.9) contrast(1.05); }
@media (prefers-color-scheme: dark){
  html:not([data-theme="light"]) .kanizsa-frame{ filter:invert(1) brightness(0.9) contrast(1.05); }
}
.kanizsa-frame .cap{
  font-family:"Raleway", sans-serif; font-weight:600; font-size:11.5px; color:var(--ink-faint);
  background:color-mix(in srgb, var(--paper) 82%, transparent); backdrop-filter:blur(4px);
  padding:6px 10px; border-radius:6px;
}

/* organizers list */
.people{ display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.people span{ font-size:13px; border:1px solid var(--line); border-radius:999px; padding:5px 12px; color:var(--ink-soft); }

/* archive */
.archive-list{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.archive-list li{
  display:grid; grid-template-columns:84px 1fr auto; gap:16px; align-items:baseline;
  padding-block:13px; border-bottom:1px solid var(--line); font-size:14.5px;
}
@media (max-width:600px){ .archive-list li{ grid-template-columns:60px 1fr; } .archive-list li a.ext{ grid-column:1 / -1; justify-self:start; margin-top:2px; } }
.archive-list .yr{ font-family:"Raleway", sans-serif; font-weight:700; color:var(--ink); }
.archive-list .desc{ color:var(--ink-soft); }
.archive-list .desc .who{ color:var(--ink); }
.archive-list a.ext{ font-family:"Raleway", sans-serif; font-weight:600; font-size:12px; color:var(--accent-strong); text-decoration:none; white-space:nowrap; }
.archive-list a.ext:hover{ text-decoration:underline; }
.archive-list .ext-group{ display:flex; gap:12px; flex-wrap:wrap; justify-content:flex-end; }
@media (max-width:600px){ .archive-list .ext-group{ justify-self:start; } }
.archive-note{ margin-top:16px; font-size:13px; color:var(--ink-faint); font-style:italic; }

/* contact / footer */
.contact-grid{ display:grid; grid-template-columns:1.2fr 1fr; gap:40px; }
@media (max-width:760px){ .contact-grid{ grid-template-columns:1fr; gap:28px; } }
.contact-line{ font-size:15.5px; color:var(--ink-soft); max-width:48ch; }
.contact-line a{ color:var(--accent-strong); text-decoration:none; border-bottom:1px solid var(--accent-strong); }
.org-box{ border:1px solid var(--line); border-radius:12px; padding:18px 20px; font-size:14px; color:var(--ink-soft); background:var(--paper-raised); }
.org-box strong{ color:var(--ink); display:block; margin-bottom:4px; font-family:"Raleway", sans-serif; font-weight:800; font-size:15px; }
footer{ border-top:1px solid var(--line); padding-block:26px 40px; margin-top:8px; }
footer .wrap{ display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:12.5px; color:var(--ink-faint); }
