
.visuellt-dold{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.mp-liten{font-size:14px;color:var(--sage)}


.kb-huvud{max-width:var(--max);margin:0 auto;padding:calc(var(--hdr) + clamp(56px,11vh,128px)) var(--kant) clamp(36px,6vh,64px);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:24px clamp(32px,5vw,96px);align-items:end}
.kb-huvud h1{font-size:clamp(40px,6.4vw,104px);line-height:.98}
.kb-ingress{max-width:26em;font-size:clamp(16px,1.2vw,19px);padding-bottom:.4em}
.kb-sangar{max-width:var(--max);margin:0 auto;padding:0 var(--kant) clamp(88px,14vh,160px)}
.kb-filter{display:flex;flex-wrap:wrap;gap:8px;padding:20px 0 clamp(28px,4vh,44px);border-top:1px solid var(--linje)}
.kb-filter button{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border:1px solid rgba(52,49,48,.28);border-radius:2px;background:transparent;color:var(--graphite);font:500 11px/1 "Soehne",sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:background .35s var(--mjuk),color .35s var(--mjuk),border-color .35s var(--mjuk),transform .2s var(--mjuk)}
.kb-filter .kb-antal{font-size:11px;font-weight:400;letter-spacing:0;opacity:.8}
.kb-filter button:hover{border-color:var(--graphite)}
.kb-filter button:active{transform:scale(.97)}
.kb-filter button[aria-pressed="true"]{background:var(--graphite);border-color:var(--graphite);color:var(--linen)}
.kb-filter button:focus-visible{outline:2px solid var(--graphite);outline-offset:3px}
.kb-rutnat{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(36px,5vh,56px) clamp(14px,1.6vw,24px)}
.kb-kort[hidden]{display:none}
.kb-kort>a{display:flex;flex-direction:column;height:100%}
.kb-kort figure{aspect-ratio:4/5;overflow:hidden;background:#d9d2c4}
.kb-kort img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--mjuk)}
.kb-kort a:hover img,.kb-kort a:focus-visible img{transform:scale(1.045)}
.kb-kort a:focus-visible{outline:2px solid var(--graphite);outline-offset:6px}
.kb-namn{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px;margin-top:18px}
.kb-namn h3{font-size:18px;letter-spacing:.01em}
.kb-namn .etikett{color:var(--sage)}
.kb-rad{margin-top:10px;font-size:15px;line-height:1.5;color:var(--sage);max-width:26em}

::view-transition-group(*){animation-duration:.6s;animation-timing-function:cubic-bezier(.16,1,.3,1)}

.kb-del{max-width:var(--max);margin:0 auto;padding:clamp(72px,12vh,140px) var(--kant);border-top:1px solid var(--linje)}
.kb-del-huvud{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px 48px;margin-bottom:clamp(32px,5vh,56px)}
.kb-del-huvud h2{font-size:clamp(30px,3.1vw,48px)}
.kb-del-huvud p{max-width:30em;font-size:clamp(16px,1.1vw,17px)}
.kb-saker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(32px,5vh,48px) clamp(14px,1.6vw,24px)}
.kb-saker.kb-tre{grid-template-columns:repeat(3,minmax(0,1fr))}
.kb-sak>a,.kb-sak>div{display:flex;flex-direction:column;height:100%}
.kb-sak figure{aspect-ratio:1/1;overflow:hidden;background:#d6d1c4}
.kb-tre .kb-sak figure{aspect-ratio:4/3}
.kb-sak img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--mjuk)}
.kb-sak a:hover img,.kb-sak a:focus-visible img{transform:scale(1.045)}
.kb-sak a:focus-visible{outline:2px solid var(--graphite);outline-offset:6px}
.kb-sak h3{margin-top:16px;font-size:16px;letter-spacing:.01em}
.kb-sak p{margin-top:8px;font-size:15px;line-height:1.5;color:var(--sage);max-width:28em}


.mp-topp{max-width:var(--max);margin:0 auto;padding:calc(var(--hdr) + 28px) var(--kant) clamp(72px,12vh,140px);display:grid;grid-template-columns:minmax(0,1.32fr) minmax(0,.88fr);gap:20px clamp(32px,4.4vw,88px);align-items:start}
.mp-smula{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--sage)}
.mp-smula a{display:inline-flex;align-items:center;min-height:44px;color:var(--graphite);background:linear-gradient(currentColor,currentColor) 0 calc(100% - 12px)/100% 1px no-repeat;transition:background-size .45s var(--mjuk)}
.mp-smula a:hover{background-size:0 1px;background-position:100% calc(100% - 12px)}


