/* ==========================================================================
   Papir (arbejdskopien /forside2, kladde)
   Emil, 3.10.2026: måden at dele forsiden op på fra udkastet "Papirskift".
   Hver sektion ligger på et ark papir, og når papiret skifter, er kanten
   revet. Arket er en ramme om sektionen (eller om flere, der hører sammen),
   så papirets mønster løber ubrudt gennem den. Bygges af scripts/byg-forside2.js.

   Den revne kant er en strimmel af arkets eget papir, der går --papir-riv op
   over det, der ligger ovenfor. Takkerne står som clip-path på det inderste
   element (regnet ud i byggescriptet: samme kant som i udkastet), og skyggen
   ligger på det yderste, så den følger takkerne og klippes af ved strimlens
   underkant. Kanten er et element for sig, så sektionernes tekst ikke står
   inde i et filter. Efter det sidste ark går sidens hvide på samme måde op
   over arket (.papir__kant--bund).

   Papirfarverne og den revne kant findes ikke i grundsættet endnu. Bliver
   udtrykket valgt, skal de ind dér.
   ========================================================================== */

.papir {
  --papir-riv: var(--space-m);   /* 16 -> 24: så langt går arket op over det, der ligger ovenfor */
  position: relative;
}
/* Sektioner på samme ark hører sammen: kun én gang luft imellem dem. */
.papir > section + section { padding-top: 0; }

/* Prikket papir: en prik for hver 22 px. */
.papir--prikket { --papir-farve: #F4F3EF; --papir-prik: #D9D6CE; }
.papir--prikket, .papir--prikket > .papir__kant div { background-color: var(--papir-farve); background-image: radial-gradient(var(--papir-prik) 1.1px, transparent 1.3px); background-size: 22px 22px; }

/* Ternet papir: store tern for hver 110 px og fine for hver 22 px. Samme papir som lapperne i de tegnede sektioner. */
.papir--ternet { --papir-farve: #FAF8F2; --papir-tern: #E4E0D4; --papir-tern-fin: #EFECE2; }
.papir--ternet, .papir--ternet > .papir__kant div {
  background-color: var(--papir-farve);
  background-image: linear-gradient(var(--papir-tern) 1px, transparent 1px), linear-gradient(90deg, var(--papir-tern) 1px, transparent 1px), linear-gradient(var(--papir-tern-fin) 1px, transparent 1px), linear-gradient(90deg, var(--papir-tern-fin) 1px, transparent 1px);
  background-size: 110px 110px, 110px 110px, 22px 22px, 22px 22px;
}

.papir__kant { position: absolute; inset: calc(var(--papir-riv) * -1) 0 auto; height: calc(var(--papir-riv) * 2); filter: drop-shadow(0 -3px 3px rgb(42 31 26 / .18)); clip-path: inset(calc(var(--papir-riv) * -1) 0 0); pointer-events: none; }
.papir__kant div { height: 100%; background-position: 0 var(--papir-riv); }   /* mønstret flugter med arkets */
/* Den nederste kant står sidst i arket og fylder selv sin højde. */
.papir__kant--bund { position: relative; inset: auto; }
/* Den omvendte kant (Emil, 3.10.2026): sidens hvide ligger øverst og går --papir-riv ned over arket. Takkerne
   vender nedad, og skyggen falder ned på arket. 1 px op over arkets kant, så der ikke står en sprække. */
.papir__kant--ned { inset: -1px 0 auto; height: calc(var(--papir-riv) + 1px); filter: drop-shadow(0 3px 3px rgb(42 31 26 / .18)); clip-path: inset(0 0 calc(var(--papir-riv) * -1)); }
.papir > .papir__kant--bund div, .papir > .papir__kant--ned div { background: var(--bg); }