/* Tillägg för aiboxen.spekt.se. stil.css är spekt.se:s gemensamma stil och hålls orörd. */

/* ------- märket: SPEKT-loggan + "AI-boxen" ------- */
.marke .tjanst {
  margin-left: 12px; padding-left: 12px; border-left: 1px solid var(--linje);
  font-family: "Martian Mono", ui-monospace, Menlo, monospace;
  font-size: 0.66rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent-ljus);
  line-height: 26px;
}
nav.lankar { align-items: center; }
nav.lankar a.knapp { color: #14100A; padding: 8px 16px; font-size: 0.85rem; }
nav.lankar a.knapp:hover { color: #14100A; }
@media (max-width: 380px) { .marke .tjanst { display: none; } }

/* ------- de fyra varianterna ------- */
.varianter { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; }
.varianter article {
  display: flex; flex-direction: column; gap: 10px;
  background: var(--yta); border: 1px solid var(--linje); border-radius: 10px; padding: 26px;
}
.varianter .var { margin: 0; font-size: 0.68rem; color: var(--accent-ljus); letter-spacing: 0.06em; text-transform: uppercase; }
.varianter h3 { margin: 0; font-size: 1.15rem; font-weight: 800; }
.varianter p { margin: 0; color: var(--dov); font-size: 0.93rem; }
.varianter ul { list-style: none; padding: 0; margin: 4px 0 0; display: grid; gap: 7px; font-size: 0.9rem; }
.varianter li { padding-left: 20px; position: relative; color: var(--dov); }
.varianter li::before { content: "→"; content: "→" / ""; position: absolute; left: 0; color: var(--accent); }
.fotnot { margin: 22px 0 0; color: var(--dov); font-size: 0.92rem; max-width: 70ch; }

/* ------- punktlistor med pil ------- */
.pilar { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; max-width: 72ch; color: var(--dov); }
.pilar li { padding-left: 22px; position: relative; }
.pilar li::before { content: "→"; content: "→" / ""; position: absolute; left: 0; color: var(--accent); }
.pilar strong { color: var(--text); }

/* ------- vanliga frågor ------- */
.fragor { max-width: 780px; display: grid; gap: 10px; }
.fragor details { background: var(--yta); border: 1px solid var(--linje); border-radius: 10px; }
.fragor summary {
  cursor: pointer; list-style: none; padding: 18px 22px; min-height: 44px;
  font-weight: 700; display: flex; justify-content: space-between; align-items: center; gap: 16px;
}
.fragor summary::-webkit-details-marker { display: none; }
.fragor summary::after { content: "+"; content: "+" / ""; color: var(--accent-ljus); font-weight: 600; font-size: 1.2rem; line-height: 1; }
.fragor details[open] summary::after { content: "–"; content: "–" / ""; }
.fragor summary:focus-visible { outline-offset: -2px; border-radius: 10px; }
.fragor details p { margin: 0; padding: 0 22px 20px; color: var(--dov); }

/* ------- integritetssidan ------- */
.text { max-width: 70ch; }
.text h2 { font-size: 1.3rem; margin: 40px 0 10px; }
.text p, .text li { color: var(--dov); }
.text strong { color: var(--text); }
.text a { color: var(--text); text-underline-offset: 3px; text-decoration-color: var(--accent-djup); }

/* ------- sidfotens partnerrad ------- */
.fot .partner { display: block; margin-top: 6px; }
.fot .partner a { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--accent-djup); }

/* ------- rubriken bryts inte mitt i "AI-agenter" ------- */
.hel { white-space: nowrap; }