/* Forklaringssiden: Fremtidsavisens avisstil (papir, Playfair Display og Source Serif 4) */
:root{
  --papir:#efe8d8;--papir-lys:#f6f1e5;--blæk:#1d1b16;--blæk-blød:#4f4a40;--accent:#8a5a1f;--streg:#cdc4b2;--bord:#b9ad97;
  --display:'Playfair Display',Georgia,serif;--krop:'Source Serif 4',Georgia,serif;
  --korn:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .28 0 0 0 0 .22 0 0 0 0 .14 0 0 0 .2 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  --fibre:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='420' height='420'><filter id='f'><feTurbulence type='fractalNoise' baseFrequency='.0190476 .1595238' numOctaves='3' seed='4' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .32 0 0 0 0 .25 0 0 0 0 .16 0 0 0 .09 0'/></filter><rect width='100%' height='100%' filter='url(%23f)'/></svg>");
  --skyer:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='700' height='700'><filter id='s'><feTurbulence type='fractalNoise' baseFrequency='.0042857' numOctaves='3' seed='9' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .55 0 0 0 0 .44 0 0 0 0 .28 0 0 0 .24 0'/></filter><rect width='100%' height='100%' filter='url(%23s)'/></svg>");
}
*{box-sizing:border-box}
html,body{margin:0;background-color:var(--bord);background-image:var(--korn);background-size:220px 220px}
body{font:18px/1.6 var(--krop);color:var(--blæk);-webkit-font-smoothing:antialiased;text-wrap:pretty}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{text-wrap:balance}

/* Avisarket */
.ark{position:relative;z-index:2;margin:8px 14px 14px 8px;min-height:calc(100vh - 22px);background-color:var(--papir);background-image:linear-gradient(to right,rgb(60 45 22/.3) 0,rgb(60 45 22/.16) 1px,rgb(60 45 22/.08) 3px,rgb(60 45 22/.035) 7px,transparent 18px),var(--korn),var(--fibre),var(--skyer);background-size:18px 100%,220px 220px,420px 420px,700px 700px;background-repeat:no-repeat,repeat,repeat,repeat;box-shadow:inset 0 0 0 1px rgb(110 88 55/.16),2px 2px 0 -1px #e7dfcc,2px 2px 0 0 rgb(95 74 42/.26),4px 4px 0 -1px #e2d9c5,4px 4px 0 0 rgb(95 74 42/.22),6px 6px 0 -1px #dcd2bd,6px 6px 0 0 rgb(95 74 42/.18),0 10px 24px -10px rgb(55 38 14/.45)}
.ark-in{max-width:1180px;margin:0 auto;padding:30px 40px 40px}

/* Avishovedet */
.hoved{border-bottom:3px double var(--blæk);padding-bottom:10px;margin-bottom:34px;text-align:center}
.hoved-linje{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px;letter-spacing:1.4px;text-transform:uppercase;color:var(--blæk-blød);border-bottom:1px solid var(--blæk);padding-bottom:8px}
.hoved-linje.under{border-bottom:0;border-top:1px solid var(--blæk);padding:8px 0 0;margin-top:6px}
.navn{margin:10px 0 4px;font:800 clamp(36px,10.5vw,112px)/1 var(--display);letter-spacing:-.01em}

/* Forsiden */
.forside{display:grid;gap:18px;padding-bottom:34px;border-bottom:1px solid var(--blæk);margin-bottom:34px}
.rubrik-over{margin:0;font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--accent);font-weight:600}
.forside h1{margin:0;font:700 clamp(36px,5vw,66px)/1.06 var(--display);max-width:22ch}
.manchet{margin:0;font-size:21px;line-height:1.55;max-width:62ch;color:var(--blæk)}
.forside-knap{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:6px}
.forside-knap span{color:var(--blæk-blød);font-size:15px}
.kn-stor{font:600 15px var(--krop);letter-spacing:1.6px;text-transform:uppercase;padding:18px 30px;border:0;background:var(--blæk);color:var(--papir-lys);cursor:pointer;transition:background .2s,transform .2s;white-space:nowrap}
.kn-stor:hover{background:var(--accent);transform:translateY(-1px)}