.mp-galleri{min-width:0;position:sticky;top:calc(var(--hdr) + 24px)}
.mp-spar{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;cursor:grab;-webkit-overflow-scrolling:touch;background:#d9d2c4}
.mp-spar::-webkit-scrollbar{display:none}
.mp-spar.drar{scroll-snap-type:none;cursor:grabbing}
.mp-spar:focus-visible{outline:2px solid var(--graphite);outline-offset:4px}
.mp-bild{flex:0 0 100%;aspect-ratio:3/2;overflow:hidden;scroll-snap-align:start}
.mp-bild img{width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none;transform:scale(1.04);transition:transform 1.4s var(--mjuk)}
.mp-bild.pa img{transform:none}
.mp-raknare{display:none;margin-top:10px;font-size:11px;font-weight:500;letter-spacing:.08em;color:var(--sage)}
.mp-tummar{display:flex;gap:10px;margin-top:12px;overflow-x:auto;scrollbar-width:none;padding:2px}
.mp-tummar::-webkit-scrollbar{display:none}
.mp-tumme{position:relative;flex:0 0 clamp(64px,7vw,104px);aspect-ratio:3/2;min-height:44px;padding:0;border:0;background:#d9d2c4;cursor:pointer;overflow:hidden;opacity:.55;transition:opacity .4s var(--mjuk)}
.mp-tumme img{width:100%;height:100%;object-fit:cover}
.mp-tumme::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--graphite);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--mjuk)}
.mp-tumme:hover{opacity:.85}
.mp-tumme[aria-current="true"]{opacity:1}
.mp-tumme[aria-current="true"]::after{transform:scaleX(1)}
.mp-tumme:focus-visible{outline:2px solid var(--graphite);outline-offset:2px}


.mp-info{display:grid;gap:0;align-content:start}
.mp-info .etikett{color:var(--sage)}
.mp-info h1{margin:10px 0 18px;font-size:clamp(40px,4.6vw,76px);line-height:.98}
.mp-ingress{font-size:clamp(18px,1.4vw,21px);font-weight:300;line-height:1.4;max-width:24em}
.mp-brod{margin-top:18px;max-width:34em;font-size:15px;line-height:1.65}
.mp-fakta{display:grid;grid-template-columns:minmax(120px,.42fr) minmax(0,1fr);gap:12px 20px;margin-top:28px;padding-top:18px;border-top:1px solid var(--linje)}
.mp-fakta>.etikett{padding-top:3px}
.mp-fakta dl{display:grid;gap:6px;font-size:15px}
.mp-fakta dl div{display:flex;justify-content:space-between;gap:16px}
.mp-fakta dt{color:var(--sage)}
.mp-fakta dd{text-align:right}
.mp-prickar{display:flex;flex-wrap:wrap;gap:0;margin:-6px 0 4px -6px}
.mp-prick{display:grid;place-items:center;width:44px;height:44px;border-radius:50%}
.mp-prick img{width:30px;height:30px;border-radius:50%;object-fit:cover;background:var(--prov);box-shadow:0 0 0 1px rgba(52,49,48,.18);transition:transform .35s var(--mjuk),box-shadow .35s var(--mjuk)}
.mp-prick:hover img,.mp-prick:focus-visible img{transform:scale(1.15);box-shadow:0 0 0 1px var(--linen),0 0 0 2px var(--graphite)}
.mp-prick:focus-visible{outline:none}
.mp-knappar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:30px 0 0}
.mp-knappar>.e-lank{flex-basis:100%;justify-content:flex-start;width:max-content;max-width:max-content;margin-top:8px}
.mp-knappar>.mp-liten{flex-basis:100%;margin-top:2px}
.mp-kant{box-shadow:inset 0 0 0 1px var(--graphite)}
.mp-kant:hover{box-shadow:inset 0 0 0 1px var(--graphite),0 10px 24px rgba(0,0,0,.12)}


.mp-design{max-width:var(--max);margin:0 auto;padding:clamp(88px,14vh,160px) var(--kant);border-top:1px solid var(--linje);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,96px);align-items:center}
.mp-design-foto{aspect-ratio:4/3}
.mp-design .e-text>.etikett{color:var(--sage);margin-bottom:14px}
.mp-gavlar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 28px;max-width:30em}
.mp-gavel{display:grid;gap:8px;min-height:44px;font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase}
.mp-gavel img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;background:#d6d1c4;transition:transform .6s var(--mjuk),box-shadow .6s var(--mjuk)}
.mp-gavel:hover img,.mp-gavel:focus-visible img{transform:translateY(-4px);box-shadow:0 14px 28px rgba(0,0,0,.14)}
.mp-gavel:focus-visible{outline:2px solid var(--graphite);outline-offset:4px}


