@import url('https://fonts.googleapis.com/css2?family=Familjen+Grotesk:ital,wght@0,400..700;1,400..700&family=Source+Serif+4:ital,opsz,wght@0,8..60,400..600;1,8..60,400&display=swap');
/*!
Theme Name: Kadence Child
Theme URI: https://www.kadencewp.com/kadence-theme/
Template: kadence
Author: Kadence WP
Author URI: https://www.kadencewp.com/
Description: A child theme for the Kadence Theme.
Version: 1.0.0
License: GNU General Public License v3.0 (or later)
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: kadence-child
*/

/* ==========================================================================
   Supernyttigt designsystem, version 2
   Familjen Grotesk (rubriker och etiketter) + Source Serif 4 (brodtext).
   Mossgron ersatter limegront. Guld anvands bara till betyg.
   Rulla tillbaka genom att tomma filen.
   ========================================================================== */

:root{
  --sn-ink:#16211C;
  --sn-ink-2:#39443F;
  --sn-ink-3:#4B5651;
  --sn-paper:#FBFAF6;
  --sn-surface:#FFFFFF;
  --sn-moss:#20604A;
  --sn-moss-deep:#14432F;
  --sn-moss-soft:#EDF2EE;
  --sn-stone:#E2DED3;
  --sn-sun:#8F6314;
  --sn-measure:43rem;
  --sn-shell:1132px;
  --sn-label:0.75rem;
  --sn-sans:"Familjen Grotesk","Helvetica Neue",Helvetica,Arial,sans-serif;
  --sn-serif:"Source Serif 4",Georgia,"Times New Roman",serif;
  --sn-ease:cubic-bezier(.22,.61,.36,1);
}

/* Kadences palett skrivs om sa att alla block foljer med.
   Palett 8 satts till samma kram som sidbotten, annars syns en soem
   dar de nya sektionerna moter de gamla Kadence-raderna. */
:root{
  --global-palette1:#20604A;
  --global-palette2:#2F7D5E;
  --global-palette3:#16211C;
  --global-palette4:#39443F;
  --global-palette5:#4B5651;
  --global-palette6:#6D7873;
  --global-palette7:#E2DED3;
  --global-palette8:#FBFAF6;
  --global-palette9:#FFFFFF;
  --global-body-font-family:var(--sn-serif);
  --global-heading-font-family:var(--sn-sans);
  --global-content-width:var(--sn-shell);
  --global-content-narrow-width:760px;
}

/* ------------------------------------------------------------- Bas ----- */

body{
  background:var(--sn-paper);
  font-family:var(--sn-serif);
  font-size:1.105rem;
  line-height:1.72;
  color:var(--sn-ink-2);
  -webkit-font-smoothing:antialiased;
}

.content-bg,
body.content-style-boxed .content-bg{ background:var(--sn-surface); }

h1,h2,h3,h4,h5,h6,.entry-title,.site-title{
  font-family:var(--sn-sans);
  color:var(--sn-ink);
  font-weight:700;
  letter-spacing:-0.022em;
  line-height:1.1;
  text-wrap:balance;
}

h1{ font-size:clamp(2.1rem,1.35rem + 2.6vw,3.4rem); }
h2{ font-size:clamp(1.55rem,1.15rem + 1.5vw,2.15rem); letter-spacing:-0.018em; }
h3{ font-size:clamp(1.2rem,1.05rem + .6vw,1.45rem); letter-spacing:-0.012em; }
h4{ font-size:1.125rem; letter-spacing:-0.008em; }

p,li{ text-wrap:pretty; }

/* En enda etikettstil pa hela sajten. Tidigare fanns sex olika
   monospace-storlekar, och systemets monospace blir Consolas i Windows
   dar Bing-trafiken kommer ifran. */