/* Spalter som i en avis */
.spalter{display:grid;gap:0;border-bottom:1px solid var(--blæk);padding-bottom:34px;margin-bottom:40px}
.spalter.tre{grid-template-columns:repeat(3,minmax(0,1fr))}
.spalter article{padding:0 26px}
.spalter article:first-child{padding-left:0}
.spalter article:last-child{padding-right:0}
.spalter article+article{border-left:1px solid var(--streg)}
.spalter h2{margin:0 0 12px;font:700 26px/1.15 var(--display)}
.spalter p{margin:0 0 12px}
.liste{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.liste li{position:relative;padding-left:20px}
.liste li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;background:var(--accent);transform:rotate(45deg)}

/* Sektioner */
.sektion{padding-bottom:44px;margin-bottom:44px;border-bottom:1px solid var(--blæk)}
.stor{margin:6px 0 18px;font:700 clamp(32px,4vw,50px)/1.08 var(--display)}
.intro{margin:0 0 24px;max-width:70ch;font-size:19px}
.intro.lille{font-size:16px;color:var(--blæk-blød);margin:24px 0 0}

.ret-gitter{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.ret{margin:0;display:grid;gap:12px;align-content:start}
.ret-bil{position:relative;aspect-ratio:4/3;background:var(--papir-lys);border:1px solid var(--streg);overflow:hidden;display:grid;place-items:center}
.ret-bil img{width:100%;height:100%;object-fit:cover;object-position:0 100%}
.ret-bil .mangler{color:var(--blæk-blød);font-size:14px;padding:20px;text-align:center}
.ret-bil.tal{align-content:center;justify-items:center;gap:4px;text-align:center;padding:20px}
.ret-bil.tal b{font:800 92px/1 var(--display);color:var(--accent)}
.ret-bil.tal span{color:var(--blæk-blød);font-size:15px}
.ret figcaption{font-size:16.5px;line-height:1.55}
.ret figcaption b{display:block;font:700 21px/1.2 var(--display);margin-bottom:6px}

.udkast-to{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px}
.udkast{display:grid;gap:12px;align-content:start}
.udkast-bil{display:block;aspect-ratio:16/10;overflow:hidden;border:1px solid var(--streg);background:var(--papir-lys);box-shadow:0 14px 30px -14px rgb(55 38 14/.45)}
.udkast-bil img{width:100%;height:100%;object-fit:cover;object-position:50% 0}
.udkast-over{margin:8px 0 0;font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--accent);font-weight:600}
.udkast h3,.pris h3{margin:0;font:700 32px/1.1 var(--display)}
.udkast-lead{margin:0;font-size:18px}
.udkast-not{margin:4px 0 0;font-size:15.5px;color:var(--blæk-blød);border-top:1px solid var(--streg);padding-top:12px}

.tabel-ramme{overflow-x:auto;margin-bottom:24px}
.tabel{width:100%;border-collapse:collapse;font-size:17px;min-width:560px}
.tabel th,.tabel td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--streg);vertical-align:top}
.tabel thead th{font:700 20px var(--display);border-bottom:2px solid var(--blæk)}
.tabel tbody th{font-weight:600;color:var(--blæk-blød);width:30%}

