/* Advesign – långa texter från Ghost på default-k: inlägg (post.hbs), guiden
   (custom-guide.hbs), dokumentsidorna (custom-dokument.hbs, integritetspolicy.hbs,
   sakerhet.hbs), bloggen (blog-k.hbs, tag.hbs, author.hbs) och sidor utan egen
   mall (page.hbs). Bygger på komponentbiblioteket och site.css; här står bara
   det som prototypen inte har (Ghosts kort, guidekartan, sidnumrering …). */

/* ---------- Utan innehållsförteckning: en spalt ---------- */
.adv-art--notoc .k-article__layout { grid-template-columns: minmax(0, 1fr); }
.adv-art--notoc .k-prose { max-width: 72ch; }

/* ---------- Rubrikdelen ---------- */
.adv-meta__avatar { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; }
.adv-posthead .k-lede { max-width: 60ch; }

/* ---------- Ghosts innehåll i K-PROSE ---------- */
.k-prose figure { margin: var(--s-6) 0; }
.k-prose img { max-width: 100%; height: auto; border-radius: var(--radius); }
.k-prose figcaption { margin-top: var(--s-2); font-size: var(--fs-small); color: var(--fg-muted); }
.k-prose blockquote {
  margin: var(--s-6) 0;
  padding: var(--s-1) 0 var(--s-1) var(--s-5);
  border-left: 3px solid var(--c-accent);
  font-size: var(--fs-lede);
  line-height: 1.5;
}
.k-prose blockquote p { margin: 0; }
.k-prose hr { margin: var(--s-8) 0; border: 0; border-top: 1px solid var(--line); }
.k-prose a:not(.k-link):not(.k-btn) { color: var(--c-accent); text-underline-offset: 3px; }
.k-prose code { font-family: var(--font-code); font-size: 0.9em; }
.k-prose .kg-width-wide, .k-prose .kg-width-full { max-width: none; }
.k-prose .adv-table td[style*="right"], .k-prose .adv-table th[style*="right"] { text-align: right; }
.k-prose .adv-table th { text-align: left; }
.k-prose h2:first-child { margin-top: 0; }

/* ---------- Uppmaningen i texten ---------- */
.adv-article-cta__row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3) var(--s-5); margin-top: var(--s-4); }

/* ---------- Källrutan i Byggbranschen i siffror (partials/byggdata-source.hbs) ---------- */
.k-prose .byggdata-source {
  margin-top: var(--s-8);
  padding: var(--s-5);
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background: var(--c-surface);
  font-size: var(--fs-small);
}
.k-prose .byggdata-source > * + * { margin-top: var(--s-2); }
.k-prose .byggdata-source p { margin: 0; max-width: none; }
.byggdata-source-note { color: var(--fg-muted); }
.byggdata-source-links { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); font-weight: 700; }

/* ---------- Kort utan bild ---------- */
.adv-card__blank { display: grid; place-items: center; aspect-ratio: 3 / 2; background: var(--c-surface); color: var(--fg-muted); }
.adv-card__blank .od-icon { --od-icon-size: 40px; }

/* ---------- GUIDE-MAP: guidens tio delar som en sträcka ---------- */
.adv-gmap__list {
  --stop: 40px;
  position: relative;
  display: grid;
  gap: var(--s-2);
  margin: var(--s-6) 0 0;
  padding: 0;
  list-style: none;
}
/* Sträckan: en streckad linje genom stoppens mitt */
.adv-gmap__list::before {
  content: "";
  position: absolute;
  top: calc(var(--stop) / 2);
  bottom: calc(var(--stop) / 2);
  left: calc(var(--stop) / 2 - 1px);
  border-left: 2px dashed var(--c-lilac);
}
.adv-gmap__a {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--s-4);
  min-height: 48px;
  color: var(--fg);
  text-decoration: none;
}
.adv-gmap__n {
  display: grid;
  place-items: center;
  flex: none;
  width: var(--stop);
  height: var(--stop);
  border: 2px solid var(--c-accent);
  border-radius: 50%;
  background: var(--bg);
  font-family: var(--font-display);
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--c-accent);
}
.adv-gmap__t { font-weight: 700; line-height: 1.3; }
@media (hover: hover) { .adv-gmap__a:hover .adv-gmap__t { text-decoration: underline; text-underline-offset: 4px; } }
.adv-gmap__a:focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; border-radius: 6px; }
.adv-gmap__stop.is-current .adv-gmap__n { background: var(--c-accent); color: var(--c-white); }
.adv-gmap__stop.is-current .adv-gmap__t::after { content: " · du är här"; font-weight: 400; color: var(--fg-muted); }