.sn-eyebrow,
.sn-verdict-cat,
.sn-verdict-score span,
.sn-section-label,
.entry-meta,
.entry-taxonomies .category-style-pill a,
.site-bottom-footer-inner-wrap{
  font-family:var(--sn-sans);
  font-size:var(--sn-label);
  font-weight:600;
  line-height:1.4;
  letter-spacing:.085em;
  text-transform:uppercase;
}

a{ color:var(--sn-moss); text-underline-offset:.18em; text-decoration-thickness:.06em; }
a:hover{ color:var(--sn-moss-deep); }

/* Brodtextlankarna var WordPress standardbla mot en mossgron palett. */
.entry-content.single-content > p a, .entry-content.single-content > ul a, .entry-content.single-content > ol a{
  color:var(--sn-moss-deep);
  text-decoration:underline;
  text-decoration-color:var(--sn-sun);
  text-underline-offset:3px;
}
.entry-content.single-content > p a:hover{ text-decoration-color:var(--sn-moss); }

body.hide-focus-outline :is(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:2px solid var(--sn-moss);
  outline-offset:3px;
  border-radius:2px;
}

::selection{ background:var(--sn-moss); color:#fff; }

/* -------------------------------------------------------- Lasbredd ----- */

.entry-content.single-content > p,
.entry-content.single-content > ul,
.entry-content.single-content > ol,
.entry-content.single-content > h2,
.entry-content.single-content > h3,
.entry-content.single-content > h4,
.entry-content.single-content > blockquote,
.entry-content.single-content > hr,
.entry-content.single-content > .wp-block-heading,
.entry-content.single-content > .wp-block-buttons,
.entry-content.single-content > .wp-block-kadence-advancedbtn,
.entry-content.single-content > .nichetable_wrap,
.entry-content.single-content > figure.wp-block-image:not(.alignwide):not(.alignfull){
  max-width:var(--sn-measure);
  margin-inline:auto;
}

.entry-content.single-content > h2{ margin-top:2.5em; margin-bottom:.55em; }
.entry-content.single-content > h3{ margin-top:1.9em; margin-bottom:.45em; }
.entry-content.single-content > p{ margin-bottom:1.15em; }

.entry-content.single-content > h2::before{
  content:"";
  display:block;
  width:2.25rem;
  height:2px;
  background:var(--sn-moss);
  margin-bottom:.85rem;
}

/* Flytande bilder drog ihop textspalten till ca 440 px. */
.entry-content figure.alignright{
  max-width:220px;
  margin:.35rem 0 1rem 1.5rem;
}
.entry-content figure.alignleft{
  max-width:220px;
  margin:.35rem 1.5rem 1rem 0;
}

.entry-content ul,
.entry-content ol{ padding-left:1.15em; }
.entry-content li{ margin-bottom:.4em; }
.entry-content li::marker{ color:var(--sn-moss); }

/* -------------------------------------------------------- Sidhuvud ----- */

.site-header-wrap,
#masthead{
  background:var(--sn-paper);
  border-bottom:1px solid var(--sn-stone);
}
.site-header-row-container-inner{ background:transparent; }

.header-navigation .header-menu-container>ul>li>a{
  font-family:var(--sn-sans);
  font-weight:600;
  font-size:.815rem;
  letter-spacing:.085em;
  text-transform:uppercase;
  color:var(--sn-ink);
  padding-inline:.95rem;
  transition:color .18s var(--sn-ease);
}
.header-navigation .header-menu-container>ul>li>a:hover{ color:var(--sn-moss); }

.header-navigation .header-menu-container > ul > li::before,
.header-navigation .header-menu-container > ul > li::after,
.header-navigation ul li.menu-item>a::after{ display:none !important; }

.header-navigation .header-menu-container ul ul.sub-menu{
  border:1px solid var(--sn-stone);
  box-shadow:0 12px 32px -12px rgba(22,33,28,.22);
  border-radius:3px;
}

/* -------------------------------------------------- Artikelns topp ----- */

