:root{
  --bg:#f4f2ec;
  --panel:#fbfaf6;
  --ink:#171716;
  --muted:#706e68;
  --line:#d8d5cd;
  --soft:#ebe8df;
  --accent:#7e765f;
  --accent-rgb:126,118,95;
  --shadow:0 18px 50px rgba(30,28,22,.08);
}
html[data-mode="dark"]{
  --bg:#171817;
  --panel:#1f211f;
  --ink:#f1efe8;
  --muted:#aaa89f;
  --line:#373934;
  --soft:#262824;
  --shadow:0 18px 50px rgba(0,0,0,.22);
}
html[data-theme="spring"]{--accent:#68876b;--accent-rgb:104,135,107}
html[data-theme="summer"]{--accent:#b67c36;--accent-rgb:182,124,54}
html[data-theme="autumn"]{--accent:#a15d3b;--accent-rgb:161,93,59}
html[data-theme="winter"]{--accent:#60788d;--accent-rgb:96,120,141}
html[data-theme="christmas"]{--accent:#9b4540;--accent-rgb:155,69,64}
html[data-theme="newyear"]{--accent:#a18444;--accent-rgb:161,132,68}
html[data-theme="oldyearsday"]{--accent:#9a774d;--accent-rgb:154,119,77}
html[data-theme="pannekoek"]{--accent:#b47645;--accent-rgb:180,118,69}
html[data-theme="joycebirthday"]{--accent:#a86682;--accent-rgb:168,102,130}
html[data-theme="evybirthday"]{--accent:#7f7198;--accent-rgb:127,113,152}
html[data-theme="goodfriday"]{--accent:#706965;--accent-rgb:112,105,101}
html[data-theme="easter"]{--accent:#8a7396;--accent-rgb:138,115,150}
html[data-theme="pentecost"]{--accent:#b85f45;--accent-rgb:184,95,69}
html[data-theme="mothersday"]{--accent:#b66c7d;--accent-rgb:182,108,125}
html[data-theme="fathersday"]{--accent:#627c88;--accent-rgb:98,124,136}
html[data-theme="sinterklaas"]{--accent:#a74a40;--accent-rgb:167,74,64}
html[data-theme="birthday"]{--accent:#af5f8b;--accent-rgb:175,95,139}
html[data-theme="anniversary"]{--accent:#a45f55;--accent-rgb:164,95,85}
html[data-theme="bookday"]{--accent:#89664c;--accent-rgb:137,102,76}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  transition:background .25s ease,color .25s ease;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background:
    radial-gradient(circle at 92% 4%,rgba(var(--accent-rgb),.09),transparent 29rem),
    radial-gradient(circle at 4% 70%,rgba(var(--accent-rgb),.05),transparent 26rem);
}
a{color:inherit}
button,input,select,textarea{font:inherit}
button{color:inherit}
img{max-width:100%}
::selection{background:rgba(var(--accent-rgb),.24)}

.academic-header{
  position:sticky;
  top:0;
  z-index:50;
  display:grid;
  grid-template-columns:minmax(210px,1fr) auto minmax(210px,1fr);
  align-items:center;
  gap:28px;
  min-height:82px;
  padding:14px clamp(22px,4.8vw,78px);
  background:color-mix(in srgb,var(--bg),transparent 7%);
  border-bottom:1px solid color-mix(in srgb,var(--line),transparent 22%);
  backdrop-filter:blur(16px);
}
.brand{
  width:max-content;
  display:grid;
  gap:2px;
  text-decoration:none;
}
.brand strong{
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.22rem;
  letter-spacing:-.025em;
}
.brand span{font-size:.67rem;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}
.academic-nav{display:flex;align-items:center;gap:clamp(18px,2.2vw,34px)}
.academic-nav a,.mobile-nav a{
  color:var(--muted);
  text-decoration:none;
  font-size:.76rem;
  font-weight:700;
  letter-spacing:.04em;
}
.academic-nav a:hover,.mobile-nav a:hover{color:var(--ink)}
.header-tools{justify-self:end;display:flex;align-items:center;gap:10px}
.mode-toggle,.menu-toggle{
  border:1px solid var(--line);
  background:var(--panel);
  color:var(--ink);
  border-radius:999px;
  padding:9px 13px;
  cursor:pointer;
}
.mode-toggle{display:flex;align-items:center;gap:8px}
.mode-label{font-size:.7rem;font-weight:750}
html[data-mode="dark"] .mode-sun{opacity:.4}
html:not([data-mode="dark"]) .mode-moon{opacity:.4}
.menu-toggle{display:none}
.mobile-nav{grid-column:1/-1;padding:14px 0 3px;border-top:1px solid var(--line);gap:14px}
.mobile-nav:not([hidden]){display:grid}

.academic-hero{
  width:min(1500px,100%);
  min-height:calc(100vh - 82px);
  margin:auto;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.72fr);
  gap:clamp(44px,7vw,120px);
  align-items:center;
  padding:clamp(54px,7vw,108px) clamp(22px,4.8vw,78px) clamp(80px,8vw,130px);
}
.section-kicker{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:24px;
  color:var(--muted);
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.section-kicker span:first-child{color:var(--accent)}
.season-chip{
  padding:6px 9px;
  border:1px solid color-mix(in srgb,var(--accent),transparent 55%);
  border-radius:999px;
  color:var(--accent);
  letter-spacing:.06em;
}
.hero-title{
  margin:0;
  max-width:900px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(4.5rem,9.2vw,10.2rem);
  font-weight:400;
  line-height:.83;
  letter-spacing:-.07em;
}
.hero-line{
  display:block;
  padding:.04em .04em .13em 0;
  opacity:0;
  transform:translateY(28px);
  transition:opacity .8s ease,transform 1s cubic-bezier(.16,1,.3,1);
}
.hero-line.is-in{opacity:1;transform:none}
.hero-dynamic{
  color:var(--accent);
  min-height:1.03em;
  transition:opacity .35s ease,transform .35s ease;
}
.hero-dynamic.is-changing{opacity:0;transform:translateY(10px)}
.hero-intro{
  display:grid;
  grid-template-columns:minmax(0,560px) auto;
  gap:35px;
  align-items:end;
  margin-top:38px;
  padding-top:26px;
  border-top:1px solid var(--line);
}
.hero-intro p{margin:0;color:var(--muted);font-size:clamp(1rem,1.2vw,1.13rem);line-height:1.65}
.hero-links{display:grid;gap:8px}
.text-link{
  display:inline-flex;
  align-items:center;
  width:max-content;
  color:var(--ink);
  text-decoration:none;
  font-size:.78rem;
  font-weight:800;
  border-bottom:1px solid var(--ink);
  padding-bottom:3px;
}
.hero-portrait{
  position:relative;
  align-self:stretch;
  min-height:620px;
  overflow:hidden;
  background:var(--soft);
  border:1px solid var(--line);
}
.hero-portrait::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.18),transparent 42%);
  pointer-events:none;
}
.hero-portrait img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.hero-placeholder{
  height:100%;
  min-height:620px;
  display:grid;
  place-items:center;
  color:var(--muted);
  background:linear-gradient(145deg,rgba(var(--accent-rgb),.18),transparent 62%);
}
.portrait-caption{
  position:absolute;
  z-index:2;
  left:24px;
  right:24px;
  bottom:22px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:end;
  color:#fff;
  text-shadow:0 1px 14px rgba(0,0,0,.35);
}
.portrait-caption span{font-size:.68rem;font-weight:900;letter-spacing:.14em}
.portrait-caption em{max-width:220px;text-align:right;font:italic 700 .9rem/1.35 Georgia,serif}

.academic-section{
  width:min(1500px,100%);
  margin:auto;
  padding:clamp(90px,10vw,160px) clamp(22px,4.8vw,78px);
  border-top:1px solid var(--line);
}
.section-title{max-width:980px;margin-bottom:clamp(45px,6vw,85px)}
.section-title h2,.contact-intro h2{
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(3.8rem,8vw,8.6rem);
  font-weight:400;
  line-height:.86;
  letter-spacing:-.065em;
  padding-bottom:.1em;
}
.section-title-row{
  max-width:none;
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:30px;
}
.section-intro{
  max-width:640px;
  color:var(--muted);
  font-size:1.05rem;
  line-height:1.65;
}

.story-layout{
  display:grid;
  grid-template-columns:.75fr 1.1fr .8fr;
  gap:clamp(32px,5vw,80px);
  align-items:start;
}
.story-lead p{
  margin:0;
  font:italic 400 clamp(1.5rem,2.2vw,2rem)/1.42 Georgia,serif;
}
.story-body{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:32px;
  color:var(--muted);
  line-height:1.72;
}
.story-body p:first-child{margin-top:0}
.story-image{
  margin:0;
  aspect-ratio:4/5;
  overflow:hidden;
  background:var(--soft);
  border:1px solid var(--line);
}
.story-image img{display:block;width:100%;height:100%;object-fit:cover}
.story-placeholder{height:100%;display:grid;place-items:center;padding:30px;color:var(--muted)}

.academic-blog-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:18px;
}
.academic-blog-grid.blog-count-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.academic-blog-card{min-width:0}
.academic-blog-card>button{
  display:block;
  width:100%;
  padding:0;
  border:0;
  background:none;
  text-align:left;
  cursor:pointer;
}
.blog-card-image{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
  background:
    linear-gradient(145deg,rgba(var(--accent-rgb),.28),rgba(var(--accent-rgb),.06)),
    var(--soft);
  background-size:cover;
  background-position:center;
  border:1px solid var(--line);
}
.blog-number{
  position:absolute;
  top:12px;
  left:12px;
  padding:5px 7px;
  background:color-mix(in srgb,var(--panel),transparent 6%);
  color:var(--ink);
  font-size:.66rem;
  font-weight:900;
  letter-spacing:.08em;
}
.blog-card-copy{padding:15px 3px 0}
.blog-card-copy .meta{
  margin:0 0 8px;
  color:var(--accent);
  font-size:.64rem;
  font-weight:850;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.blog-card-copy h3{
  margin:0 0 10px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.15rem,1.45vw,1.55rem);
  font-weight:400;
  line-height:1.06;
  letter-spacing:-.025em;
}
.blog-card-copy>p:not(.meta){margin:0 0 12px;color:var(--muted);font-size:.82rem;line-height:1.5}
.card-arrow{font-size:.74rem;font-weight:800}

.academic-books-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(22px,3vw,42px);
}
.academic-book button{
  width:100%;
  padding:0;
  border:0;
  background:none;
  color:inherit;
  text-align:left;
  cursor:pointer;
}
.book-object{
  min-height:390px;
  display:grid;
  place-items:end center;
  padding:30px 25px 0;
  background:var(--soft);
  border:1px solid var(--line);
  overflow:hidden;
}
.book-object img{
  display:block;
  width:auto;
  max-width:100%;
  height:340px;
  object-fit:contain;
  filter:drop-shadow(0 16px 18px rgba(0,0,0,.18));
  transition:transform .3s ease;
}
.academic-book button:hover .book-object img{transform:translateY(-5px)}
.book-object>span{
  display:grid;
  place-items:center;
  width:74%;
  height:82%;
  padding:24px;
  background:var(--panel);
  border:1px solid var(--line);
  font:400 1.5rem/1.15 Georgia,serif;
  text-align:center;
}
.book-caption{padding-top:16px}
.book-caption h3{margin:0 0 5px;font:400 1.35rem/1.1 Georgia,serif}
.book-caption p{margin:0 0 8px;color:var(--muted);font-size:.78rem}
.book-caption span{font-size:.72rem;font-weight:800}
.books-note{margin-top:32px;color:var(--muted);font-size:.8rem}

.contact-section{
  display:grid;
  grid-template-columns:.86fr 1.14fr;
  gap:clamp(50px,8vw,130px);
  align-items:start;
}
.contact-intro p{max-width:520px;color:var(--muted);line-height:1.65}
.academic-contact-form{
  display:grid;
  gap:24px;
  padding:clamp(28px,4vw,52px);
  background:var(--panel);
  border:1px solid var(--line);
  box-shadow:var(--shadow);
}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.academic-contact-form label{
  display:grid;
  gap:8px;
  color:var(--muted);
  font-size:.68rem;
  font-weight:850;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.academic-contact-form input,.academic-contact-form textarea,.academic-contact-form select{
  width:100%;
  border:0;
  border-bottom:1px solid var(--line);
  padding:11px 0;
  outline:0;
  background:transparent;
  color:var(--ink);
  font-size:.95rem;
  letter-spacing:0;
  text-transform:none;
}
.academic-contact-form input:focus,.academic-contact-form textarea:focus,.academic-contact-form select:focus{border-color:var(--accent)}
.submit-button{
  justify-self:start;
  padding:11px 16px;
  border:1px solid var(--ink);
  border-radius:999px;
  background:var(--ink);
  color:var(--bg);
  font-weight:800;
  cursor:pointer;
}

.academic-footer{
  width:min(1500px,100%);
  margin:auto;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:25px;
  padding:30px clamp(22px,4.8vw,78px) 46px;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:.72rem;
}
.academic-footer a{justify-self:center;color:inherit}
.academic-footer span:last-child{justify-self:end;text-align:right}

.reveal{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .8s ease,transform .9s cubic-bezier(.16,1,.3,1);
}
.reveal.in-view{opacity:1;transform:none}

dialog[hidden],dialog:not([open]){display:none!important}
dialog[open]{
  display:grid!important;
  grid-template-columns:minmax(260px,.85fr) minmax(320px,1.15fr);
}
dialog{
  width:min(900px,calc(100% - 28px));
  padding:0;
  border:1px solid var(--line);
  background:var(--panel);
  color:var(--ink);
  box-shadow:0 32px 90px rgba(0,0,0,.25);
}
dialog::backdrop{background:rgba(14,14,13,.68);backdrop-filter:blur(3px)}
dialog .close{
  position:absolute;
  top:12px;
  right:14px;
  z-index:3;
  width:36px;
  height:36px;
  border:1px solid var(--line);
  border-radius:50%;
  background:var(--panel);
  cursor:pointer;
}
.dialog-image,.book-dialog-art,.book-dialog-cover{min-height:460px}
.dialog-image{
  background:var(--soft);
  background-size:cover;
  background-position:center;
}
.book-dialog-art{display:grid;place-items:center;background:var(--soft);font:400 3rem Georgia,serif}
.book-dialog-cover{width:100%;height:100%;object-fit:contain;padding:30px;background:var(--soft)}
.dialog-copy{padding:clamp(32px,5vw,62px)}
.dialog-copy .eyebrow{color:var(--accent);font-size:.68rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.dialog-copy h2{margin:.25em 0;font:400 clamp(2rem,4.5vw,4.2rem)/.92 Georgia,serif;letter-spacing:-.04em}
.dialog-copy p,.dialog-copy div{color:var(--muted);line-height:1.65}
.dialog-readmore{display:inline-block;margin-top:18px;font-weight:800;color:var(--ink)}

.site-lightbox[hidden]{display:none!important}
.site-lightbox{
  position:fixed;
  inset:0;
  z-index:1000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:30px 72px;
  background:rgba(0,0,0,.92);
}
.site-lightbox-figure{margin:0;width:min(1100px,86vw);text-align:center}
.site-lightbox img{display:block;max-width:100%;max-height:82vh;margin:auto}
.site-lightbox figcaption{margin-top:12px;color:#ddd;font-size:.8rem}
.site-lightbox button{
  position:absolute;
  border:0;
  background:rgba(255,255,255,.1);
  color:#fff;
  cursor:pointer;
}
.site-lightbox-close{right:20px;top:18px;width:44px;height:44px;border-radius:50%;font-size:2rem}
.site-lightbox-prev,.site-lightbox-next{top:50%;transform:translateY(-50%);width:46px;height:64px;border-radius:999px;font-size:2.3rem}
.site-lightbox-prev{left:22px}
.site-lightbox-next{right:22px}
html.lightbox-open,html.lightbox-open body{overflow:hidden}

@media(max-width:1180px){
  .academic-header{grid-template-columns:1fr auto}
  .academic-nav{display:none}
  .menu-toggle{display:block}
  .academic-hero{grid-template-columns:1fr .65fr}
  .hero-title{font-size:clamp(4rem,9vw,8rem)}
  .story-layout{grid-template-columns:1fr 1.25fr}
  .story-image{grid-column:1/3;max-width:440px}
  .academic-blog-grid,.academic-blog-grid.blog-count-4{grid-template-columns:repeat(3,1fr)}
  .academic-books-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:820px){
  .academic-header{min-height:72px;padding-inline:20px}
  .mode-label{display:none}
  .academic-hero{grid-template-columns:1fr;min-height:auto;padding-inline:22px}
  .hero-title{font-size:clamp(4rem,15vw,7.5rem)}
  .hero-intro{grid-template-columns:1fr}
  .hero-portrait{min-height:520px}
  .hero-placeholder{min-height:520px}
  .academic-section{padding-inline:22px}
  .story-layout{grid-template-columns:1fr}
  .story-body{grid-template-columns:1fr}
  .story-image{grid-column:auto;max-width:none}
  .academic-blog-grid,.academic-blog-grid.blog-count-4{grid-template-columns:repeat(2,1fr)}
  .academic-books-grid{grid-template-columns:repeat(2,1fr)}
  .contact-section{grid-template-columns:1fr}
  .section-title-row{align-items:start;flex-direction:column}
}
@media(max-width:560px){
  .brand span{display:none}
  .header-tools{gap:6px}
  .mode-toggle,.menu-toggle{padding:8px 10px}
  .hero-title{font-size:clamp(3.7rem,18vw,6rem)}
  .hero-portrait,.hero-placeholder{min-height:430px}
  .academic-blog-grid,.academic-blog-grid.blog-count-4,.academic-books-grid{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .book-object{min-height:350px}
  .book-object img{height:300px}
  .academic-footer{grid-template-columns:1fr;text-align:center}
  .academic-footer a,.academic-footer span:last-child{justify-self:center;text-align:center}
  dialog[open]{grid-template-columns:1fr}
  .dialog-image,.book-dialog-art,.book-dialog-cover{min-height:260px}
  .site-lightbox{padding:55px 10px 22px}
  .site-lightbox-prev{left:7px}.site-lightbox-next{right:7px}
}
@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;animation:none!important;transition:none!important}
  .reveal,.hero-line{opacity:1!important;transform:none!important}
}


/* v0.5.1 — seizoenen weer zichtbaar, maar passend binnen de Academic-richting */
.academic-hero{position:relative;isolation:isolate}
.hero-text,.hero-portrait{position:relative;z-index:2}

.season-decoration{
  position:absolute;
  inset:22px clamp(12px,2vw,38px) 26px;
  z-index:1;
  pointer-events:none;
  overflow:visible;
}
.season-mark{
  position:absolute;
  display:grid;
  place-items:center;
  width:clamp(70px,9vw,138px);
  aspect-ratio:1;
  color:rgba(var(--accent-rgb),.24);
  border:1px solid rgba(var(--accent-rgb),.20);
  border-radius:50%;
  font:400 clamp(2.3rem,5vw,5rem)/1 Georgia,serif;
  animation:season-float 12s ease-in-out infinite alternate;
}
.season-mark::before{content:"✦"}
.season-mark-a{left:2%;top:4%;transform:rotate(-9deg)}
.season-mark-b{left:45%;top:8%;width:clamp(54px,6.4vw,100px);animation-delay:-4s}
.season-mark-c{left:48%;bottom:5%;width:clamp(42px,5vw,78px);animation-delay:-8s}
.season-watermark{
  position:absolute;
  left:1.5%;
  top:58%;
  right:auto;
  bottom:auto;
  width:min(54%,820px);
  color:rgba(var(--accent-rgb),.105);
  font:italic 400 clamp(5rem,10vw,10.5rem)/1.08 Georgia,serif;
  letter-spacing:-.065em;
  transform:translateY(-50%) rotate(-6deg);
  transform-origin:left center;
  white-space:nowrap;
  text-transform:uppercase;
  user-select:none;
  overflow:visible;
}
html[data-mode="dark"] .season-watermark{
  color:rgba(var(--accent-rgb),.16);
}
.academic-hero::before{
  content:"";
  position:absolute;
  z-index:0;
  width:clamp(240px,32vw,520px);
  aspect-ratio:1;
  left:clamp(-70px,-3vw,-20px);
  right:auto;
  top:clamp(110px,14vw,210px);
  border-radius:50%;
  background:
    radial-gradient(circle at center,
      rgba(var(--accent-rgb),.12) 0 1px,
      transparent 2px 31%,
      rgba(var(--accent-rgb),.08) 31.5% 32%,
      transparent 32.5% 48%,
      rgba(var(--accent-rgb),.055) 48.5% 49%,
      transparent 49.5%);
  pointer-events:none;
}

/* gewone seizoenen */
html[data-theme="spring"] .season-mark::before{content:"✽"}
html[data-theme="spring"] .season-mark{border-radius:48% 52% 44% 56%}
html[data-theme="spring"] .academic-hero::before{transform:rotate(18deg) scale(.94)}

html[data-theme="summer"] .season-mark::before{content:"☼"}
html[data-theme="summer"] .season-mark{border-style:dashed}
html[data-theme="summer"] .academic-hero::before{
  background:repeating-radial-gradient(circle at center,rgba(var(--accent-rgb),.11) 0 1px,transparent 2px 26px);
}

html[data-theme="autumn"] .season-mark::before{content:"◇"}
html[data-theme="autumn"] .season-mark{
  border-radius:66% 34% 70% 30% / 48% 60% 40% 52%;
  transform:rotate(24deg);
}
html[data-theme="autumn"] .season-mark-b{transform:rotate(-18deg)}
html[data-theme="autumn"] .season-mark-c{transform:rotate(48deg)}

html[data-theme="winter"] .season-mark::before{content:"✦"}
html[data-theme="winter"] .season-mark{border-radius:0;transform:rotate(45deg)}
html[data-theme="winter"] .season-mark::before{transform:rotate(-45deg)}
html[data-theme="winter"] .academic-hero::before{
  background:
    linear-gradient(60deg,transparent 48%,rgba(var(--accent-rgb),.09) 49% 51%,transparent 52%),
    linear-gradient(-60deg,transparent 48%,rgba(var(--accent-rgb),.07) 49% 51%,transparent 52%);
}

/* feestdagen en persoonlijke dagen */
html[data-theme="christmas"] .season-mark::before{content:"✦"}
html[data-theme="christmas"] .season-mark{border-color:rgba(var(--accent-rgb),.32)}
html[data-theme="christmas"] .season-watermark{font-style:normal}

html[data-theme="newyear"] .season-mark::before{content:"✧"}
html[data-theme="newyear"] .season-mark{box-shadow:0 0 0 12px rgba(var(--accent-rgb),.035),0 0 0 24px rgba(var(--accent-rgb),.02)}

html[data-theme="oldyearsday"] .season-mark::before{content:"✧"}
html[data-theme="oldyearsday"] .season-mark{border-style:dotted}
html[data-theme="oldyearsday"] .season-watermark{font-style:normal}

html[data-theme="pannekoek"] .season-mark::before{content:"○"}
html[data-theme="pannekoek"] .season-mark-a{border-radius:50%;box-shadow:inset 0 0 0 9px rgba(var(--accent-rgb),.045)}
html[data-theme="pannekoek"] .season-mark-b{border-style:dashed}

html[data-theme="joycebirthday"] .season-mark::before{content:"✷"}
html[data-theme="joycebirthday"] .season-mark{border-style:dashed}

html[data-theme="evybirthday"] .season-mark::before{content:"✦"}
html[data-theme="evybirthday"] .season-mark{border-radius:46% 54% 40% 60%}

html[data-theme="goodfriday"] .season-mark::before{content:"†"}
html[data-theme="goodfriday"] .season-mark{border-radius:2px;border-style:dotted}

html[data-theme="easter"] .season-mark::before{content:"○"}
html[data-theme="easter"] .season-mark{border-radius:50% 50% 46% 46% / 58% 58% 42% 42%}

html[data-theme="pentecost"] .season-mark::before{content:"✦"}
html[data-theme="pentecost"] .season-mark-a{transform:rotate(12deg) translateY(-6px)}
html[data-theme="pentecost"] .season-mark-b{transform:rotate(-10deg) translateY(8px)}

html[data-theme="mothersday"] .season-mark::before{content:"♡"}
html[data-theme="mothersday"] .season-mark{border-style:dotted}

html[data-theme="fathersday"] .season-mark::before{content:"•"}
html[data-theme="fathersday"] .season-mark{box-shadow:inset 0 0 0 10px rgba(var(--accent-rgb),.035)}

html[data-theme="sinterklaas"] .season-mark::before{content:"✦"}
html[data-theme="sinterklaas"] .season-mark{border-radius:48% 52% 24% 76% / 63% 33% 67% 37%}

html[data-theme="birthday"] .season-mark::before{content:"✷"}
html[data-theme="birthday"] .season-mark{border-style:dashed}

html[data-theme="anniversary"] .season-mark::before{content:"∞"}
html[data-theme="anniversary"] .season-mark{border-radius:999px;width:clamp(92px,12vw,170px);aspect-ratio:1.6}

html[data-theme="bookday"] .season-mark::before{content:"▯"}
html[data-theme="bookday"] .season-mark{border-radius:3px}


/* ook de rest van de pagina krijgt een bescheiden seizoensaccent */
.academic-section{
  position:relative;
}
.academic-section::after{
  content:"";
  position:absolute;
  right:clamp(18px,4vw,64px);
  top:34px;
  width:56px;
  height:1px;
  background:rgba(var(--accent-rgb),.42);
  box-shadow:18px 8px 0 rgba(var(--accent-rgb),.20);
}
.blog-section::before,.books-section::before{
  content:"";
  position:absolute;
  pointer-events:none;
  width:clamp(100px,13vw,190px);
  aspect-ratio:1;
  border:1px solid rgba(var(--accent-rgb),.10);
  border-radius:50%;
  left:-5%;
  bottom:7%;
}
.books-section::before{left:auto;right:-5%;bottom:9%}

@keyframes season-float{
  from{translate:0 0;rotate:-3deg}
  to{translate:0 -13px;rotate:4deg}
}

@media(max-width:820px){
  .season-decoration{inset:12px 10px 18px}
  .season-mark-a{left:1%;top:2%}
  .season-mark-b{left:auto;right:4%;top:35%}
  .season-mark-c{left:4%;bottom:45%}
  .season-watermark{
    left:1%;
    top:43%;
    right:auto;
    bottom:auto;
    width:92%;
    font-size:clamp(3.8rem,18vw,7rem);
    transform:translateY(-50%) rotate(-5deg);
  }
  .academic-hero::before{left:-22%;right:auto;top:21%;opacity:.7}
}
@media(max-width:560px){
  .season-mark{opacity:.7}
  .season-watermark{opacity:.8}
}
@media(prefers-reduced-motion:reduce){
  .season-mark{animation:none!important}
}


/* v0.5.2 — boekpopup: omslag links, tekst rechts */
#bookDialog[open]{
  display:grid!important;
  grid-template-columns:minmax(260px,42%) minmax(0,58%);
  align-items:stretch;
  max-height:min(86vh,820px);
  overflow:hidden;
}
#bookDialog .book-dialog-art,
#bookDialog .book-dialog-cover{
  grid-column:1;
  grid-row:1;
  width:100%;
  min-height:0;
  height:100%;
  max-height:min(86vh,820px);
  margin:0;
}
#bookDialog .book-dialog-cover{
  object-fit:contain;
  padding:38px;
  background:var(--soft);
}
#bookDialog .book-dialog-art{
  place-self:stretch;
}
#bookDialog .dialog-copy{
  grid-column:2;
  grid-row:1;
  min-width:0;
  overflow-y:auto;
  max-height:min(86vh,820px);
  padding:clamp(34px,5vw,64px);
}
#bookDialog .dialog-copy h2{
  margin-top:.2em;
}
#bookDialog .dialog-copy #bookText{
  padding-bottom:24px;
}

@media(max-width:700px){
  #bookDialog[open]{
    grid-template-columns:1fr;
    max-height:90vh;
    overflow-y:auto;
  }
  #bookDialog .book-dialog-art,
  #bookDialog .book-dialog-cover{
    grid-column:1;
    grid-row:auto;
    height:auto;
    max-height:none;
    min-height:260px;
  }
  #bookDialog .book-dialog-cover{
    max-height:42vh;
    padding:24px;
  }
  #bookDialog .dialog-copy{
    grid-column:1;
    grid-row:auto;
    max-height:none;
    overflow:visible;
    padding:30px 24px 38px;
  }
}