*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }

:root{
  --paper:#12171A;        
  --panel:#181E21;        
  --deep:#0C1013;         
  --ink:#E9E5DB;          
  --dim:#96A0A0;          
  --faint:#5F6B6C;
  --acc:#C98A3C;          
  --acc2:#7FA08A;         
  --line:rgba(233,229,219,.16);
  --hair:rgba(233,229,219,.09);
  --measure:70ch;
}

html{ background:var(--paper); }
body{
  background:var(--paper) !important;
  color:var(--ink);
  font-family:'Newsreader',Georgia,'Times New Roman',serif;
  font-size:17px; line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; height:auto; }
a{ color:var(--ink); }
a:hover{ color:var(--acc); }

h1,h2,h3,h4,h5,h6{
  font-family:'Bodoni Moda','Newsreader',Georgia,serif;
  color:var(--ink); font-weight:500; letter-spacing:0;
  text-transform:none !important;   
}

.vm-mitt{ max-width:1180px; padding:0 28px; }
.vm-omslag{
  background:transparent !important; box-shadow:none !important;
  border:0 !important; padding:0 !important; margin:0 !important;
}
.vm-kropp{ background:transparent !important; padding:0 !important; }
.vm-spalter{ display:block !important; background:transparent !important; box-shadow:none !important; }
.vm-spalter .vm-rail,
aside.vm-rail{ display:none !important; }   

.vm-list{ background:var(--deep) !important; border-bottom:1px solid var(--hair); }
.vm-list-rad{ min-height:34px; }
.vm-list-v a,.vm-list-h a{
  color:var(--faint) !important; font-size:12.5px; letter-spacing:.06em;
  text-transform:lowercase; font-variant:small-caps;
}
.vm-list-v a:hover,.vm-list-h a:hover{ color:var(--acc) !important; }

.vm-panna{
  background:var(--deep) !important; background-image:none !important;
  border-bottom:1px solid var(--line); padding:0; min-height:0; height:auto;
}
.vm-panna-yta{ padding:0 !important; background:transparent !important; }
.vm-head{ padding:54px 0 34px; text-align:left; }
.vm-head .vm-rule{
  height:1px; background:linear-gradient(90deg,var(--acc) 0%,rgba(201,138,60,.15) 62%,transparent 100%);
  margin-bottom:26px;
}
.vm-wordmark{
  display:block; font-family:'Bodoni Moda',Georgia,serif; font-weight:500;
  font-size:clamp(2.5rem,6.4vw,4.5rem); line-height:1.02; letter-spacing:-.012em;
  color:var(--ink); text-decoration:none;
}
.vm-wordmark em{ font-style:italic; color:var(--acc); }
.vm-standfirst{
  margin-top:16px; max-width:62ch; color:var(--dim);
  font-size:1.02rem; line-height:1.6;
}
.vm-orter{
  margin-top:18px; color:var(--faint); font-size:.8rem; letter-spacing:.15em;
  text-transform:uppercase; font-family:'Newsreader',Georgia,serif;
}

.vm-lots{
  background:transparent !important; border-top:1px solid var(--line);
  border-bottom:1px solid var(--line); margin:0 0 42px; padding:0;
  display:flex; align-items:center; justify-content:space-between; gap:18px;
}
.vm-meny{ display:flex; flex-wrap:wrap; gap:0; }
.vm-meny li{ border-right:1px solid var(--hair); }
.vm-meny li:last-child{ border-right:0; }
.vm-meny li a{
  display:block; padding:15px 20px; color:var(--dim) !important;
  font-family:'Newsreader',Georgia,serif; font-size:.84rem;
  letter-spacing:.17em; text-transform:uppercase !important; background:none !important;
}
.vm-meny li a:hover{ color:var(--acc) !important; background:rgba(201,138,60,.06) !important; }
.vm-meny li.vm-nu a{ color:var(--ink) !important; box-shadow:inset 0 -2px 0 var(--acc); }
.vm-meny li:first-child a{ border:0 !important; }
.vm-sokruta input{
  background:transparent !important; border:0 !important;
  border-bottom:1px solid var(--line) !important; border-radius:0 !important;
  color:var(--ink) !important; font-family:'Newsreader',Georgia,serif;
  font-size:.9rem; padding:5px 2px; width:112px;
}
.vm-sokruta input::placeholder{ color:var(--faint) !important; }
.vm-sokruta:focus-within input,.vm-sokruta:hover input{ width:158px; border-bottom-color:var(--acc) !important; }
.vm-sokruta{ display:flex; align-items:center; gap:10px; flex:0 0 auto; }
.vm-sokruta button{ color:var(--faint) !important; background:none !important; }
.vm-sokruta button:hover{ color:var(--acc) !important; }
.vm-lucka span{ background:var(--ink); }