.entry-hero-container-inner{
  background:var(--sn-paper);
  border-bottom:1px solid var(--sn-stone);
}
.entry-hero-container-inner .entry-header{ padding-block:clamp(2rem,1rem + 4vw,3.5rem); }
.entry-hero h1,.page-title h1{ color:var(--sn-ink); }

h1.wp-block-kadence-advancedheading,
h2.wp-block-kadence-advancedheading{ background-color:transparent !important; }

.kt-row-layout-inner.kt-row-has-bg:has(h1.wp-block-kadence-advancedheading){ position:relative; }
.kt-row-layout-inner.kt-row-has-bg:has(h1.wp-block-kadence-advancedheading)::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(18,28,23,.18) 0%,rgba(18,28,23,.66) 100%);
  pointer-events:none;
  z-index:0;
}
.kt-row-layout-inner.kt-row-has-bg:has(h1.wp-block-kadence-advancedheading) > *{
  position:relative;
  z-index:1;
}
.kt-row-has-bg h1.wp-block-kadence-advancedheading{
  text-shadow:0 1px 28px rgba(0,0,0,.42);
  letter-spacing:-0.028em;
}

.entry-meta{ color:var(--sn-ink-3); }
.entry-taxonomies .category-style-pill a{
  background:var(--sn-moss-soft);
  color:var(--sn-moss-deep);
  border-radius:2px;
}
.entry-taxonomies a[href*="uncategorized"]{ display:none; }

/* --------------------------------------------------------- Tabeller ---- */

.entry-content table:not([class*="nichetable"]){
  width:100%;
  border-collapse:collapse;
  font-family:var(--sn-sans);
  font-size:.94rem;
  background:var(--sn-surface);
  border:1px solid var(--sn-stone);
}
.entry-content .wp-block-table{ overflow-x:auto; }
.entry-content table:not([class*="nichetable"]) th{
  background:var(--sn-moss);
  color:#fff;
  font-weight:600;
  letter-spacing:.05em;
  text-transform:uppercase;
  font-size:.76rem;
  text-align:left;
  padding:.8rem .9rem;
  border:0;
}
.entry-content table:not([class*="nichetable"]) td{
  padding:.78rem .9rem;
  border:0;
  border-top:1px solid var(--sn-stone);
  color:var(--sn-ink-2);
}

/* ------------------------------------------- NicheTable, pengarutan ---- */
/* Jamforelsetabellen ar sajtens mest vardefulla komponent och bar
   fortfarande det gamla varumarket: rod knapp och limegront marke.
   link_scatter gav dessutom raderna olika bredd, vilket ser ut som ett fel. */

#nichetablewpwp,
.nichetable_wrap{ font-family:var(--sn-sans); }

#nichetablewpwp .nichetable__tr,
.nichetable_wrap .nichetable__tr{
  width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
  background:var(--sn-surface);
  border:1px solid var(--sn-stone);
  border-radius:6px;
  margin-bottom:.85rem;
}

#nichetablewpwp .mcontent__link,
.nichetable_wrap .mcontent__link,
#nichetablewpwp a[class*="__link"]{
  background:var(--sn-moss) !important;
  border-color:var(--sn-moss) !important;
  color:#fff !important;
  border-radius:4px !important;
  font-weight:600;
  letter-spacing:.02em;
  text-transform:none;
  transition:background-color .18s var(--sn-ease), transform .16s var(--sn-ease);
}
#nichetablewpwp .mcontent__link:hover,
.nichetable_wrap .mcontent__link:hover{ background:var(--sn-moss-deep) !important; }
#nichetablewpwp .mcontent__link:active{ transform:scale(.978); }

#nichetablewpwp .bcontent__label,
.nichetable_wrap .bcontent__label{
  background:var(--sn-moss-deep) !important;
  color:#fff !important;
  font-family:var(--sn-sans);
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  border-radius:3px;
}

/* ---------------------------------------------------------- Knappar ---- */