.mp-rubrikrad{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px 48px;margin-bottom:clamp(32px,5vh,56px)}
.mp-rubrikrad h2,.mp-faq h2,.mp-garanti h2,.mp-fasthet h2{font-size:clamp(30px,3.1vw,48px)}
.mp-rubrikrad p{max-width:30em;font-size:clamp(16px,1.1vw,17px)}


.mp-matt{max-width:var(--max);margin:0 auto;padding:clamp(88px,14vh,160px) var(--kant);border-top:1px solid var(--linje)}
.mp-vyer{display:grid;grid-template-columns:571fr 635fr 481fr;gap:clamp(12px,2vw,32px);align-items:end}
.mp-vy img{width:100%;height:auto}
.mp-vy figcaption{margin-top:10px;font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--sage)}
.mp-spec{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px clamp(24px,4vw,72px);margin-top:clamp(48px,8vh,88px)}
.mp-spec h3{font-family:"Soehne",sans-serif;font-size:11px;font-weight:500;letter-spacing:.08em;margin-bottom:10px}
.mp-spec dl{border-top:1px solid var(--linje)}
.mp-spec dl div{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--linje);font-size:15px}
.mp-spec dt{color:var(--sage)}
.mp-spec dd{text-align:right}


.mp-lager{max-width:var(--max);margin:0 auto;padding:clamp(88px,14vh,160px) 0 clamp(72px,12vh,140px);border-top:1px solid var(--linje)}
.mp-lager .mp-rubrikrad{padding:0 var(--kant)}
.mp-lager .in-yta{grid-template-rows:auto;padding:0 var(--kant)}
.mp-lager .in-bildkol{grid-row:1}
.mp-lager .in-listkol{grid-row:1}
.mp-lager .in-listkol>.e-lank{margin-top:22px}
@media (min-width:861px){.mp-lager .in-bild{--bw:min(100%,calc((100svh - var(--hdr) - 96px) / (1 + var(--topp,0))))}}


.mp-fasthet{max-width:var(--max);margin:0 auto;padding:clamp(88px,14vh,160px) var(--kant);border-top:1px solid var(--linje);display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,96px);align-items:center}
.mp-fasthet .e-text>.etikett{color:var(--sage);margin-bottom:14px}
.mp-fasthet .e-text>p:not(.mp-vald):not(.mp-liten){margin:1.1em 0 1.6em}
.mp-fastval{display:flex;flex-wrap:wrap;gap:8px}
.mp-fastval button{min-height:48px;padding:0 20px;border:1px solid rgba(52,49,48,.3);border-radius:2px;background:transparent;color:var(--graphite);font:400 15px/1 "Soehne",sans-serif;cursor:pointer;transition:background .35s var(--mjuk),color .35s var(--mjuk),border-color .35s var(--mjuk),transform .2s var(--mjuk)}
.mp-fastval button:hover{border-color:var(--graphite)}
.mp-fastval button:active{transform:scale(.97)}
.mp-fastval button[aria-pressed="true"]{background:var(--graphite);border-color:var(--graphite);color:var(--linen)}
.mp-fastval button:focus-visible{outline:2px solid var(--graphite);outline-offset:3px}
.mp-vald{display:flex;align-items:baseline;gap:14px;margin:26px 0 6px;padding-top:16px;border-top:1px solid var(--linje)}
.mp-vald .etikett{color:var(--sage)}
.mp-vald-namn{font-family:"Lateral";font-weight:500;text-transform:uppercase;font-size:clamp(20px,1.8vw,26px);letter-spacing:-.01em}
.mp-fast-bild{margin:0}
.mp-fast-bild svg{display:block;width:100%;height:auto;overflow:visible}
.mp-skala{display:flex;justify-content:space-between;margin-top:10px;font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--sage)}


