/* 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.16em; 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: transform 0.32s ease, box-shadow 0.2s ease; }
.huvud.skuggad { box-shadow: 0 6px 18px -12px rgba(23, 25, 27, 0.35); }
.lasframsteg { z-index: 40; }

/* Sidbyten: omslaget följer med in i boken */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: 0.3s; }
::view-transition-group(bokomslag) { animation-duration: 0.45s; animation-timing-function: cubic-bezier(.25, .8, .25, 1); }
@media (prefers-reduced-motion: reduce) { @view-transition { navigation: none; } }

/* 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: 1rem; overflow-anchor: none; }
  .huvud { padding: 0.7rem 0; }
  .huvud .ram { row-gap: 0.35rem; }
  .namn { font-size: 1.1rem; }
  .meny { font-size: 0.9rem; gap: 0.3rem 1.1rem; }
  .huvud.dold { transform: translateY(-100%); box-shadow: none; }
}
@media (prefers-reduced-motion: reduce) { .huvud { transition: none; } }