.wp-block-button__link,
.kb-button,
.button,
input[type="submit"]{
  font-family:var(--sn-sans);
  font-weight:600;
  letter-spacing:.02em;
  border-radius:4px;
  transition:transform .16s var(--sn-ease), background-color .18s var(--sn-ease), box-shadow .18s var(--sn-ease);
}
.wp-block-button__link:hover,
.kb-button:hover,
.button:hover{ box-shadow:0 8px 20px -10px rgba(20,67,47,.55); }
.wp-block-button__link:active,
.kb-button:active,
.button:active{ transform:scale(.978); }

/* ------------------------------------------------------ Inläggskort ---- */

.entry.loop-entry,
.kt-blocks-post-grid-item-inner-wrap{
  background:var(--sn-surface);
  border:1px solid var(--sn-stone);
  border-radius:5px;
  box-shadow:none;
  overflow:hidden;
  height:100%;
  transition:border-color .2s var(--sn-ease), transform .2s var(--sn-ease);
}
.entry.loop-entry:hover,
.kt-blocks-post-grid-item-inner-wrap:hover{
  border-color:var(--sn-moss);
  transform:translateY(-2px);
}

.kt-blocks-post-grid-item-inner,
.kt-blocks-post-grid-item-inner header,
.kt-blocks-post-grid-item-inner .entry-title,
.kt-blocks-post-grid-item-inner .entry-title a,
.loop-entry .entry-content-wrap{ text-align:left !important; }

.kt-blocks-post-grid-item-inner{ padding:1rem 1.15rem 1.35rem; }
.kt-blocks-post-grid-item-inner header{ border:0 !important; padding:0 !important; }

.entry.loop-entry .entry-title,
.kt-blocks-post-grid-item-inner .entry-title{
  font-size:1.02rem;
  line-height:1.3;
  letter-spacing:-0.014em;
  margin:0;
}
.kt-blocks-post-grid-item-inner .entry-title a{ color:var(--sn-ink); text-decoration:none; }
.kt-blocks-post-grid-item-inner-wrap:hover .entry-title a{ color:var(--sn-moss-deep); }

.loop-entry .entry-meta{ color:var(--sn-ink-3); }

/* ----------------------------------------------------------- Sidfot ---- */