.vm-lead{ margin:0 0 58px; }
.vm-lead-plate{
  position:relative; display:block; overflow:hidden;
  border:1px solid var(--line); background:var(--panel);
}
.vm-lead-plate img{ display:block; width:100%; height:clamp(210px,29vw,380px); object-fit:cover; }
.vm-lead-body{ margin-top:26px; padding-left:26px; border-left:2px solid var(--acc); }
.vm-lead h2{ font-size:clamp(1.9rem,3.9vw,3rem); line-height:1.12; margin:0 0 14px; }
.vm-lead h2 a{ text-decoration:none; }
.vm-lead .vm-standtext{ font-size:1.12rem; color:#CFCBC1; max-width:60ch; margin:0; }

.vm-sect{
  display:flex; align-items:center; gap:22px; margin:64px 0 32px;
}
.vm-sect::before,.vm-sect::after{ content:''; flex:1; height:1px; background:var(--line); }
.vm-sect span{
  font-family:'Bodoni Moda',Georgia,serif; font-size:.92rem;
  letter-spacing:.28em; text-transform:uppercase; color:var(--acc);
  white-space:nowrap;
}
.vm-sect a{ text-decoration:none; }

.vm-reg{ border-top:1px solid var(--line); }
/* Raderna hade tidigare en sifferkolumn 01, 02, 03. Grannsajten hjartland.se
   numrerar sina rader pa samma satt, och tva grannar med samma grepp laser
   som en och samma redaktion. Har star i stallet ett smalt massingsstreck
   i vanstermarginalen — samma funktion, egen form. */
.vm-row{
  position:relative;
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:0 28px; padding:26px 0 26px 26px; border-bottom:1px solid var(--hair);
  border-left:2px solid transparent; transition:border-color .18s ease, background .18s ease;
}
.vm-row:hover{ border-left-color:var(--acc); }
.vm-row:hover{ background:rgba(201,138,60,.04); }
.vm-row::before{
  content:''; position:absolute; left:0; top:26px; bottom:26px; width:2px;
  background:var(--hair);
}
.vm-title{ margin:0; font-size:1.42rem; line-height:1.26; }
.vm-title a{ text-decoration:none; }
.vm-meta{
  margin-top:9px; color:var(--faint); font-size:.8rem;
  letter-spacing:.13em; text-transform:uppercase;
}
.vm-lede{ margin:0; color:var(--dim); font-size:.99rem; line-height:1.66; padding-top:3px; }

.vm-kommuner{
  margin:56px 0 0; padding:34px 0 8px; border-top:1px solid var(--line);
}
.vm-kommuner ul{
  list-style:none; margin:22px 0 0; padding:0;
  columns:4; column-gap:34px;
}
.vm-kommuner li{ break-inside:avoid; padding:7px 0; border-bottom:1px solid var(--hair); }
.vm-kommuner a{ text-decoration:none; color:var(--dim); font-size:.98rem; }
.vm-kommuner a:hover{ color:var(--acc); }
.vm-kommuner .vm-kn{ color:var(--faint); font-size:.78rem; letter-spacing:.1em; margin-left:8px; }

.vm-shelf{ margin:52px 0 0; border-top:1px solid var(--line); }
.vm-shelf-row{
  display:grid; grid-template-columns:minmax(0,240px) minmax(0,1fr) auto;
  gap:10px 26px; align-items:baseline; padding:20px 0;
  border-bottom:1px solid var(--hair); text-decoration:none;
}
.vm-shelf-row:hover{ background:rgba(127,160,138,.05); }
.vm-shelf-name{ font-family:'Bodoni Moda',Georgia,serif; font-size:1.16rem; color:var(--ink); }
.vm-shelf-text{ color:var(--dim); font-size:.96rem; }
.vm-shelf-go{ color:var(--acc2); font-size:.8rem; letter-spacing:.14em; text-transform:uppercase; white-space:nowrap; }

.vm-facts{ margin:52px 0 0; border-top:1px solid var(--line); padding-top:30px; }
.vm-facts dl{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; margin:20px 0 0; }
.vm-facts dt{ color:var(--faint); font-size:.75rem; letter-spacing:.16em; text-transform:uppercase; }
.vm-facts dd{ margin:8px 0 0; font-family:'Bodoni Moda',Georgia,serif; font-size:1.6rem; color:var(--ink); }
.vm-facts dd small{ display:block; font-family:'Newsreader',serif; font-size:.86rem; color:var(--dim); letter-spacing:0; margin-top:4px; }

.vm-artikel{ max-width:var(--measure); margin:0 auto; }
.vm-artikel > img{ border-radius:0 !important; border:1px solid var(--line); margin-bottom:30px !important; }
.vm-artikel h1{
  font-size:clamp(2rem,4.4vw,3.1rem); line-height:1.13; margin:0 0 18px;
  letter-spacing:-.01em;
}
.vm-brodbyline{
  color:var(--faint) !important; font-size:.79rem; letter-spacing:.15em;
  text-transform:uppercase; border-bottom:1px solid var(--line);
  padding-bottom:16px; margin-bottom:30px;
}
.vm-brodbyline a{ color:var(--acc) !important; text-decoration:none; }
.vm-brod{ font-size:1.09rem; line-height:1.82; color:#DDD9CF; }
.vm-brod > p:first-of-type{ font-size:1.2rem; color:var(--ink); }
.vm-brod > p:first-of-type::first-letter{
  float:left; font-family:'Bodoni Moda',Georgia,serif; font-size:4.1rem;
  line-height:.86; padding:6px 12px 0 0; color:var(--acc);
}
.vm-brod h2,.vm-brod h3{ margin:2em 0 .6em; font-size:1.5rem; }
.vm-brod h3{ font-size:1.24rem; }
.vm-brod a{ color:var(--acc2); text-decoration:underline; text-underline-offset:3px; }
.vm-brod blockquote{
  margin:1.8em 0; padding:2px 0 2px 24px; border-left:2px solid var(--acc);
  font-style:italic; color:var(--ink);
}
.vm-brod img{ border:1px solid var(--line); }
.vm-brod ul,.vm-brod ol{ padding-left:1.3em; }
.vm-brod li{ margin-bottom:.5em; }

.vm-betyg{
  max-width:var(--measure); margin:44px auto 0 !important; padding:22px 0 !important;
  background:transparent !important; border:0 !important;
  border-top:1px solid var(--line) !important; border-bottom:1px solid var(--line) !important;
  text-align:left !important;
}
.vm-betyg-rubrik{ color:var(--faint) !important; font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; }
.vm-stjarna{ color:var(--faint) !important; }
.vm-stjarna:hover,.vm-stjarna.hover,.vm-stjarna.voted{ color:var(--acc) !important; }
.vm-betyg-info,.vm-betyg-nu{ color:var(--dim) !important; font-size:.9rem; }

.vm-lista{ display:block; max-width:none; margin:0; border:0; padding:0; }
.vm-post{
  display:grid; grid-template-columns:84px minmax(0,1.05fr) minmax(0,.95fr);
  gap:0 28px; background:none !important; border:0 !important;
  border-bottom:1px solid var(--hair) !important; padding:26px 0 !important; margin:0 !important;
  border-radius:0 !important; box-shadow:none !important;
}
.vm-post::before{ display:none !important; }
.vm-post-bild{ display:none !important; }   
.vm-post-text{ grid-column:2/4; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:0 28px; }
.vm-post h3{ margin:0; font-size:1.42rem; line-height:1.26; }
.vm-post h3 a{ text-decoration:none; }
.vm-post .vm-byline{
  display:block; margin-top:9px; color:var(--faint) !important;
  font-size:.8rem; letter-spacing:.13em; text-transform:uppercase;
}
.vm-post .vm-ingress{ color:var(--dim) !important; font-size:.99rem; margin:0; }
.vm-avdelare{ display:none !important; }
.vm-avdtopp{
  display:flex; align-items:center; gap:22px; margin:0 0 30px;
  border:0 !important; background:none !important; padding:0 !important;
}
.vm-avdtopp::after{ content:''; flex:1; height:1px; background:var(--line); }
.vm-avdtopp h3{
  font-size:1rem; letter-spacing:.26em; text-transform:uppercase !important;
  color:var(--acc); margin:0; white-space:nowrap;
}
.vm-avdtopp .view-all{ color:var(--dim); font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; order:3; }

.vm-vidare{ display:none !important; }

.vm-kort,.cat-row .vm-kort{ background:none !important; border:0 !important; box-shadow:none !important; }
.vm-kort .vm-mini,.vm-lastmini,.toppnyhet-img,.footer-rec-thumb{ display:none !important; }

.vm-ruta{ background:transparent !important; border:0 !important; border-top:1px solid var(--line) !important; margin-bottom:30px; }
.vm-ruta-topp{
  background:transparent !important; color:var(--acc) !important;
  font-family:'Bodoni Moda',Georgia,serif; font-size:.86rem; letter-spacing:.24em;
  text-transform:uppercase; padding:14px 0 !important; border:0 !important;
}
.vm-ruta-kropp{ background:transparent !important; padding:0 0 8px !important; color:var(--dim); }
.vm-ruta-kropp a{ color:var(--ink); text-decoration:none; }
.vm-ruta-kropp a:hover{ color:var(--acc); }
.vm-ruta-kropp ul li{ border-bottom:1px solid var(--hair); padding:8px 0; }
.vm-last h4,.toppnyhet-text h4{ font-size:1rem; }
.vm-last h4 a{ color:var(--ink) !important; }
.event-item{ border-bottom:1px solid var(--hair); padding:12px 0; }
.event-date{ color:var(--acc) !important; font-size:.76rem; letter-spacing:.14em; text-transform:uppercase; }

.vm-blad a,.vm-blad span{
  background:transparent !important; border:1px solid var(--line) !important;
  color:var(--dim) !important; border-radius:0 !important;
}
.vm-blad .vm-nu span,.vm-blad a:hover{ background:var(--acc) !important; color:var(--deep) !important; border-color:var(--acc) !important; }

.vm-kolofon{
  background:var(--deep) !important; color:var(--dim) !important;
  border-top:1px solid var(--line); margin-top:76px; padding:56px 0 0 !important;
}
.vm-kolofon-rad{ display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:44px; }
.vm-kolofon h4{
  color:var(--acc) !important; font-size:.8rem; letter-spacing:.22em;
  text-transform:uppercase; margin-bottom:16px;
}
.vm-kolofon p,.vm-kolofon li,.vm-kolofon a{ color:var(--dim) !important; font-size:.94rem; }
.vm-kolofon a:hover{ color:var(--acc) !important; }
.vm-kolofon ul li{ padding:6px 0; border-bottom:1px solid var(--hair); list-style:none; }
.vm-kolofon-slut{
  border-top:1px solid var(--hair) !important; margin-top:44px; padding:22px 0 !important;
  color:var(--faint) !important; font-size:.84rem;
}
.vm-kolofon-slut p{ color:var(--faint) !important; }

.ds-partners{ border-top:1px solid var(--hair) !important; }
.ds-partners a{
  border:1px solid var(--line) !important; border-radius:0 !important;
  background:var(--panel); color:var(--ink) !important;
}
.ds-partners a:hover{ border-color:var(--acc) !important; }

/* cookie */
.vm-kakor{ background:var(--deep) !important; border-top:1px solid var(--acc) !important; color:var(--dim) !important; }
.vm-kakor p,.vm-kakor a{ color:var(--dim) !important; }
.vm-ja{ background:var(--acc) !important; color:var(--deep) !important; border-radius:0 !important; }
.vm-nej{ background:transparent !important; color:var(--dim) !important; border:1px solid var(--line) !important; border-radius:0 !important; }

input[type=text],input[type=email],textarea,select{
  background:var(--panel) !important; color:var(--ink) !important;
  border:1px solid var(--line) !important; border-radius:0 !important;
  font-family:'Newsreader',Georgia,serif !important;
}
button[type=submit],.btn{
  background:var(--acc) !important; color:var(--deep) !important;
  border:0 !important; border-radius:0 !important;
  letter-spacing:.14em; text-transform:uppercase; font-size:.82rem; padding:13px 26px !important;
}

@media (max-width:980px){
  .vm-kommuner ul{ columns:2; }
  .vm-facts dl{ grid-template-columns:repeat(2,1fr); }
  .vm-kolofon-rad{ grid-template-columns:1fr 1fr; }
}
@media (max-width:760px){
  body{ font-size:16px; }
  .vm-mitt{ padding:0 18px; }
  .vm-lots{ flex-direction:column; align-items:stretch; }
  .vm-meny{ flex-direction:column; }
  .vm-meny li{ border-right:0; border-bottom:1px solid var(--hair); }
  .vm-meny li a{ padding:13px 0; }
  .vm-sokruta{ padding:12px 0; }
  .vm-sokruta input,.vm-sokruta:focus-within input{ width:100%; }
  .vm-head{ padding:34px 0 26px; }
  .vm-lead-body{ padding-left:16px; }
  .vm-row{ grid-template-columns:1fr; gap:0; padding:22px 0 22px 16px; }
  .vm-lede{ margin-top:12px; }
  .vm-kommuner ul{ columns:1; }
  .vm-facts dl{ grid-template-columns:1fr; gap:20px; }
  .vm-shelf-row{ grid-template-columns:1fr; gap:6px; }
  .vm-post-text{ grid-template-columns:1fr; }
  .vm-post .vm-ingress{ margin-top:12px; }
  .vm-kolofon-rad{ grid-template-columns:1fr; gap:30px; }
  .vm-brod > p:first-of-type::first-letter{ font-size:3.2rem; }
}

/* ==========================================================================
   Egna ben — allt som app.css tidigare gjorde.
   Sajten laddar inte längre nätets gemensamma app.css. Filen ligger orörd
   kvar på servern, den länkas bara inte in. Det som behövdes därifrån står
   här nedan, skrivet för den här sajten och med sajtens egna klassnamn.
   ========================================================================== */

a{ text-decoration:none; }        /* app.css satte detta; brodtexten far sina
                                     understrykningar av .vm-brod a langre upp */
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
input,select,textarea{ font:inherit; color:inherit; }
ul,ol{ list-style:none; }
table{ border-collapse:collapse; }

/* men brödtext ska ha punkter kvar */
.vm-brod ul,.vm-artikel ul{ list-style:disc; margin:0 0 18px 22px; }
.vm-brod ol,.vm-artikel ol{ list-style:decimal; margin:0 0 18px 22px; }
.vm-brod li,.vm-artikel li{ margin:0 0 8px; }

.vm-mitt{ margin:0 auto; }

/* hoppa till innehållet */
.vm-hoppa{ position:absolute; left:-9999px; }
.vm-hoppa:focus{
  left:10px; top:10px; z-index:99; background:var(--acc); color:var(--deep);
  padding:9px 15px; text-decoration:none; font-family:'Newsreader',Georgia,serif;
}

/* dolt för ögat, kvar för sökmotorn */
.vm-dold{
  position:absolute; width:1px; height:1px; overflow:hidden;
  clip-path:inset(50%); white-space:nowrap;
}

/* översta remsan */
.vm-list-rad{ display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.vm-list-v{ display:flex; gap:22px; flex-wrap:wrap; }
.vm-list-h{ color:var(--faint); font-size:12.5px; letter-spacing:.06em; font-variant:small-caps; }

/* luckan — bara på smal skärm */
.vm-lucka{ display:none; flex-direction:column; gap:5px; padding:14px 0; }
.vm-lucka span{ display:block; width:22px; height:2px; }

/* kakremsan */
.vm-kakor{ position:fixed; left:0; right:0; bottom:0; z-index:60; }
.vm-kakor[hidden]{ display:none !important; }
.vm-kakor-rad{
  max-width:1180px; margin:0 auto; padding:15px 28px;
  display:flex; align-items:center; gap:20px; flex-wrap:wrap;
}
.vm-kakor p{ flex:1 1 340px; font-size:.92rem; margin:0; }
.vm-kakor-knappar{ display:flex; gap:8px; }
.vm-ja,.vm-nej{ padding:11px 20px; font-family:'Newsreader',Georgia,serif; font-size:.88rem; letter-spacing:.06em; }

/* kolofonen */
.vm-kolofon-del h4{ margin:0 0 14px; }
.vm-kolofon-del p{ margin:0 0 12px; }

/* bladräkning */
.vm-blad{ display:flex; flex-wrap:wrap; gap:6px; margin-top:36px; }
.vm-blad .vm-prickar,.vm-blad .vm-av{ opacity:.45; }

/* ämnessidan */
.vm-amnessida{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:14px; }
.vm-amneskort{
  display:block; background:var(--paper); border:1px solid var(--line);
  padding:26px 24px; text-decoration:none;
}
.vm-amneskort:hover{ background:var(--panel); }
.vm-amne-namn{
  display:block; font-family:'Bodoni Moda',Georgia,serif; font-size:1.24rem;
  color:var(--ink); margin-bottom:6px;
}
.vm-amneskort:hover .vm-amne-namn{ color:var(--acc); }
.vm-amne-antal{ display:block; color:var(--faint); font-size:.84rem; letter-spacing:.14em; text-transform:uppercase; }
.vm-amne-etikett{
  display:inline-block; color:var(--acc); font-size:.78rem;
  letter-spacing:.18em; text-transform:uppercase; margin-bottom:8px;
}

/* träfflistan */
.vm-rutnat{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:14px; }
.vm-rutnat .vm-kort{ background:var(--paper); border:1px solid var(--line); }
.vm-kortkropp{ padding:22px 22px 24px; }
.vm-kortkropp h3{ font-size:1.15rem; line-height:1.24; margin:0 0 8px; }
.vm-kortkropp h3 a{ text-decoration:none; }

/* galleriet */
.vm-galleri{ display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:10px; }
.vm-galleribild{ display:block; border:1px solid var(--line); }
.vm-galleribild img{ display:block; width:100%; height:150px; object-fit:cover; }

/* betyget */
.vm-betyg-falt{ display:flex; flex-direction:row-reverse; justify-content:flex-end; gap:4px; }
.vm-betyg-svar{ margin-top:8px; font-size:.9rem; color:var(--acc); }

/* Sokknappen ska vara en ikon, inte en massiv platta. Regeln
   button[type=submit] langre upp ar lika specifik och star senare, darfor
   behovs klassen med i valjaren har. */
.vm-sokruta button[type=submit]{
  background:none !important; color:var(--faint) !important;
  padding:5px 4px !important; letter-spacing:.16em; text-transform:uppercase;
  font-family:'Newsreader',Georgia,serif; font-size:.78rem;
  border-bottom:1px solid transparent !important;
}
.vm-sokruta button[type=submit]:hover{ color:var(--acc) !important; }

@media(max-width:760px){
  .vm-lucka{ display:flex; align-self:flex-start; }
  .vm-meny{ display:none; }
  .vm-lots.vm-oppen .vm-meny{ display:flex; }
  .vm-kakor-rad{ padding:14px 18px; }
}
@media(max-width:430px){
  .vm-sect{ gap:12px; }
  .vm-sect span{ white-space:normal; letter-spacing:.16em; }

  .vm-list-v{ gap:14px; font-size:12px; }
  .vm-galleri{ grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); }
}