/* Nova Ling — författarsida
   Palett: snö, sot, betong, aska. Färgen kommer från omslagen. */

@font-face { font-family: "Spectral"; src: url("fonts/spectral-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Spectral"; src: url("fonts/spectral-latin-400-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Spectral"; src: url("fonts/spectral-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Spectral"; src: url("fonts/spectral-latin-500-italic.woff2") format("woff2"); font-weight: 500; font-style: italic; font-display: swap; }
@font-face { font-family: "Spectral"; src: url("fonts/spectral-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Marcellus"; src: url("fonts/marcellus-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Schibsted Grotesk"; src: url("fonts/schibsted-grotesk-latin-wght-normal.woff2") format("woff2-variations"); font-weight: 400 800; font-style: normal; font-display: swap; }

:root {
  --sno: #eceeec;
  --sno-ljus: #f5f6f4;
  --sot: #17191b;
  --betong: #5a6166;
  --aska: #c9ceca;
  --natt: #1f2326;
  --natt-text: #c3c8c5;
  --serif: "Spectral", Georgia, "Times New Roman", serif;
  --signum: "Marcellus", "Trajan Pro", Georgia, serif;
  --sans: "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;
  --matt: 72rem;
  --kant: clamp(1.25rem, 4vw, 3rem);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 5rem; }
html.mjuk { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html.mjuk { scroll-behavior: auto; } }
body { margin: 0; background: var(--sno); color: var(--sot); font-family: var(--serif); font-size: 1.125rem; line-height: 1.6; text-rendering: optimizeLegibility; font-feature-settings: "kern", "liga", "onum"; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 0.2em; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--sot); outline-offset: 3px; }
.mork :focus-visible { outline-color: var(--sno); }
h1, h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; }

.hoppa { position: absolute; left: -999px; top: 0; background: var(--sot); color: var(--sno); padding: .6rem 1rem; font-family: var(--sans); z-index: 10; }
.hoppa:focus { left: 1rem; top: 1rem; }
.dold { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.ram { max-width: var(--matt); margin: 0 auto; padding: 0 var(--kant); }
.ram.smal { max-width: 44rem; }

/* Sidhuvud */
.huvud { padding: 1.4rem 0; }
.huvud .ram { display: flex; align-items: baseline; justify-content: space-between; gap: 0.8rem 1.5rem; flex-wrap: wrap; }
.namn { font-family: var(--signum); font-weight: 400; font-size: 1.3rem; letter-spacing: 0; text-transform: uppercase; text-decoration: none; white-space: nowrap; }
.meny { display: flex; flex-wrap: wrap; gap: 0.4rem clamp(1rem, 2.6vw, 2rem); font-family: var(--sans); font-size: 0.95rem; }
.meny a { text-decoration: none; color: var(--betong); }
.meny a:hover, .meny a[aria-current="page"] { color: var(--sot); text-decoration: underline; }
.meny .sprak { padding-left: clamp(1rem, 2.6vw, 2rem); border-left: 1px solid var(--aska); }

/* Startbild */
.start { padding: clamp(1.5rem, 5vw, 4.5rem) 0 clamp(3rem, 8vw, 6.5rem); }
.start .ram { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 5.5rem); align-items: center; }
.omslag-stor { display: block; }
.omslag-stor img, .bok-omslag img { width: 100%; box-shadow: 0 1px 0 rgba(23,25,27,.08), 0 18px 30px -12px rgba(23,25,27,.45), 0 50px 80px -40px rgba(23,25,27,.35); }
.citat { margin: 0 0 2.2rem; font-style: italic; font-size: clamp(2.3rem, 5.4vw, 4.6rem); line-height: 1.05; letter-spacing: -0.015em; }
.citat p { margin: 0; }
.citat p + p { margin-left: 1.1em; }
.boktitel { margin: 0; font-weight: 600; font-size: clamp(1.5rem, 2.4vw, 1.95rem); line-height: 1.2; }
.boktitel span { display: block; font-weight: 400; }
.ingress { margin: 1rem 0 0; max-width: 34em; }
.fakta { margin: 1rem 0 0; font-family: var(--sans); font-size: 0.95rem; color: var(--betong); line-height: 1.5; }
.knappar { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.6rem; margin-top: 1.8rem; }
.knapp { display: inline-block; padding: 0.85rem 1.5rem; background: var(--sot); color: var(--sno-ljus); font-family: var(--sans); font-weight: 600; font-size: 1rem; text-decoration: none; border: 0; border-radius: 2px; cursor: pointer; }
.knapp:hover { background: #000; }
.knapp:disabled { opacity: .6; cursor: progress; }
.lank { font-family: var(--sans); font-weight: 600; font-size: 1rem; }

/* Mörka band */
.mork { background: var(--natt); color: var(--sno); }
.ursprung { padding: clamp(3.5rem, 8vw, 6.5rem) 0; }
.ursprung p { margin: 0; max-width: 30em; font-size: clamp(1.45rem, 2.8vw, 2.15rem); line-height: 1.35; }

.avsnitt { padding: clamp(3.5rem, 8vw, 6.5rem) 0; }
.avsnitt h2, .sidrubrik { margin: 0 0 2.5rem; font-weight: 500; font-size: clamp(2rem, 3.6vw, 2.8rem); line-height: 1.1; letter-spacing: -0.01em; }

/* Bokhylla: omslagen står på samma hyllplan oavsett format */
.hylla { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3rem clamp(1.25rem, 2.5vw, 2.25rem); }
.bok { display: flex; flex-direction: column; }
.omslag-lank { display: block; }
.bok .omslag { display: flex; align-items: flex-end; aspect-ratio: 2 / 3.2; margin-bottom: 1rem; }
.bok .omslag picture { width: 100%; }
.bok .omslag img { width: 100%; box-shadow: 0 12px 22px -12px rgba(23,25,27,.5); }
.bok h3 { margin: 0; font-weight: 600; font-size: 1.15rem; line-height: 1.25; }
.bok h3 a { text-decoration: none; }
.bok h3 a:hover { text-decoration: underline; }
.typ, .serie { margin: 0.3rem 0 0; font-family: var(--sans); font-size: 0.86rem; color: var(--betong); line-height: 1.4; }

/* Om Nova */
.om-nova .ram, .en-start .ram { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 5.5rem); align-items: start; }
.portratt { margin: 0; }
.portratt img { width: 100%; }
.bio p { margin: 0 0 1.1em; max-width: 34em; }
.bio .forsta { font-size: 1.3rem; line-height: 1.5; }
.mork .lank { color: var(--sno); }

/* Kontakt och formulär */
.kontakt { border-top: 1px solid var(--aska); }
.kontakt .ram { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 5.5rem); }
.kontakt h2 { margin-bottom: 1rem; }
.kontakt-intro { margin: 0; max-width: 24em; color: var(--betong); }
.formular { display: grid; gap: 1.1rem; max-width: 36rem; }
.falt { display: grid; gap: 0.35rem; }
.falt label { font-family: var(--sans); font-size: 0.92rem; font-weight: 600; }
.falt input, .falt select, .falt textarea { width: 100%; font: inherit; font-size: 1.05rem; color: var(--sot); background: var(--sno-ljus); border: 1px solid #9aa19d; border-radius: 2px; padding: 0.65rem 0.75rem; }
.falt textarea { resize: vertical; min-height: 9rem; }
.falt input:focus-visible, .falt select:focus-visible, .falt textarea:focus-visible { outline: 2px solid var(--sot); outline-offset: 1px; }
.samtycke { margin: 0; font-family: var(--sans); font-size: 0.86rem; color: var(--betong); }
.formular .knapp { justify-self: start; }
.status { margin: 0; font-family: var(--sans); font-size: 0.95rem; min-height: 1.5em; }
.status.ok { font-weight: 600; }

.fot { padding: 2rem 0 3rem; font-family: var(--sans); font-size: 0.88rem; color: var(--betong); border-top: 1px solid var(--aska); }
.fot .ram { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem 2rem; }
.fotlankar { display: flex; flex-wrap: wrap; gap: 0.5rem 1.4rem; }
.fotlankar a { color: var(--betong); }
.fotlankar a:hover { color: var(--sot); }

/* Boksida */
.boksida { padding-top: 0; }
.bok-topp { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 5.5rem); align-items: start; padding-bottom: clamp(3rem, 6vw, 5rem); }
.bok-omslag { position: sticky; top: 1.5rem; }
.tillbaka { margin: 0 0 clamp(1.5rem, 3vw, 2.5rem); font-family: var(--sans); font-size: 0.92rem; }
.tillbaka a { color: var(--betong); }
.bok-text .boktitel { font-size: clamp(2rem, 4vw, 3.1rem); line-height: 1.1; letter-spacing: -0.01em; margin-top: 0.4rem; }
.credit { margin: 0.8rem 0 0; font-style: italic; }
.pris { display: inline-block; margin: 1rem 0 0; font-family: var(--sans); font-size: 0.9rem; font-weight: 600; border-bottom: 2px solid var(--sot); }
.om-boken { margin-top: 1.8rem; }
.om-boken p { margin: 0 0 1.1em; max-width: 34em; }
.om-boken p:first-child { font-size: 1.25rem; line-height: 1.55; }

.utgavor { background: var(--sno-ljus); padding: clamp(3rem, 6vw, 5rem) 0; border-top: 1px solid var(--aska); border-bottom: 1px solid var(--aska); }
.utgavor h2 { margin: 0 0 2rem; font-weight: 500; font-size: clamp(1.8rem, 3vw, 2.4rem); }
.utgavor h3 { margin: 2.5rem 0 0.4rem; font-family: var(--sans); font-size: 1rem; font-weight: 600; }
.utgavor h3:first-of-type { margin-top: 0; }
.utgava-lista { list-style: none; margin: 0; padding: 0; }
.utgava { display: grid; grid-template-columns: 11rem minmax(0, 1fr) auto; gap: 0.4rem 2rem; align-items: center; padding: 1.2rem 0; border-bottom: 1px solid var(--aska); }
.ut-info.med-omslag { display: flex; gap: 1rem; align-items: center; }
.ut-omslag { flex: none; }
.ut-omslag img { display: block; width: 3.6rem; box-shadow: 0 6px 12px -6px rgba(23,25,27,.5); }
.ut-format { font-family: var(--sans); font-weight: 600; font-size: 0.95rem; }
.ut-format span { display: block; font-weight: 400; font-size: 0.86rem; color: var(--betong); margin-top: 0.15rem; }
.ut-info p { margin: 0; }
.ut-titel { font-size: 1.1rem; }
.ut-meta, .ut-not { font-family: var(--sans); font-size: 0.86rem; color: var(--betong); line-height: 1.5; }
.ut-not { margin-top: 0.25rem !important; }
.ut-lankar { display: flex; flex-wrap: wrap; gap: 0.5rem; justify-content: flex-end; }
.butik { display: inline-block; padding: 0.45rem 0.85rem; border: 1px solid var(--sot); border-radius: 2px; font-family: var(--sans); font-size: 0.88rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
.butik:hover { background: var(--sot); color: var(--sno-ljus); }

.stod { margin: clamp(2.5rem, 5vw, 4rem) 0 0; padding: 1.6rem 1.8rem; background: var(--natt); color: var(--sno); max-width: 44rem; }
.stod h2 { margin: 0 0 0.5rem; font-size: 1.3rem; font-weight: 600; }
.stod p { margin: 0; }
.stod a { color: var(--sno); font-weight: 600; }

/* Press */
.press { padding: clamp(1.5rem, 4vw, 3rem) 0 clamp(3rem, 8vw, 6rem); }
.press section { padding: 2.2rem 0; border-top: 1px solid var(--aska); }
.press h2 { margin: 0 0 1rem; font-weight: 500; font-size: 1.6rem; }
.kopiera { max-width: 38em; }
.kopiera p { margin: 0 0 1em; }
.pressbilder, .pressomslag { list-style: none; margin: 1.2rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 1.5rem; }
.pressbilder img { height: 16rem; width: auto; }
.pressomslag img { height: 11rem; width: auto; box-shadow: 0 8px 16px -8px rgba(23,25,27,.5); }
.pressbilder a, .pressomslag a { display: grid; gap: 0.5rem; font-family: var(--sans); font-size: 0.86rem; color: var(--betong); }
.faktalista { display: grid; grid-template-columns: auto 1fr; gap: 0.6rem 2rem; margin: 0; max-width: 44rem; }
.faktalista dt { font-family: var(--sans); font-size: 0.92rem; color: var(--betong); padding-top: 0.15rem; }
.faktalista dd { margin: 0; }

/* Engelska */
.en-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 3rem; }
.en-bok { display: grid; grid-template-columns: 12rem minmax(0, 1fr); gap: 2rem; align-items: start; max-width: 50rem; }
.en-bok .omslag img { width: 100%; box-shadow: 0 12px 22px -12px rgba(23,25,27,.5); }
.en-bok h3 { margin: 0.2rem 0 0.6rem; font-size: 1.5rem; font-weight: 500; }
.en-bok p { margin: 0 0 0.8rem; }
.en-bok .ut-lankar { justify-content: flex-start; }

/* Läsbara textsidor */
.lasbar { padding: clamp(1.5rem, 4vw, 3rem) 0 clamp(3rem, 8vw, 6rem); }
.lasbar h2 { font-weight: 500; font-size: 1.5rem; margin: 2rem 0 0.6rem; }

/* Utdrag */
.utdrag { padding: clamp(2rem, 6vw, 4.5rem) 0 clamp(3rem, 8vw, 6rem); }
.utdrag .text { max-width: 34rem; margin: 0 auto; padding: 0 var(--kant); font-size: 1.15rem; line-height: 1.7; hyphens: auto; }
.utdrag > header { max-width: 34rem; margin: 0 auto 3rem; padding: 0 var(--kant); }
.utdrag > header h1 { margin: 0; font-weight: 600; font-size: clamp(1.8rem, 4vw, 2.6rem); line-height: 1.15; }
.utdrag > header h1 span { display: block; font-weight: 400; }
.utdrag > header p { margin: 0.8rem 0 0; font-family: var(--sans); font-size: 0.95rem; color: var(--betong); }
.utdrag h2 { margin: 3.5rem 0 1.8rem; text-align: center; font-weight: 400; font-size: 2rem; }
.utdrag .text p { margin: 0; text-indent: 1.4em; }
.utdrag .text h2 + p { text-indent: 0; }
.utdrag .slut { max-width: 34rem; margin: 4rem auto 0; padding: 2.5rem var(--kant) 0; border-top: 1px solid var(--aska); }

@media (max-width: 1000px) {
  .hylla { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .utgava { grid-template-columns: minmax(0, 1fr); gap: 0.4rem; }
  .ut-lankar { justify-content: flex-start; margin-top: 0.4rem; }
}
@media (max-width: 760px) {
  .start .ram, .om-nova .ram, .kontakt .ram, .bok-topp, .en-start .ram { grid-template-columns: 1fr; }
  .omslag-stor { max-width: 19rem; }
  .bok-omslag { position: static; max-width: 17rem; }
  .citat p + p { margin-left: 0.6em; }
  .portratt { max-width: 24rem; }
  .hylla { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.5rem 1.25rem; }
  .en-bok { grid-template-columns: 8rem minmax(0, 1fr); gap: 1.25rem; }
  .meny .sprak { border-left: 0; padding-left: 0; }
}
@media (max-width: 420px) {
  .faktalista { grid-template-columns: 1fr; gap: 0.1rem; }
  .faktalista dd { margin-bottom: 0.8rem; }
}

.lank-rubrik { margin: 1rem 0 0.4rem; font-family: var(--sans); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--betong); }
.en-bok .ut-lankar { justify-content: flex-start; }
.en-bok .ut-lankar + .lank-rubrik { margin-top: 1.2rem; }

/* Språkrad på bokkort och titelnot */
.sprakrad { margin: 0.3rem 0 0; font-family: var(--sans); font-size: 0.86rem; font-weight: 600; color: var(--sot); }
.titelnot { margin: 0.6rem 0 0; font-family: var(--sans); font-size: 0.95rem; color: var(--betong); }

/* Böckerna på andra språk */
.sprak-avsnitt { background: var(--sno-ljus); border-top: 1px solid var(--aska); border-bottom: 1px solid var(--aska); }
.avsnitt-intro { margin: -1.2rem 0 2.5rem; max-width: 40rem; font-size: 1.15rem; color: var(--betong); }
.sprakgrupp h3 { margin: 0 0 1rem; font-family: var(--sans); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--betong); }
.sprakgrupp.stor { margin-bottom: 3rem; }
.sprak-bocker { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); gap: 1.25rem 2.5rem; }
.sprak-bocker a { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); grid-template-rows: auto 1fr; column-gap: 1.25rem; align-items: start; text-decoration: none; }
.sprak-bocker .omslag { grid-row: 1 / 3; }
.sprak-bocker .omslag img { box-shadow: 0 8px 18px -10px rgba(23,25,27,.55); }
.sprak-bocker .omslag.tomt { display: block; aspect-ratio: 2 / 3; background: var(--aska); }
.sb-titel { font-style: italic; font-size: 1.15rem; line-height: 1.3; padding-top: 0.2rem; }
.sprak-bocker a:hover .sb-titel { text-decoration: underline; }
.sb-format { font-family: var(--sans); font-size: 0.86rem; color: var(--betong); margin-top: 0.35rem; }
.sprakgrupper { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; border-top: 1px solid var(--aska); padding-top: 2.5rem; }
.sprak-lista { list-style: none; margin: 0; padding: 0; }
.sprak-lista li + li { margin-top: 0.8rem; }
.sprak-lista a { display: block; font-style: italic; font-size: 1.05rem; line-height: 1.35; text-decoration: none; }
.sprak-lista a:hover { text-decoration: underline; }
.sprak-lista span { display: block; font-family: var(--sans); font-size: 0.84rem; color: var(--betong); margin-top: 0.2rem; }
@media (max-width: 1000px) { .sprakgrupper { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .sprakgrupper { grid-template-columns: 1fr; } }

/* Läsaren: utdrag */
.lasare-topp { display: flex; justify-content: space-between; align-items: flex-end; gap: 1.5rem 3rem; flex-wrap: wrap; padding-top: clamp(1rem, 3vw, 2.5rem); padding-bottom: clamp(1.5rem, 3vw, 2.5rem); }
.lasare-topp h1 { margin: 0; font-weight: 500; font-size: clamp(1.9rem, 3.6vw, 2.8rem); line-height: 1.1; }
.lasare-topp .tillbaka { margin-bottom: 1rem; }
.lasare-sub { margin: 0.7rem 0 0; font-family: var(--sans); font-size: 0.95rem; color: var(--betong); max-width: 36rem; }
.vyval { display: inline-flex; border: 1px solid var(--sot); border-radius: 2px; overflow: hidden; }
.vyval button { font: 600 0.92rem var(--sans); padding: 0.6rem 1.1rem; background: transparent; color: var(--sot); border: 0; cursor: pointer; }
.vyval button + button { border-left: 1px solid var(--sot); }
.vyval button[aria-pressed="true"] { background: var(--sot); color: var(--sno-ljus); }
html:not(.js) .vyval { display: none; }

.bokvy { background: var(--natt); color: var(--natt-text); padding: clamp(1.25rem, 3vw, 2.5rem) 0 1.25rem; --ph: min(calc(100svh - 8rem), calc((100vw - 9rem) * 0.75), 62rem); --pw: calc(var(--ph) * 2 / 3); }
.bokvy:fullscreen { display: flex; flex-direction: column; justify-content: center; --ph: min(calc(100vh - 5rem), calc((100vw - 9rem) * 0.75)); }
.bokram { display: flex; align-items: center; justify-content: center; gap: clamp(0.5rem, 1.5vw, 1.5rem); }
.spar { width: calc(var(--pw) * 2); overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; box-shadow: 0 30px 60px -30px rgba(0,0,0,.8); outline-offset: 6px; }
.spar::-webkit-scrollbar { display: none; }
.sidor { list-style: none; margin: 0; padding: 0; display: flex; }
.sida { position: relative; flex: 0 0 var(--pw); height: var(--ph); background: #fff; }
.sida:nth-child(odd) { scroll-snap-align: start; scroll-snap-stop: always; }
.sida img { width: 100%; height: 100%; object-fit: contain; }
.sida::after { content: ""; position: absolute; top: 0; bottom: 0; width: 9%; pointer-events: none; }
.sida:nth-child(odd)::after { right: 0; background: linear-gradient(to left, rgba(0,0,0,.13), rgba(0,0,0,.03) 40%, transparent); }
.sida:nth-child(even)::after { left: 0; background: linear-gradient(to right, rgba(0,0,0,.16), rgba(0,0,0,.04) 40%, transparent); }
.sida.tom { background: transparent; }
.sida.tom::after { display: none; }
.slutsida { display: flex; align-items: center; justify-content: center; text-align: center; color: var(--sot); }
.slutsida > div { padding: 12%; }
.slutsida h2 { margin: 0 0 1rem; font-family: var(--signum); font-weight: 400; font-size: clamp(1.3rem, 2.2vw, 1.8rem); letter-spacing: 0.04em; }
.slutsida p { margin: 0 0 1.4rem; font-size: 1.05rem; }
.slut-orn { color: var(--betong); font-size: 0.9rem; }
.bok-om { background: none; border: 0; padding: 0; cursor: pointer; color: var(--betong); text-decoration: underline; }
.blad { flex: none; width: 3rem; height: 3rem; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgba(255,255,255,.25); background: transparent; color: var(--sno); cursor: pointer; }
.blad:hover:not(:disabled) { background: rgba(255,255,255,.08); }
.blad:disabled { opacity: .25; cursor: default; }
.blad.fram svg { transform: scaleX(-1); }
.bokinfo { display: flex; justify-content: center; align-items: center; gap: 0.6rem 1.75rem; flex-wrap: wrap; margin-top: 1.1rem; font-family: var(--sans); font-size: 0.88rem; }
.raknare { color: var(--sno); font-variant-numeric: tabular-nums; }
.tips { color: #8c9490; }
.helskarm { font: inherit; color: var(--sno); background: none; border: 0; text-decoration: underline; text-underline-offset: 0.2em; cursor: pointer; padding: 0; }
@media (max-width: 899px) {
  .bokvy { --pw: min(calc(100vw - 2rem), calc((100svh - 9rem) * 2 / 3)); --ph: calc(var(--pw) * 1.5); }
  .sida.tom { display: none; }
  .sida, .sida:nth-child(odd) { scroll-snap-align: center; }
  .sida::after { display: none; }
  .spar { width: var(--pw); box-shadow: 0 20px 40px -24px rgba(0,0,0,.8); }
  .blad { display: none; }
  .tips { display: none; }
}

.textvy { padding: clamp(1.5rem, 5vw, 4rem) 0 clamp(3rem, 8vw, 6rem); }
.lasframsteg { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 20; pointer-events: none; }
.lasframsteg span { display: block; height: 100%; background: var(--sot); transform: scaleX(0); transform-origin: 0 50%; }
.papper { max-width: 47rem; margin: 0 auto; background: #fbfbf9; padding: clamp(2rem, 6vw, 5.5rem) clamp(1.5rem, 7vw, 5.75rem); box-shadow: 0 1px 2px rgba(23,25,27,.06), 0 24px 60px -30px rgba(23,25,27,.35); font-size: clamp(1.12rem, 0.98rem + 0.4vw, 1.27rem); line-height: 1.7; hyphens: auto; -webkit-hyphens: auto; font-variant-numeric: oldstyle-nums; }
.papper p { margin: 0; text-indent: 1.5em; }
.papper h2 { margin: 2.6em 0 1.6em; text-align: center; font-family: var(--serif); font-weight: 400; font-size: 2.4em; line-height: 1; font-variant-numeric: lining-nums; }
.papper h2:first-child { margin-top: 0.4em; }
.papper h2 + p, .papper .scen + p { text-indent: 0; }
.papper h2 + p::first-line { font-variant: small-caps; letter-spacing: 0.04em; }
.papper hr.scen { border: 0; margin: 1.5em 0; height: auto; text-align: center; }
.papper hr.scen::after { content: "◆ ◆ ◆"; display: block; font-size: 0.62em; letter-spacing: 0.9em; padding-left: 0.9em; color: var(--betong); }
.textvy .slut { max-width: 47rem; margin: 3rem auto 0; padding: 0 var(--kant); text-align: center; }
.textvy .slut h2 { margin: 0 0 0.6rem; font-family: var(--signum); font-weight: 400; font-size: 1.6rem; letter-spacing: 0.04em; }
.textvy .slut p { margin: 0 0 1.5rem; color: var(--betong); }
.textvy .slut .knappar { justify-content: center; }
@media (max-width: 600px) {
  .papper { box-shadow: none; padding: 1.75rem 1.25rem 2.5rem; }
  .textvy { padding-top: 0; }
}
.start .boktitel.stor { font-size: clamp(2.3rem, 4.4vw, 3.5rem); line-height: 1.08; margin-top: 0.4rem; }

/* Navigering: fast sidhuvud */
.huvud { position: sticky; top: 0; z-index: 30; background: var(--sno); border-bottom: 1px solid var(--aska); padding: 1rem 0; transition: box-shadow 0.2s ease; }
.huvud.skuggad { box-shadow: 0 6px 18px -12px rgba(23, 25, 27, 0.35); }
.lasframsteg { z-index: 40; }


/* Bokkort: tydligt klickbara */
.bok .omslag img { transition: transform 0.2s ease, box-shadow 0.2s ease; }
.bok:hover .omslag img { transform: translateY(-5px); }
.bok h3 a::after { content: " →"; opacity: 0; transition: opacity 0.2s; }
.bok:hover h3 a::after { opacity: 1; }

/* Boksidan: egen scen i omslagets färg */
.bokscen { background: var(--bokfarg, var(--natt)); color: #eef0ee; padding-bottom: clamp(3rem, 6vw, 5rem); }
.scen-topp { display: flex; align-items: center; justify-content: space-between; gap: 1rem 2rem; flex-wrap: wrap; padding-top: clamp(1.25rem, 3vw, 2rem); padding-bottom: clamp(1.75rem, 4vw, 3rem); }
.bakat { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.55rem 1.05rem 0.55rem 0.8rem; border: 1px solid rgba(255, 255, 255, 0.4); border-radius: 999px; font-family: var(--sans); font-weight: 600; font-size: 0.95rem; color: #fff; text-decoration: none; background: rgba(255, 255, 255, 0.06); transition: background 0.15s, border-color 0.15s; }
.bakat:hover { background: rgba(255, 255, 255, 0.16); border-color: rgba(255, 255, 255, 0.7); }
.brodsmulor { display: flex; flex-wrap: wrap; gap: 0.5rem; font-family: var(--sans); font-size: 0.86rem; color: rgba(238, 240, 238, 0.7); }
.brodsmulor a { color: inherit; }
.brodsmulor [aria-current] { color: #fff; }
.bokscen .bok-topp { padding-bottom: 0; }
.bokscen .serie, .bokscen .fakta, .bokscen .titelnot { color: rgba(238, 240, 238, 0.72); }
.bokscen .credit { color: rgba(238, 240, 238, 0.88); }
.bokscen .pris { border-bottom-color: rgba(255, 255, 255, 0.6); }
.bokscen .knapp { background: #f5f6f4; color: var(--sot); }
.bokscen .knapp:hover { background: #fff; }
.bokscen .lank { color: #fff; }
.bokscen .bok-omslag img { box-shadow: 0 30px 60px -25px rgba(0, 0, 0, 0.75); }
.boksida .utgavor { border-top: 0; }
@media (max-width: 760px) {
  .brodsmulor { display: none; }
  .bokscen .bok-omslag { margin: 0 auto; }
}
html[lang="en"] .citat { font-size: clamp(2.1rem, 4vw, 3.4rem); }
@media (max-width: 760px) {
  html { scroll-padding-top: 6.5rem; }
  .namn { font-size: 1.1rem; }
  .meny { font-size: 0.9rem; gap: 0 1.1rem; }
  /* Tryckytor minst 44 px höga på mobil (menyn och sidfoten). */
  .huvud { padding: 0.55rem 0 0; }
  .huvud .ram { row-gap: 0; }
  .meny a { display: inline-block; padding: 0.7rem 0; }
  .meny .sprak { padding: 0.7rem 0 0.7rem 1.1rem; }
  .fotlankar { gap: 0 1.4rem; }
  .fotlankar a { display: inline-block; padding: 0.65rem 0; }
}
/* Minskad rörelse (inställning i telefonen/datorn): inga animationer eller övergångar alls. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* Samma berättelse, flera titlar */
.aven { margin: 0.75rem 0 0; font-size: 1.02rem; line-height: 1.5; color: rgba(238, 240, 238, 0.86); max-width: 34rem; }
.omslag-text { margin: 1rem 0 0; font-size: 1rem; line-height: 1.35; }
.omslag-text span { display: block; font-family: var(--sans); font-size: 0.84rem; color: rgba(238, 240, 238, 0.7); margin-top: 0.15rem; }
.galleri { margin-top: 1.1rem; }
.galleri-rubrik { margin: 0 0 0.5rem; font-family: var(--sans); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(238, 240, 238, 0.7); }
.galleri ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: flex-end; }
.galleri button { display: block; padding: 3px; border: 1px solid transparent; border-radius: 2px; background: none; cursor: pointer; opacity: 0.7; transition: opacity .15s, border-color .15s; }
.galleri button:hover { opacity: 1; }
.galleri button[aria-pressed="true"] { opacity: 1; border-color: rgba(255, 255, 255, 0.85); }
.galleri img { display: block; width: auto; height: 4.6rem; }

.verkgrupp { display: grid; grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); gap: 1.5rem 3rem; padding: 2.25rem 0; border-top: 1px solid var(--aska); }
.verkgrupp:first-of-type { border-top: 0; padding-top: 0.5rem; }
.verk-huvud { display: flex; flex-direction: column; gap: 0.9rem; }
.verk-omslag { width: 7rem; }
.verk-omslag img { box-shadow: 0 10px 22px -12px rgba(23,25,27,.55); }
.verk-huvud p { margin: 0; font-size: 1.15rem; line-height: 1.35; }
.verk-huvud a { text-decoration: none; }
.verk-huvud p a:hover i { text-decoration: underline; }
.sprak-bocker a { grid-template-columns: 4.2rem minmax(0, 1fr); grid-template-rows: auto auto 1fr; }
.sprak-bocker .omslag { grid-row: 1 / 4; }
.sprak-bocker .omslag.tomt { display: grid; place-items: center; aspect-ratio: 1; background: transparent; border: 1px solid var(--aska); font-family: var(--sans); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.08em; color: var(--betong); }
.sb-sprak { font-family: var(--sans); font-size: 0.74rem; font-weight: 600; letter-spacing: 0.09em; text-transform: uppercase; color: var(--betong); }
.sb-titel { padding-top: 0.15rem; font-size: 1.08rem; }
@media (max-width: 760px) {
  .verkgrupp { grid-template-columns: 1fr; }
  .verk-huvud { flex-direction: row; align-items: center; }
  .verk-omslag { width: 4.5rem; flex: none; }
  .galleri img { height: 3.8rem; }
}

/* ---------- Texter (artiklar, tal, dikt) ---------- */
.bio-lankar { display: flex; flex-wrap: wrap; gap: 0.6rem 1.8rem; }
.las-ocksa { margin: 0.4rem 0 0; font-family: var(--sans); font-size: 0.95rem; color: var(--betong); }
.bokscen .las-ocksa { color: rgba(238, 240, 238, 0.8); }
.bokscen .las-ocksa a { color: #fff; }
.text-intro { margin: -1.2rem 0 2.5rem; font-size: 1.2rem; line-height: 1.55; max-width: 34em; }
.textlista { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(23,25,27,.14); }
.textlista li { border-bottom: 1px solid rgba(23,25,27,.14); }
.textlista a { display: grid; gap: 0.2rem; padding: 1.4rem 0; text-decoration: none; color: inherit; }
.textlista time, .artikel-topp time { font-family: var(--sans); font-size: 0.82rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--betong); }
.text-titel { font-size: 1.5rem; line-height: 1.25; font-weight: 500; }
.textlista a:hover .text-titel { text-decoration: underline; text-underline-offset: 0.15em; text-decoration-thickness: 1px; }
.text-ingress { color: var(--betong); }
.artikel-topp { margin-bottom: 2.2rem; }
.artikel-topp time { display: block; margin-bottom: 0.7rem; }
.artikel-topp .sidrubrik { margin: 0; }
.artikel-text { font-size: clamp(1.12rem, 1.02rem + 0.3vw, 1.22rem); line-height: 1.7; hyphens: auto; -webkit-hyphens: auto; }
.artikel-text p { margin: 0 0 1.15em; }
.artikel-bild { margin: 2.2rem 0; }
.artikel-bild img { display: block; width: 100%; height: auto; background: #dfe2df; }
.artikel-bild figcaption { margin-top: 0.6rem; font-family: var(--sans); font-size: 0.85rem; color: var(--betong); }
.dikt .artikel-text .strof { margin: 0 0 1.6em; line-height: 1.75; hyphens: manual; -webkit-hyphens: manual; }
.bokruta { display: grid; grid-template-columns: 7rem 1fr; gap: 1.4rem; align-items: start; margin: 3rem 0 0; padding: 1.6rem; background: var(--sno-ljus); }
.bokruta-omslag img { display: block; width: 100%; height: auto; box-shadow: 0 10px 24px -12px rgba(23,25,27,.5); }
.bokruta p { margin: 0 0 0.6rem; }
.bokruta-etikett { font-family: var(--sans); font-size: 0.78rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--betong); }
.bokruta-titel { font-size: 1.3rem; line-height: 1.25; font-weight: 500; }
.artikel-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin-top: 3rem; padding-top: 1.6rem; border-top: 1px solid rgba(23,25,27,.14); }
.artikel-nav a { text-decoration: none; color: inherit; font-size: 1.1rem; line-height: 1.3; }
.artikel-nav a span { display: block; margin-bottom: 0.3rem; font-family: var(--sans); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--betong); }
.artikel-nav a:hover { text-decoration: underline; text-underline-offset: 0.15em; text-decoration-thickness: 1px; }
.artikel-nav .nyare { text-align: right; }
/* Artiklar i pressen: diskret lista under texterna, och en ruta om originalet på varje artikel. */
.i-pressen { margin-top: 4rem; }
.i-pressen h2 { margin: 0 0 0.4rem; }
.i-pressen > .text-ingress { margin: 0 0 1.6rem; max-width: 34em; }
.presslista a { padding: 1.05rem 0; }
.presslista .text-titel { font-size: 1.2rem; }
.press-meta, .artikel-kalla { display: flex; flex-wrap: wrap; gap: 0 0.6rem; font-family: var(--sans); font-size: 0.82rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--betong); }
.press-tidning::before, .artikel-kalla span::before { content: "·"; margin-right: 0.6rem; }
.press .presslista { margin-top: 1.2rem; max-width: 44rem; }
.artikel-kalla { margin: 0 0 0.7rem; }
.artikel-kalla time { margin: 0; }
.kalla { display: grid; grid-template-columns: 11rem 1fr; gap: 1.4rem; align-items: start; margin: 0 0 2.6rem; padding: 1.3rem; background: var(--sno-ljus); }
.kalla-bild { display: block; }
.kalla-bild img { display: block; width: 100%; height: auto; background: #fff; outline: 1px solid rgba(23,25,27,.14); box-shadow: 0 10px 22px -14px rgba(23,25,27,.55); }
.kalla p { margin: 0 0 0.55rem; font-family: var(--sans); font-size: 0.95rem; line-height: 1.5; }
.kalla p:last-child { margin-bottom: 0; }
.kalla strong { font-weight: 600; }
.pressartikel .artikel-text h2 { font-size: 1.3rem; margin: 2rem 0 0.6rem; }
.pressartikel .artikel-text ul { margin: 0 0 1.15em; padding-left: 1.2em; }
.pressartikel .artikel-text li { margin: 0 0 0.45em; }
.pressartikel .artikel-text blockquote { margin: 0 0 1.15em; padding: 0.2rem 0 0.2rem 1.2rem; border-left: 3px solid rgba(23,25,27,.18); }
.pressartikel .artikel-text blockquote p { margin: 0 0 0.5em; }
.pressartikel .artikel-text blockquote ul { margin-bottom: 0; }
.sammanfattning-etikett { font-family: var(--sans); font-size: 0.78rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--betong); }
@media (max-width: 560px) {
  .kalla { grid-template-columns: 6.5rem 1fr; gap: 1rem; padding: 1.1rem; }
  .bokruta { grid-template-columns: 5rem 1fr; gap: 1rem; padding: 1.2rem; }
  .artikel-nav { grid-template-columns: 1fr; }
  .artikel-nav .nyare { text-align: left; }
}

/* ===== Rörelse =====================================================
   Regler: ändringar sker direkt, animationen är bara pynt ovanpå. Bara
   opacity, transform och färg (aldrig storlek/layout). Inget styrs av
   skroll eller sidbyten. Högst ~0,7 s. Klick tas alltid emot. Allt är av
   för den som valt minskad rörelse. Testas av beteendetest.js. */
@media (prefers-reduced-motion: no-preference) {
  :root { --mjuk: cubic-bezier(0.2, 0.7, 0.2, 1); }

  /* 1. Boksidan: färgen glider när man byter omslag, omslaget tonar in */
  .bokscen { transition: background-color 0.55s ease; }
  .bok-omslag picture.byt img { animation: omslag-byt 0.42s var(--mjuk); }
  .omslag-text.byt { animation: text-byt 0.35s var(--mjuk); }
  .galleri button { transition: opacity .15s, border-color .15s, transform .2s var(--mjuk); }
  .galleri button:hover, .galleri button[aria-pressed="true"] { transform: translateY(-2px); }
  @keyframes omslag-byt { from { opacity: 0.3; transform: scale(0.985); } }
  @keyframes text-byt { from { opacity: 0; transform: translateY(4px); } }

  /* 2. Tryckrespons: knappar ger efter en aning under fingret/musen */
  .knapp, .butik, .bakat, .blad, .vyval button, .formular button { transition: transform 0.12s ease, background 0.15s, border-color 0.15s, color 0.15s; }
  .knapp:active, .butik:active, .bakat:active, .blad:active:not(:disabled), .vyval button:active, .formular button:active:not(:disabled), .galleri button:active { transform: scale(0.97); }
  .bok:active .omslag img { transform: translateY(-2px) scale(0.985); }

  /* 3. Entré: startbilden och boksidans scen lyfts fram när sidan öppnas (en gång, bara CSS) */
  .bok-omslag > picture img { animation: lyft 0.75s var(--mjuk) both; }
  .start .omslag-stor img { animation: tona 0.75s ease both; } /* länk: tonar bara, flyttar sig inte */
  /* Text som innehåller länkar eller knappar flyttar sig aldrig (utan :has-stöd: ingen entré alls). */
  .start .ram > div > :not(:has(a, button)), .bok-text > :not(:has(a, button)) { animation: fram 0.6s var(--mjuk) both; }
  .start .citat p:nth-child(2) { animation: fram 0.6s var(--mjuk) 0.18s both; }
  .start .ram > div > :nth-child(2), .bok-text > :nth-child(2) { animation-delay: 0.08s; }
  .start .ram > div > :nth-child(n+3), .bok-text > :nth-child(n+3) { animation-delay: 0.16s; }
  .omslag-text { animation: fram 0.6s var(--mjuk) 0.25s both; }
  /* Det man kan klicka på står alltid still när sidan öppnas, så att inget klick missar. */
  .start .ram > div > .knappar, .bokscen .bok-text > .knappar { animation: none; }
  @keyframes tona { from { opacity: 0; } }
  @keyframes lyft { from { opacity: 0; transform: translateY(14px) scale(0.99); } }
  @keyframes fram { from { opacity: 0; transform: translateY(8px); } }

  /* 4. Små detaljer */
  .bok h3 a::after { display: inline-block; transition: opacity 0.2s, transform 0.25s var(--mjuk); transform: translateX(-4px); }
  .bok:hover h3 a::after { transform: none; }
  .status.byt { animation: text-byt 0.35s var(--mjuk); }
  .bakat svg { transition: transform 0.2s var(--mjuk); }
  .bakat:hover svg { transform: translateX(-3px); }
}