/* Bred skärm: två spalter med stopp, sträckan går ner i vänster och vidare i höger */
@container k (min-width: 900px) {
  .adv-gmap:not(.adv-gmap--mini) .adv-gmap__list { grid-template-columns: 1fr 1fr; grid-auto-flow: column; grid-template-rows: repeat(5, auto); column-gap: var(--s-10); }
  .adv-gmap:not(.adv-gmap--mini) .adv-gmap__list::before { display: none; }
  .adv-gmap:not(.adv-gmap--mini) .adv-gmap__stop { position: relative; }
  .adv-gmap:not(.adv-gmap--mini) .adv-gmap__stop:not(:nth-child(5)):not(:last-child)::after {
    content: "";
    position: absolute;
    top: calc(var(--stop) / 2 + 24px);
    left: calc(var(--stop) / 2 - 1px);
    height: calc(100% - var(--stop) / 2 + var(--s-2) - 4px);
    border-left: 2px dashed var(--c-lilac);
  }
  .adv-gmap--mini .adv-gmap__list { grid-template-columns: repeat(5, minmax(0, 1fr)); row-gap: var(--s-4); }
  .adv-gmap--mini .adv-gmap__list::before { display: none; }
  .adv-gmap--mini .adv-gmap__a { flex-direction: column; align-items: flex-start; gap: var(--s-2); }
  .adv-gmap--mini .adv-gmap__t { font-size: var(--fs-small); }
  .adv-gmap--mini .adv-gmap__stop.is-current .adv-gmap__t::after { content: ""; }
}

/* ---------- Föregående / nästa i guiden ---------- */
.adv-guidenav__pn { display: grid; gap: var(--s-3); margin-top: var(--s-5); }
@container k (min-width: 700px) { .adv-guidenav__pn { grid-template-columns: 1fr 1fr; } }
.adv-guidenav__link {
  display: grid;
  gap: var(--s-1);
  padding: var(--s-4) var(--s-5);
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background: var(--c-white);
  color: var(--fg);
  text-decoration: none;
}
.adv-guidenav__link--next { text-align: right; justify-items: end; }
.adv-guidenav__dir { display: inline-flex; align-items: center; gap: var(--s-2); font-size: var(--fs-eyebrow); font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--eyebrow); }
.adv-guidenav__t { font-family: var(--font-display); font-weight: 700; font-size: 1.0625rem; }
@media (hover: hover) { .adv-guidenav__link:hover { border-color: var(--c-accent); } }
.adv-guidenav__link:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }

/* ---------- Guiden (custom-guide.hbs) ---------- */
/* Tabellerna som "ritning": ram och en titelruta i hörnet som på en bygghandling */
.adv-guidepage .k-prose .adv-table__wrap {
  position: relative;
  padding: var(--s-6) var(--s-4) var(--s-4);
  border: 2px solid var(--c-ink);
  border-radius: 4px;
  background:
    linear-gradient(var(--grid, rgba(91, 61, 184, 0.06)) 1px, transparent 1px) 0 0 / 16px 16px,
    linear-gradient(90deg, var(--grid, rgba(91, 61, 184, 0.06)) 1px, transparent 1px) 0 0 / 16px 16px,
    var(--c-white);
}
.adv-guidepage .k-prose .adv-table__wrap::after {
  content: attr(data-ritning);
  position: absolute;
  top: -2px;
  right: -2px;
  padding: 2px var(--s-2);
  border: 2px solid var(--c-ink);
  background: var(--c-white);
  font-family: var(--font-display);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.adv-guidepage .k-prose .adv-table { background: var(--c-white); }

/* GUIDE-FORECAST: budget mot prognos, ritas in när den syns */
.adv-forecast { margin: var(--s-6) 0; padding: var(--s-5); border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--c-white); }
.adv-forecast__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--s-2); }
.adv-forecast__title { margin: 0; font-family: var(--font-display); font-weight: 700; font-size: 1.0625rem; }
.adv-forecast svg { display: block; width: 100%; height: auto; margin-top: var(--s-3); }
.adv-forecast .fc-grid { stroke: var(--line); stroke-width: 1; }
.adv-forecast .fc-axis { fill: var(--fg-muted); font-size: 11px; font-family: var(--font-body); }
.adv-forecast .fc-budget { fill: none; stroke: var(--c-muted-strong, #6b6680); stroke-width: 2; stroke-dasharray: 6 5; }
.adv-forecast .fc-line { fill: none; stroke: var(--c-neg-on-light, #b4233c); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.adv-forecast .fc-dot { fill: var(--c-neg-on-light, #b4233c); }
.adv-forecast .fc-lab { font-size: 12px; font-weight: 700; font-family: var(--font-body); }
.adv-forecast .fc-lab--budget { fill: var(--fg-muted); }
.adv-forecast .fc-lab--line { fill: var(--c-neg-on-light, #b4233c); }
.adv-forecast__note { margin: var(--s-3) 0 0; font-size: var(--fs-small); color: var(--fg-muted); }
.js .adv-forecast:not(.is-in) .fc-line { stroke-dasharray: 900; stroke-dashoffset: 900; }
.js .adv-forecast:not(.is-in) .fc-dot, .js .adv-forecast:not(.is-in) .fc-lab--line { opacity: 0; }
.adv-forecast.is-in .fc-line { stroke-dasharray: 900; stroke-dashoffset: 0; transition: stroke-dashoffset 1600ms var(--ease-out); }
.adv-forecast.is-in .fc-dot, .adv-forecast.is-in .fc-lab--line { opacity: 1; transition: opacity 300ms var(--ease-out) 1500ms; }
@media (prefers-reduced-motion: reduce) {
  .adv-forecast .fc-line, .adv-forecast .fc-dot, .adv-forecast .fc-lab--line { transition: none !important; stroke-dashoffset: 0 !important; opacity: 1 !important; }
}

/* Excel-mallen */
.adv-template { display: grid; gap: var(--s-5); align-items: center; }
@container k (min-width: 900px) { .adv-template { grid-template-columns: 1.1fr 1fr; gap: var(--s-10); } }
.adv-sheet { border: 1px solid var(--line); border-radius: var(--radius); background: var(--c-white); overflow: hidden; font-size: 0.8125rem; }
.adv-sheet__tabs { display: flex; gap: 2px; padding: var(--s-2) var(--s-2) 0; background: var(--c-surface); border-bottom: 1px solid var(--line); overflow: hidden; }
.adv-sheet__tabs span { padding: var(--s-1) var(--s-3); border: 1px solid var(--line); border-bottom: 0; border-radius: 6px 6px 0 0; background: var(--c-surface); white-space: nowrap; color: var(--fg-muted); }
.adv-sheet__tabs span:first-child { background: var(--c-white); color: var(--fg); font-weight: 700; }
.adv-sheet table { width: 100%; border-collapse: collapse; }
.adv-sheet th, .adv-sheet td { padding: 6px 10px; border-bottom: 1px solid var(--line); text-align: right; white-space: nowrap; }
.adv-sheet th:first-child, .adv-sheet td:first-child { text-align: left; }
.adv-sheet thead th { background: var(--c-surface); font-weight: 700; }
.adv-sheet .is-total td { font-weight: 700; }

/* ---------- Bloggen ---------- */
.adv-filter__search { margin-top: var(--s-4); max-width: 420px; }
.adv-blog-tools { display: grid; gap: var(--s-3); margin-bottom: var(--s-6); }
.js [data-adv-filter-list] .k-card { transition: opacity 220ms var(--ease-out); }
.js [data-adv-filter-list] .k-card.is-fading { opacity: 0; }
@media (prefers-reduced-motion: reduce) { .js [data-adv-filter-list] .k-card { transition: none; } }
.adv-pages { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-3); margin-top: var(--s-8); }
.adv-pages__n { color: var(--fg-muted); font-size: var(--fs-small); }
.adv-news-band .k-news { margin: 0; }

/* ---------- Dokumentsidor ---------- */
.adv-updated { margin-top: var(--s-3); font-size: var(--fs-small); }
.adv-short {
  margin: 0 0 var(--s-6);
  padding: var(--s-5) var(--s-6);
  border: 1px solid var(--line);
  border-left: 4px solid var(--c-lime);
  border-radius: var(--radius-card);
  background: var(--c-surface);
}
.adv-short ul { margin: var(--s-3) 0 0; padding-left: 1.25em; }
.adv-short li + li { margin-top: var(--s-2); }
.adv-todo { background: #fff4c2; color: #4a3b00; padding: 0 4px; border-radius: 4px; }
.adv-posthead .k-tag, .adv-feature__body .k-tag { justify-self: start; align-self: start; width: max-content; }

/* Rubriker som man hoppar till ska hamna under den klistrade sidhuvudet och,
   i mobilen, under innehållsförteckningens rad (js/k-article.js scrollar med
   scrollIntoView, som följer scroll-margin). */
.adv-art .k-prose :is(h2, h3), .adv-art .k-chart { scroll-margin-top: calc(var(--k-sticky-offset, 64px) + 72px); }
@container k (min-width: 1024px) { .adv-art .k-prose :is(h2, h3), .adv-art .k-chart { scroll-margin-top: calc(var(--k-sticky-offset, 72px) + 24px); } }
.adv-template__form { margin: var(--s-4) 0; padding: var(--s-4); border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--c-white); }
.adv-template__form .contact-embed { min-height: 320px; }
.adv-template__form iframe { display: block; width: 100%; border: 0; }

/* Guidens tagg efter "Guide:" (custom-guide.hbs, post.hbs) står med liten bokstav. */
.adv-lc { text-transform: lowercase; }
/* En guide utan publicerade delar visar inte avsnittet om delarna. */
#delarna:not(:has(.adv-gmap__stop)) { display: none; }
.adv-feature + .adv-feature { margin-top: var(--s-6); }