.mp-garanti{position:relative;background:radial-gradient(70% 90% at 0% 0%,rgba(237,231,219,.13),rgba(237,231,219,0) 62%),radial-gradient(60% 80% at 100% 100%,rgba(237,231,219,.1),rgba(237,231,219,0) 60%),var(--gron);color:var(--linen);padding:clamp(72px,12vh,128px) var(--kant)}
.mp-garanti-inre{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:auto minmax(0,1fr);gap:24px clamp(32px,5vw,96px);align-items:center}
.mp-sigill{width:clamp(150px,16vw,240px);height:auto;filter:drop-shadow(0 6px 18px rgba(0,0,0,.25))}
.mp-garanti p{margin:1em 0 1.8em;max-width:30em;font-size:clamp(16px,1.15vw,18px)}
.mp-garanti h2{max-width:16em}


.mp-faq{max-width:var(--max);margin:0 auto;padding:clamp(88px,14vh,160px) var(--kant);display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:24px clamp(32px,5vw,96px);align-items:start}
.mp-fragor{list-style:none;padding:0;border-top:1px solid var(--linje)}
.mp-fragor>li{border-bottom:1px solid var(--linje)}
.mp-fragor h3{font:inherit;text-transform:none;letter-spacing:0;line-height:inherit}
.mp-fraga{display:flex;justify-content:space-between;align-items:center;gap:20px;width:100%;min-height:64px;padding:18px 0;border:0;background:none;text-align:left;font:400 clamp(16px,1.25vw,19px)/1.4 "Soehne",sans-serif;color:var(--graphite);cursor:pointer}
.mp-fraga:focus-visible{outline:2px solid var(--graphite);outline-offset:2px}
.mp-fraga>span:first-child{transition:transform .45s var(--mjuk)}
@media (hover:hover){.mp-fraga:hover>span:first-child{transform:translateX(6px)}}
.mp-tecken{flex:none;width:14px;height:14px;overflow:visible}
.mp-tecken line{stroke:currentColor;stroke-width:1.5}
.mp-lodrat{transform-box:fill-box;transform-origin:center;transition:transform .45s var(--mjuk)}
.mp-fraga[aria-expanded="true"] .mp-lodrat{transform:rotate(90deg) scaleY(0)}
.mp-svar{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s var(--mjuk)}
.mp-svar>div{overflow:hidden;min-height:0}
.mp-svar p{padding:0 0 22px;max-width:36em;opacity:0;transform:translateY(-6px);transition:opacity .45s .08s,transform .55s var(--mjuk)}
.mp-svar.oppen{grid-template-rows:1fr}
.mp-svar.oppen p{opacity:1;transform:none}

.mp-fler{border-top:1px solid var(--linje)}
.mp-cta{display:block}

@media (max-width:1100px){
  .kb-rutnat,.kb-saker{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kb-saker.kb-tre{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mp-topp{grid-template-columns:minmax(0,1fr)}
  .mp-galleri{position:static}
}
@media (max-width:860px){
  .kb-huvud{grid-template-columns:1fr;padding-top:calc(var(--hdr) + 44px)}
  .kb-saker.kb-tre{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mp-topp{padding-top:calc(var(--hdr) + 8px);row-gap:12px}
  .mp-galleri{margin:0 calc(-1 * var(--kant))}
  .mp-raknare{display:block;padding:0 var(--kant)}
  .mp-tummar{padding:2px var(--kant)}
  .mp-tumme{flex-basis:72px}
  .mp-info{margin-top:18px}
  .mp-design,.mp-fasthet,.mp-faq{grid-template-columns:1fr}
  .mp-design .e-text{order:-1}
  .mp-gavlar{gap:8px}
  .mp-vyer{grid-template-columns:1fr;gap:28px}
  .mp-vy{max-width:520px}
  .mp-spec{grid-template-columns:1fr}
  .mp-lager .in-yta{padding:0}
  .mp-lager .mp-rubrikrad{margin-bottom:20px}
  .mp-lager .in-listkol>.e-lank{margin-left:0}
  .mp-garanti-inre{grid-template-columns:1fr}
  .mp-sigill{width:140px}
  .mp-fast-bild{order:2}
}
@media (max-width:480px){
  .mp-fakta{grid-template-columns:1fr;gap:10px}
  .mp-knappar .knapp{flex:1 1 100%}
  .mp-gavlar{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:359px){
  .kb-rutnat,.kb-saker,.kb-saker.kb-tre{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .kb-kort img,.kb-sak img,.mp-bild img,.mp-gavel img,.mp-svar,.mp-svar p,.mp-lodrat,.mp-tumme::after{transition:none}
  .mp-bild img{transform:none}
  ::view-transition-group(*){animation:none}
}
