/* The website editor's changes: background images, and sizes set for Both, Phone only
   or MacBook only. Written by website/editor, one marked rule per change. Change them
   through the editor, so the version history and Undo keep track.

   Loaded last on every page, and every rule carries :not(#sem-edit), so a change made in
   the editor wins over the page's own stylesheet. Phone only means up to 860px wide and
   MacBook only 861px and up, the breakpoint the site's own stylesheets use most. */

/* style:061c1f laptop */
@media (min-width: 861px) {
  [data-edit="061c1f"]:not(#sem-edit) { height: 401px; min-height: 401px; }
}

/* style:0a19b5 laptop */
@media (min-width: 861px) {
  [data-edit="0a19b5"]:not(#sem-edit) { aspect-ratio: auto; height: 440px; min-height: 440px; }
}

/* style:0ddca6 laptop */
@media (min-width: 861px) {
  [data-edit="0ddca6"]:not(#sem-edit) { max-width: 100%; width: 538px; }
}

/* style:111d36 laptop */
@media (min-width: 861px) {
  [data-edit="111d36"]:not(#sem-edit) { font-size: 3.75rem; }
}

/* style:153966 laptop */
@media (min-width: 861px) {
  [data-edit="153966"]:not(#sem-edit) { max-width: 100%; width: 647px; }
}

/* style:1dcf7f laptop */
@media (min-width: 861px) {
  [data-edit="1dcf7f"]:not(#sem-edit) { height: 440px; max-width: 100%; min-height: 440px; width: 330px; }
}

/* style:1dcf7f phone */
@media (max-width: 860px) {
  [data-edit="1dcf7f"]:not(#sem-edit) { height: 404px; max-width: 100%; min-height: 404px; transform: translate(11px, -19px); width: 323px; }
}

/* style:1fb000 laptop */
@media (min-width: 861px) {
  [data-edit="1fb000"]:not(#sem-edit) { max-width: 100%; width: 704px; }
}

/* style:2bb9f6 laptop */
@media (min-width: 861px) {
  [data-edit="2bb9f6"]:not(#sem-edit) { height: 518px; min-height: 518px; padding-bottom: 58px; padding-top: 58px; }
}

/* style:2ce0f0 laptop */
@media (min-width: 861px) {
  [data-edit="2ce0f0"]:not(#sem-edit) { height: 641px; min-height: 641px; }
}

/* style:2ce0f0 phone */
@media (max-width: 860px) {
  [data-edit="2ce0f0"]:not(#sem-edit) { height: 608px; min-height: 608px; }
}

/* style:321e20 laptop */
@media (min-width: 861px) {
  [data-edit="321e20"]:not(#sem-edit) { height: 440px; max-width: 100%; min-height: 440px; transform: translate(22px, -19px); width: 352px; }
}

/* style:33748c phone */
@media (max-width: 860px) {
  [data-edit="33748c"]:not(#sem-edit) { height: 82px; min-height: 82px; }
}

/* style:3c0d91 laptop */
@media (min-width: 861px) {
  [data-edit="3c0d91"]:not(#sem-edit) { font-size: 3.75rem; }
}

/* style:3eeed8 both */
[data-edit="3eeed8"]:not(#sem-edit) { display: none; }

/* style:4309e7 phone */
@media (max-width: 860px) {
  [data-edit="4309e7"]:not(#sem-edit) { transform: translate(0px, -14px); }
}

/* style:45488b laptop */
@media (min-width: 861px) {
  [data-edit="45488b"]:not(#sem-edit) { font-size: 5.625rem; max-width: 100%; width: 661px; }
}

/* style:45488b phone */
/* Hand-edited 2026-09-16, not through the editor: the home page headline, a step larger
   on a phone. --type-4 to --type-5 is 42px to 52px, one step of the scale in tokens.css
   and the smallest increase that stays on it. The box goes 296px to 336px with it, or the
   larger type would push VARUMÄRKEN MED onto its own line and the headline to four.
   Measured at 360, 390 and 430: three lines at all three, nothing overflowing.
   This is the rule that decides the size. v2.css cannot: it loses to the attribute
   selector here whatever it says. */
@media (max-width: 860px) {
  [data-edit="45488b"]:not(#sem-edit) { font-size: var(--type-5); max-width: 100%; transform: translate(0px, -38px); width: 336px; }
}

/* style:60b58a laptop */
@media (min-width: 861px) {
  [data-edit="60b58a"]:not(#sem-edit) { height: 408px; max-width: 100%; min-height: 408px; width: 339px; }
}

/* style:615629 phone */
@media (max-width: 860px) {
  [data-edit="615629"]:not(#sem-edit) { height: 85px; min-height: 85px; }
}

/* style:645189 laptop */
@media (min-width: 861px) {
  [data-edit="645189"]:not(#sem-edit) { height: 665px; min-height: 665px; }
}

/* style:6b7c45 laptop */
@media (min-width: 861px) {
  [data-edit="6b7c45"]:not(#sem-edit) { height: 401px; max-width: 100%; min-height: 401px; width: 335px; }
}

/* style:6d133e laptop */
@media (min-width: 861px) {
  [data-edit="6d133e"]:not(#sem-edit) { transform: translate(0px, -32px); }
}

/* style:6d133e phone */
@media (max-width: 860px) {
  [data-edit="6d133e"]:not(#sem-edit) { transform: translate(0px, -17px); }
}

/* style:7d74c4 both */
[data-edit="7d74c4"]:not(#sem-edit) { max-width: 100%; }

/* style:7d74c4 laptop */
@media (min-width: 861px) {
  [data-edit="7d74c4"]:not(#sem-edit) { height: 367px; min-height: 367px; width: 330px; }
}

/* style:7d74c4 phone */
@media (max-width: 860px) {
  [data-edit="7d74c4"]:not(#sem-edit) { height: 187px; min-height: 187px; padding-bottom: 10px; padding-top: 10px; }
}

/* style:84d54a laptop */
@media (min-width: 861px) {
  [data-edit="84d54a"]:not(#sem-edit) { height: 632px; min-height: 632px; }
}

/* style:84d54a phone */
@media (max-width: 860px) {
  [data-edit="84d54a"]:not(#sem-edit) { height: 746px; min-height: 746px; }
}

/* style:981988 laptop */
@media (min-width: 861px) {
  [data-edit="981988"]:not(#sem-edit) { height: 406px; max-width: 100%; min-height: 406px; width: 336px; }
}

/* style:a400ba laptop */
@media (min-width: 861px) {
  [data-edit="a400ba"]:not(#sem-edit) { aspect-ratio: auto; height: 437px; max-width: 100%; min-height: 437px; width: 475px; }
}

/* style:a400ba phone */
@media (max-width: 860px) {
  [data-edit="a400ba"]:not(#sem-edit) { aspect-ratio: auto; height: 333px; max-width: 100%; min-height: 333px; width: 345px; }
}

/* style:a4c7de laptop */
@media (min-width: 861px) {
  [data-edit="a4c7de"]:not(#sem-edit) { font-size: var(--type-1); max-width: 100%; width: 542px; }
}

/* style:a4c7de phone */
@media (max-width: 860px) {
  [data-edit="a4c7de"]:not(#sem-edit) { transform: translate(0px, -28px); }
}

/* style:a99447 laptop */
@media (min-width: 861px) {
  [data-edit="a99447"]:not(#sem-edit) { max-width: 100%; width: 539px; }
}

/* style:aa093a laptop */
@media (min-width: 861px) {
  [data-edit="aa093a"]:not(#sem-edit) { transform: translate(63px, 0px); }
}

/* style:bb1d44 laptop */
@media (min-width: 861px) {
  [data-edit="bb1d44"]:not(#sem-edit) { height: 460px; max-width: 100%; min-height: 460px; transform: translate(-46px, -32px); width: 433px; }
}

/* style:bfa870 laptop */
@media (min-width: 861px) {
  [data-edit="bfa870"]:not(#sem-edit) { max-width: 100%; transform: translate(67px, -4px); width: 686px; }
}

/* style:c36023 phone */
@media (max-width: 860px) {
  [data-edit="c36023"]:not(#sem-edit) { height: 86px; min-height: 86px; }
}

/* style:ca5f69 phone */
@media (max-width: 860px) {
  [data-edit="ca5f69"]:not(#sem-edit) { transform: translate(0px, -13px); }
}

/* style:ca6454 both */
[data-edit="ca6454"]:not(#sem-edit) { max-width: 100%; }

/* style:ca6454 laptop */
@media (min-width: 861px) {
  [data-edit="ca6454"]:not(#sem-edit) { height: 377px; min-height: 377px; width: 335px; }
}

/* style:ca6454 phone */
@media (max-width: 860px) {
  [data-edit="ca6454"]:not(#sem-edit) { height: 193px; min-height: 193px; padding-bottom: 13px; padding-top: 13px; }
}

/* style:d37f35 laptop */
@media (min-width: 861px) {
  [data-edit="d37f35"]:not(#sem-edit) { max-width: 100%; width: 562px; }
}

/* style:d44c92 laptop */
@media (min-width: 861px) {
  [data-edit="d44c92"]:not(#sem-edit) { height: 191px; min-height: 191px; }
}

/* style:d44c92 phone */
@media (max-width: 860px) {
  [data-edit="d44c92"]:not(#sem-edit) { height: 110px; min-height: 110px; }
}

/* style:dade73 phone — removed 2026-09-16. It pinned the fourth process card to 211px on a
   phone, which made it the short one back when the other three came out at 231. The cards
   are 194px now, so the same pin was making it the tall one instead. Unpinned it measures
   194 with 192 of content, so it matches the other three and nothing is clipped. Left out
   rather than set to 194: a number here does not follow the copy, and this is the card
   whose caption runs to three lines. */

/* style:e41f46 laptop */
@media (min-width: 861px) {
  [data-edit="e41f46"]:not(#sem-edit) { font-size: 3.75rem; }
}

/* style:e8dcf9 both */
[data-edit="e8dcf9"]:not(#sem-edit) { max-width: 100%; }

/* style:e8dcf9 laptop */
@media (min-width: 861px) {
  [data-edit="e8dcf9"]:not(#sem-edit) { height: 373px; min-height: 373px; width: 364px; }
}

/* style:e8dcf9 phone */
@media (max-width: 860px) {
  [data-edit="e8dcf9"]:not(#sem-edit) { height: 209px; min-height: 209px; padding-bottom: 13px; padding-top: 13px; }
}

/* style:edf5e9 laptop */
@media (min-width: 861px) {
  [data-edit="edf5e9"]:not(#sem-edit) { height: 544px; min-height: 544px; padding-bottom: 52px; padding-top: 52px; }
}

/* style:f98a4a laptop */
@media (min-width: 861px) {
  [data-edit="f98a4a"]:not(#sem-edit) { font-size: var(--type-1); max-width: 100%; width: 648px; }
}

/* style:fcd3de laptop */
@media (min-width: 861px) {
  [data-edit="fcd3de"]:not(#sem-edit) { font-size: 3.75rem; }
}

/* style:fcd3de phone */
@media (max-width: 860px) {
  [data-edit="fcd3de"]:not(#sem-edit) { font-size: var(--type-2); }
}