.site-footer{
  background:var(--sn-ink);
  color:#C9D2CD;
  font-family:var(--sn-sans);
}
.site-footer a{ color:#C9D2CD; text-decoration:none; }
.site-footer a:hover{ color:#fff; text-decoration:underline; }
.site-top-footer-wrap,
.site-middle-footer-wrap{ border-bottom:1px solid rgba(255,255,255,.09); }
.site-bottom-footer-inner-wrap{ color:#9DAAA4; }

/* ====================================================== STARTSIDAN ===== */

.sn-band{ padding-inline:1.5rem; }
.sn-inner{ max-width:var(--sn-shell); margin-inline:auto; }

/* Hjalten: rubrik till vanster, svaren till hoger, samtidigt i bild.
   Tidigare stod rubriken ensam i vanstra tredjedelen med 47 % tom yta,
   och listan borjade forst under vecket. */
.sn-hero{ background:var(--sn-paper); padding-block:clamp(2.5rem,1.5rem + 3vw,4rem) clamp(3rem,2rem + 3vw,4.5rem); }

.sn-hero .sn-inner{
  display:grid;
  grid-template-columns:5fr 7fr;
  column-gap:clamp(2rem,1rem + 4vw,4rem);
  align-items:start;
}
.sn-hero .sn-eyebrow,
.sn-hero h1,
.sn-hero .sn-lede{ grid-column:1; }
.sn-hero .sn-verdicts{ grid-column:2; grid-row:1 / span 3; margin-top:0; }

.sn-eyebrow{ color:var(--sn-moss); margin:0 0 1rem; }

.sn-hero h1{
  font-size:clamp(2.2rem,1.2rem + 3.1vw,3.5rem);
  line-height:1.03;
  letter-spacing:-0.032em;
  margin:0 0 1rem;
  max-width:13ch;
}

.sn-lede{
  font-family:var(--sn-serif);
  font-size:clamp(1.02rem,.98rem + .25vw,1.16rem);
  line-height:1.6;
  color:var(--sn-ink-2);
  margin:0;
}

/* Signaturen: raden med testvinnare. */
.sn-verdicts{ border-top:1px solid var(--sn-stone); }

.sn-verdict{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-areas:"cat score" "name score" "why score";
  column-gap:1.5rem;
  padding:1.1rem 0;
  border-bottom:1px solid var(--sn-stone);
  text-decoration:none;
  color:inherit;
  transition:background-color .18s var(--sn-ease);
}
.sn-verdict:hover{ background:var(--sn-moss-soft); }
.sn-verdict:hover .sn-verdict-name{ color:var(--sn-moss-deep); }

.sn-verdict-cat{ grid-area:cat; color:var(--sn-ink-3); margin-bottom:.2rem; }
.sn-verdict-name{
  grid-area:name;
  font-family:var(--sn-sans);
  font-weight:700;
  font-size:1.16rem;
  letter-spacing:-0.02em;
  color:var(--sn-ink);
  line-height:1.22;
}
.sn-verdict-why{
  grid-area:why;
  display:block;
  font-family:var(--sn-serif);
  font-weight:400;
  font-size:.95rem;
  line-height:1.5;
  color:var(--sn-ink-2);
  margin-top:.25rem;
  letter-spacing:0;
}
.sn-verdict-score{
  grid-area:score;
  align-self:center;
  text-align:right;
  font-family:var(--sn-sans);
  font-size:1.18rem;
  font-weight:700;
  letter-spacing:-0.01em;
  color:var(--sn-sun);
  white-space:nowrap;
}
.sn-verdict-score span{
  display:block;
  color:var(--sn-ink-3);
  margin-top:.2rem;
  font-weight:600;
}

/* Metodbandet. */
.sn-method{
  background:var(--sn-moss-deep);
  color:#D3E0D9;
  padding-block:clamp(3rem,2rem + 3vw,4.5rem);
}
.sn-method h2{ color:#fff; margin:0 0 2rem; max-width:20ch; }
.sn-method .sn-eyebrow{ color:#8FBBA5; }
.sn-method-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:2.25rem;
}
.sn-method-step{
  font-family:var(--sn-serif);
  font-size:1rem;
  line-height:1.62;
  color:#D3E0D9;
  border-top:1px solid rgba(255,255,255,.18);
  padding-top:1rem;
}
.sn-method-step strong{
  display:block;
  font-family:var(--sn-sans);
  font-weight:600;
  color:#fff;
  font-size:1.02rem;
  letter-spacing:-0.01em;
  margin-bottom:.4rem;
}
.sn-disclosure{
  font-family:var(--sn-serif);
  font-size:.92rem;
  line-height:1.6;
  color:#A9BDB2;
  margin:2.5rem 0 0;
  padding-top:1.25rem;
  border-top:1px solid rgba(255,255,255,.18);
  max-width:none;
}

/* Kadence-raderna anvande 1132 px inre bredd och en annan kramnyans an
   de nya sektionerna, vilket gav ett synligt hopp i vansterkanten. */
.home .kb-row-layout-wrap .kt-row-column-wrap{
  padding-top:clamp(3rem,2rem + 2vw,4.5rem);
  padding-bottom:clamp(3rem,2rem + 2vw,4.5rem);
}
.home .wp-block-kadence-advancedheading,
.home .kt-adv-heading-wrap,
.home .wp-block-kadence-rowlayout h2{
  text-align:left !important;
  margin-inline:0 !important;
}
.home .entry-content h2{ margin-bottom:1.75rem; }

/* ------------------------------------------------------ Gammalt hack --- */
/* Anpassa > Ytterligare CSS har en global h1-regel med 30 px ram, radie,
   slagskugga och grumlig bakgrund. Den laddas efter det har temat.
   Regeln bor raderas dar; tills vidare neutraliseras den har. */

h1{
  background-color:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  filter:none !important;
}

/* --------------------------------------------------------- Rorelse ----- */

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  .entry.loop-entry:hover,
  .kt-blocks-post-grid-item-inner-wrap:hover{ transform:none; }
}

/* ----------------------------------------------------------- Mobil ----- */

@media (max-width:1024px){
  :root{ --sn-measure:40rem; }
  .sn-hero .sn-inner{ grid-template-columns:1fr; row-gap:2.5rem; }
  .sn-hero .sn-verdicts{ grid-column:1; grid-row:auto; }
  .sn-hero h1{ max-width:16ch; }
}

@media (max-width:900px){
  .sn-method-grid{ grid-template-columns:1fr; gap:1.5rem; }
}

@media (max-width:600px){
  body{ font-size:1.05rem; line-height:1.68; }
  .sn-hero h1{ max-width:none; }
  .sn-verdict{
    grid-template-columns:minmax(0,1fr) auto;
    column-gap:1rem;
    padding:1rem 0;
  }
  .sn-verdict-score{ font-size:1.05rem; }
  .entry-content.single-content > h2{ margin-top:2.1em; }
  .entry-content table{ font-size:.88rem; }
  /* Flytande bilder tog halva bredden bredvid rubriker och brot ord. */
  .entry-content figure.alignright,
  .entry-content figure.alignleft{
    float:none;
    max-width:180px;
    margin:0 auto 1rem;
  }
}


/* ------------------------------------------- Rattningar efter granskning */

/* Domarraderna ar lankar och ska inte understrykas. */
.sn-verdict,
.sn-verdict *{ text-decoration:none !important; }
.entry-title a,
.kt-blocks-post-grid-item-inner .entry-title a,
.loop-entry .entry-title a{ text-decoration:none !important; }

/* "Uncategorized" ar ett systemord. Hela pillret doljs, inte bara texten. */
.category-links:has(a[href*="uncategorized"]),
.entry-taxonomies:has(a[href*="uncategorized"]){ display:none !important; }

/* Kortens tomma footer gav en vit remsa med streck under varje titel. */
.kt-blocks-post-grid-item-inner > .entry-content:empty,
.kt-blocks-post-grid-item-inner > footer.kt-blocks-post-footer:empty,
.kt-blocks-post-grid-item-inner > footer.kt-blocks-post-footer{ display:none !important; }

/* Sociala ikonerna i sidhuvudet radbrots till tva rader. */
.header-social-wrap,
.header-social-inner-wrap{ flex-wrap:nowrap !important; white-space:nowrap; }
.header-social-wrap .social-button{ flex:0 0 auto; }


/* Sidhuvudet behover mer bredd an artikelspalten, annars radbryts menyn. */
.site-header-row-layout-standard .site-header-row-container-inner > .site-container,
.site-header-inner-wrap > .site-container,
#masthead .site-container{ max-width:1340px; }
.header-navigation .header-menu-container>ul>li>a{
  padding-inline:.72rem;
  font-size:.79rem;
  letter-spacing:.07em;
}
.header-navigation .header-menu-container > ul{ flex-wrap:nowrap; }

/* Kortmetan stod pa engelska: "BY JACK SVENSSON - JULY 4, 2024".
   Den tillfor inget pa en testsajt och doljs. */
.loop-entry .entry-meta,
.kt-blocks-post-grid-item-inner .entry-meta,
.kt-blocks-post-grid-item-inner .kt-blocks-post-author,
.kt-blocks-post-grid-item-inner .kt-blocks-post-date{ display:none !important; }
.loop-entry .entry-content-wrap{ padding-bottom:1.1rem; }