.priser{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.pris{background:var(--papir-lys);border:1px solid var(--streg);padding:30px 30px 26px;display:grid;gap:10px;align-content:start;box-shadow:0 14px 30px -18px rgb(55 38 14/.5)}
.belob{margin:6px 0 0;font:800 clamp(48px,5vw,64px)/1 var(--display)}
.belob-tx{margin:0 0 8px;color:var(--blæk-blød)}
.holder{margin-top:12px;border-top:1px solid var(--streg);padding-top:14px;display:grid;gap:4px}
.holder b{font:700 19px var(--display)}
.holder span{color:var(--blæk-blød);font-size:16.5px}

.trin{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;counter-reset:trin}
.trin li{counter-increment:trin;display:grid;gap:6px;align-content:start;border-top:2px solid var(--blæk);padding-top:14px}
.trin li::before{content:counter(trin);font:800 46px/1 var(--display);color:var(--accent)}
.trin b{font:700 21px/1.2 var(--display)}
.trin span{font-size:16.5px;color:var(--blæk-blød)}

.slut{text-align:center;display:grid;justify-items:center;gap:12px;padding:20px 0 40px}
.slut h2{margin:0;font:700 clamp(32px,4vw,48px)/1.1 var(--display)}
.slut p{margin:0}
.kontakt{color:var(--blæk-blød);font-size:16px;margin-top:10px!important}
.fod{border-top:3px double var(--blæk);padding-top:12px;text-align:center;font-size:13px;letter-spacing:1px;color:var(--blæk-blød)}

/* Bag siden: valget mellem de to udkast */
.bag{position:fixed;inset:0;z-index:1;overflow:auto;background-color:var(--papir);background-image:var(--korn),var(--fibre),var(--skyer);background-size:220px 220px,420px 420px,700px 700px;visibility:hidden}
.bag.vis{visibility:visible}
.bag-in{max-width:1100px;margin:0 auto;padding:60px 40px;display:grid;gap:6px}
.valg{margin-top:10px}
.valg-k{display:grid;gap:10px;text-decoration:none;color:inherit}
.valg-k b{font:700 32px/1.1 var(--display)}
.valg-se{font-size:14px;letter-spacing:1.6px;text-transform:uppercase;border-bottom:1px solid var(--blæk);justify-self:start;padding-bottom:2px}
.valg-k:hover .udkast-bil{transform:translateY(-3px)}
.valg-k .udkast-bil{transition:transform .3s ease}
.tilbage{justify-self:start;margin-top:30px;background:none;border:0;border-bottom:1px solid var(--blæk-blød);padding:0 0 2px;font:16px var(--krop);color:var(--blæk-blød);cursor:pointer}
/* Flappen: papirets bagside, mens siden vendes */
.flap{position:fixed;inset:0;z-index:3;pointer-events:none;display:none;filter:drop-shadow(-8px -4px 12px rgb(35 24 8/.35))}
.flap i{position:absolute;inset:0;background-color:#e6dcc6;background-image:linear-gradient(225deg,rgb(255 255 255/.35),rgb(0 0 0/.08)),var(--korn);background-size:100% 100%,220px 220px}
body.vender{overflow:hidden}

@media(max-width:900px){
  .ark{margin:3px 5px 6px 3px}
  .ark-in{padding:18px 18px 30px}
  .hoved-linje{justify-content:center;font-size:11.5px;letter-spacing:1px;gap:4px 14px}
  .spalter.tre,.ret-gitter,.udkast-to,.priser{grid-template-columns:minmax(0,1fr)}
  .spalter article{padding:0!important;border-left:0!important}
  .spalter article+article{border-top:1px solid var(--streg);padding-top:22px!important;margin-top:22px}
  .trin{grid-template-columns:repeat(2,minmax(0,1fr))}
  .manchet{font-size:19px}
  .bag-in{padding:40px 18px}
}
@media(max-width:520px){
  body{font-size:17px}
  .trin{grid-template-columns:minmax(0,1fr)}
  .kn-stor{padding:16px 22px;letter-spacing:1.2px;font-size:14px}
  .pris{padding:24px 20px 20px}
}
@media(prefers-reduced-motion:reduce){.kn-stor,.valg-k .udkast-bil{transition:none}}
.ret-bil.hvid{background:#fff}
.ret-bil.hvid img{object-fit:contain;object-position:50% 50%;padding:14px}

/* Forsiden: overskriften til venstre og et forsidefoto til højre, så der ikke står et tomt felt */
.forside{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:44px;align-items:center}
.forside-tx{display:grid;gap:18px}
.forside-foto{margin:0;display:grid;gap:8px}
.forside-foto img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:50% 0;border:1px solid var(--streg);box-shadow:0 14px 30px -14px rgb(55 38 14/.45)}
.forside-foto figcaption{font-size:14px;color:var(--blæk-blød);border-bottom:1px solid var(--streg);padding-bottom:8px}
@media(max-width:900px){.forside{grid-template-columns:minmax(0,1fr);gap:26px}}
.ret-bil.mork{background:#242526}
.ret-bil.mork img{object-fit:contain;object-position:50% 50%}
.ret-bil.mork img{object-fit:cover;object-position:0 0}
/* Avisens navn er nu en længere tekst: mindre skrift, så den altid står på én linje */
.navn{font-size:clamp(26px,6.4vw,84px);white-space:nowrap}
@media(max-width:600px){.navn{white-space:normal;font-size:clamp(30px,10vw,52px);line-height:1.04;text-wrap:balance}}
