/* Varv 17, Aidas hemsidefeedback 14 september. Eget lager, laddas bara med V17=1. */

/* 19. AI-strecken bort, etiketten står ensam */
.eyebrow::before{display:none}
.eyebrow{gap:0}

/* 1. Inget vitt i heron. Beige text och logga, mörkare toning nertill så det går att läsa */
.film__txt h1,.film__txt h1 em,.film__txt h1 .ink{color:#E6D7C6}
.film__txt .lede{color:rgba(230,215,198,.9)}
.film__txt .eyebrow{color:#C9A98B}
.film__txt .link--light{color:#E6D7C6}
.film::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(34,22,15,.42) 0%,rgba(34,22,15,.10) 40%,rgba(34,22,15,.58) 100%)}
.film__txt{z-index:2}
.is-dark .nav:not(.is-solid) .nav__brand img{filter:invert(.92) sepia(.5) saturate(.9) brightness(1.05)}

/* 17. Rullgardinen, mindre text */
.sheet a{font-size:clamp(22px,5.6vw,30px);padding:8px 0;line-height:1.35}

/* 18. Stegsiffran ska inte gömma sig under bilden */
.steg__k .num{position:static;margin-top:6px}

/* 22. Mjukare former, färre fyrkanter */
:root{--r:14px}
.frame,.pc,.pc__img,.kamp__img,.kamp__img img,.steg__k img,.film__card,.tri3 img{border-radius:14px}
.btn{border-radius:999px}

/* 20, 22, 23. Mindre vitt, mer djup. Korten i samma jordton som sidan, lyfta med en mjuk skugga i stället för vit yta och ram */
.pc{background:#F7EBDB;border-color:rgba(160,92,64,.16);box-shadow:0 14px 36px rgba(61,46,36,.10)}
.kedja__k{background:#F5E7D4;border-radius:14px;box-shadow:0 12px 32px rgba(61,46,36,.09)}
.sec--sand .kedja__k{background:#F3E3CE}

/* 21. Filmen i heron, IMG_6134 ur Drive, händerna i sheasmöret */
.film__vid{width:100%;height:100%;object-fit:cover;object-position:center 60%;display:block}
@media (prefers-reduced-motion:reduce){.film__vid{display:none}.film__f[data-i="0"]{background:url(vid/hero-shea.jpg) center 45%/cover}}

/* ===== Varv 18, mötet 14/9 ===== */

/* 1. Paletten genomgående. Inget vitt, grönt eller rosa. Sektionerna i samma beige familj, footern varm */
:root{--lin:#F1E3CF;--sand:#E4D0B4;--sand-2:#C9A583;--white:#F7EBDB;--sage:#B98F6B;--rose:#DDBB9E;--terra2:#D4A78B;--line:rgba(122,74,54,.22)}
.sec--sage{color:var(--ink)}.sec--sage .eyebrow{color:var(--ink-2)}.sec--sage h2,.sec--sage .head p{color:var(--ink)}
.sec--deep{--sec-bg:#7A4A36}
.foot{background:#5C3B2B;color:#F2E6D6}
.foot__grid a{color:#F2E6D6}.foot__grid p{color:rgba(242,230,214,.78)}.foot__grid b{color:rgba(242,230,214,.6)}
.foot__base{color:rgba(242,230,214,.7)}
.foot__logo{filter:invert(.92) sepia(.5) saturate(.9) brightness(1.05)}
.film__shade{background:linear-gradient(180deg,rgba(34,22,15,.2),rgba(34,22,15,.55))}
.film__f figcaption{display:none}
.film__card{transition:opacity .4s ease,transform .4s var(--ease)}
.film__card.is-byter{opacity:0;transform:translateY(6px)}

/* 2. Kategorikorten. Bilden fyller kortet, rubriken ovanpå, inga block */
.katrad{gap:18px}
.kat{position:relative;min-height:170px;padding:0;background:var(--sand-2);border:0;align-items:flex-end;overflow:hidden;box-shadow:0 18px 36px -22px rgba(61,46,36,.55)}
.kat::after{display:none}
.kat__img{position:absolute;inset:0;width:100%;height:100%;border-radius:0;background:var(--sand-2)}
.kat__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.kat:hover .kat__img img{transform:scale(1.05)}
.kat__t{position:relative;z-index:1;width:100%;padding:44px 18px 16px;color:#F7EBDB;background:linear-gradient(180deg,transparent,rgba(40,26,18,.78))}
.kat__t b,.kat__t small{color:#F7EBDB}.kat__t small{opacity:.8}
@media (max-width:560px){.katrad{grid-template-columns:repeat(2,1fr)}.kat{min-height:150px}}

/* 3. Familjen, hennes teckning */
.frame--teckning{background:#F5E9DA;aspect-ratio:947/920}
.frame--teckning img{object-fit:contain}

/* 6, 7. Produktsidan som dragspel */
.pd__las{margin:14px 0 6px}
.pd__acc{max-width:none;margin-top:18px}
.pd__acc summary{font-size:20px;padding:16px 40px 16px 0}
.acc__in{padding:0 0 22px;color:var(--ink-2)}
.acc__in p{margin:0 0 12px}
.acc__in .guide{grid-template-columns:repeat(2,1fr);gap:16px;margin-top:14px}
.acc__in .guide h3{font-size:18px}
.acc__h{font-family:var(--f-disp);font-size:20px;margin:22px 0 8px;color:var(--ink)}
.acc__in .steg{grid-template-columns:repeat(2,1fr);gap:14px;margin-top:10px}
.acc__in .steg img{border-radius:10px}
.acc__in .kedja{grid-template-columns:1fr;gap:12px;margin-bottom:18px}
.acc__in .kedja__k{padding:16px 18px}
.acc__in .faq{max-width:none}
.pd__vag h2{font-size:22px;margin:16px 0 8px}
.acc__in .head{display:none}
.acc__in .innehall{display:none}
.quotes--col{max-height:none}

/* 9. Siffrorna utan ring */
.num{border:0;width:auto;height:auto;font-size:26px;font-weight:400;line-height:1;letter-spacing:0;color:var(--terra);font-variant-numeric:lining-nums;margin-right:4px}
.mono .num{margin-right:10px}
.prow .num{min-width:34px;text-align:left;padding-top:2px}

/* 11. Kvinnor och arv, underrubrikerna */
h3.sub{font-size:clamp(24px,2.6vw,34px);margin:8px 0 2px;line-height:1.15}

/* 12. Nyhetsbrevet */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.nyhet--foot{grid-column:1/-1;display:flex;flex-direction:column;gap:6px;max-width:520px;margin-top:8px;padding-top:26px;border-top:1px solid rgba(242,230,214,.18)}
.nyhet--foot b{font-weight:600;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(242,230,214,.6)}
.nyhet--foot p{color:rgba(242,230,214,.78);margin:0}
.nyhet__row{display:flex;gap:8px;align-items:stretch;margin-top:6px}
.nyhet__row input{flex:1 1 auto;min-width:0;padding:12px 14px;border:1px solid rgba(242,230,214,.35);border-radius:999px;background:rgba(255,255,255,.08);color:inherit;font:inherit}
.nyhet__row input:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.nyhet__row input[aria-invalid="true"]{border-color:#E08A72}
.nyhet__tack{margin:8px 0 0;font-weight:600}
/* mobil: heron har stående film */
@media (max-width:700px){.film__vid{object-position:center 40%}}

/* 15. Produkterna under hudkartan på en rad, Saids punkt 14/9 */
.rut__grid{grid-template-columns:repeat(4,1fr);gap:16px}
@media (max-width:1180px){.rut__grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.rut__grid{grid-template-columns:1fr}}

/* ===== Varv 18, rättning 15/9 natt. Ett tema överallt, Aidas palett. cream #F9F1E7, oat #E6D7C6, sand #C9A98B, terracotta #B66856, cocoa #7A4A36. Inga mörka sektioner, ingen mörk footer ===== */
:root{--lin:#F3E8D8;--sand:#E6D7C6;--sand-2:#C9A98B;--white:#F9F1E7;--sage:#C9A98B;--rose:#DEC4A8;--terra2:#D8B497;--ink:#3D2E24;--ink-2:#7A4A36;--mute:#7A5A46;--terra:#B66856;--gold:#B66856;--gold-2:#9A5240;--deep:#C9A98B}
.sec--dark{--sec-bg:#C9A98B;color:var(--ink)}
.sec--dark h2,.sec--dark h3,.sec--dark p,.sec--dark .body,.sec--dark .eyebrow,.sec--dark .mono,.sec--dark .num{color:var(--ink)}
.sec--dark .eyebrow,.sec--dark .mono{color:var(--ink-2)}
.sec--dark .btn--light{background:var(--ink);color:#F9F1E7;border-color:var(--ink)}
.sec--dark .steg__k p{color:var(--ink-2)}
.head--light p{color:var(--ink-2)}
.cta--light{border-color:rgba(122,74,54,.3)}.cta--light p{color:var(--ink-2)}.cta--light h2{color:var(--ink)}
.sec--deep{--sec-bg:#C9A98B;color:var(--ink)}
.sec--sage{--sec-bg:#E6D7C6}.sec--rose{--sec-bg:#DEC4A8}.sec--terra{--sec-bg:#D8B497}
.siffror{background:rgba(122,74,54,.18)}.sif b,.sif span{color:var(--ink)}
.sec--dark .nuni-mark--bild,.story-mark--light .nuni-mark--bild{filter:none;mix-blend-mode:multiply;opacity:1}
.foot{background:#E6D7C6;color:var(--ink);border-top:1px solid rgba(122,74,54,.18)}
.foot__grid a{color:var(--ink)}.foot__grid a:hover{border-color:var(--terra)}
.foot__grid p{color:var(--ink-2)}.foot__grid b{color:var(--ink-2)}
.foot__base{color:var(--ink-2)}
.foot__logo{filter:none}
.foot .insight-brand-link,.foot .insight-mark,.foot .insight-mark__text{color:var(--ink-2)}
.nyhet--foot{border-top-color:rgba(122,74,54,.18)}
.nyhet--foot b{color:var(--ink-2)}.nyhet--foot p{color:var(--ink-2)}
.nyhet__row input{border-color:rgba(122,74,54,.35);background:rgba(255,255,255,.35);color:var(--ink)}
.pc{background:#F9F1E7}
.kedja__k{background:#F3E8D8}.sec--sand .kedja__k{background:#F9F1E7}
.film__card{background:#F9F1E7}
.nav.is-solid{background:rgba(243,232,216,.92)}
.insight-mark strong{color:var(--ink)}
.phero--full{color:#E6D7C6}.phero--full .eyebrow{color:#C9A98B}.phero--full .lede{color:rgba(230,215,198,.9)}

/* footern tonar in ur sidan som sektionerna, ingen kant */
.foot{border-top:0;background:linear-gradient(to bottom,transparent 0,#E6D7C6 320px);padding-top:clamp(120px,13vw,180px)}
.foot{z-index:0}
body>.sec{z-index:1}

/* varv 19: tryckyta 44 px på länkarna i kontaktrutan */
.kbox .big{display:inline-flex;align-items:center;min-height:44px}

/* varv 20, bildvikt. Affischen är en riktig bild med hög prioritet och blir det första som syns, videon tonar in ovanpå när den spelar. Herotexten animeras i css, utan att vänta på skript. */
.film__poster{position:absolute;inset:0;z-index:0;display:block}
.film__poster img{width:100%;height:100%;object-fit:cover;object-position:center 60%;display:block}
.film__vid{position:relative;z-index:1;opacity:0;transition:opacity .9s ease}
.film__vid.is-playing{opacity:1}
.film__txt{animation:filmtxt 1.2s ease .4s forwards}
@keyframes filmtxt{to{opacity:1;transform:none}}
@media (max-width:700px){.film__poster img{object-position:center 40%}}
@media (prefers-reduced-motion:reduce){.film__txt{animation:none;opacity:1;transform:none}.film__poster{display:block}}
/* bygge 30a: Kvinnor och arv, affischen ligger där videon ligger och under den, samma utsnitt som videons egen affisch gav */
.phero--vid .phero__poster{position:absolute;inset:0;z-index:0;display:block}
.phero--vid .phero__poster img{width:100%;height:100%;object-fit:cover;display:block}
.phero--vid .phero__poster + .phero__vid{opacity:0;transition:opacity .9s ease}
.phero--vid .phero__poster + .phero__vid.is-playing{opacity:1}

/* varv 20: sandkornet 800 px som webp, 132 kB jpg blev 6 kB. Ligger på 9 procent opacitet, skillnaden syns inte */
body::after{background-image:url(img/g/sand-tile-s.webp)}
.sheet::before{background-image:url(img/g/sand-tile-s.webp)}

/* varv 21: hudvårdsguiden i Hitta din rutin. Grupp, sedan hud eller behov. Varför, rollerna, stegen och Nuni-rutinen. */
.rut__grupper{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.rut__grupp{min-height:44px;padding:0 16px;border:0;border-radius:var(--r);background:transparent;font-family:var(--f-disp);font-size:20px;color:var(--mute);cursor:pointer;transition:color .3s,background .3s}
.rut__grupp.is-on{color:var(--ink);background:var(--sand)}
.rut__grupp:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.rut--guide .rut__tabs button[hidden]{display:none}
.rut__intro{max-width:66ch;margin-bottom:22px;display:flex;flex-direction:column;gap:8px}
.rut__varfor{color:var(--mute);font-size:16px;line-height:1.65;margin:0}
.rut__hur{display:grid;grid-template-columns:1.3fr 1fr;gap:28px;margin-top:26px;padding-top:24px;border-top:1px solid var(--line);align-items:start}
.rut__steg{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;max-width:60ch}
.rut__steg li{display:grid;grid-template-columns:96px 1fr;gap:12px;font-size:15px;line-height:1.55}
.rut__steg b{font-family:var(--f-disp);font-size:19px;font-weight:600;line-height:1.3}
.rut__steg span{color:var(--mute)}
.rut--guide .rut__all{flex-direction:column;align-items:flex-start;gap:14px;margin-top:0;background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px}
.rut__nuni{display:flex;flex-direction:column;gap:4px;font-family:var(--f-disp);font-size:22px;line-height:1.25}
.rut__nuni .eyebrow{font-family:var(--f-body)}
.roller{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.roll{display:flex;flex-direction:column;gap:8px;background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:14px;color:inherit;text-decoration:none;transition:transform .35s var(--ease),border-color .3s}
.roll:hover{transform:translateY(-3px);border-color:var(--gold)}
.roll img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:10px}
.roll b{font-family:var(--f-disp);font-size:21px;font-weight:600}
.roll q{font-size:13px;font-style:italic;color:var(--ink)}
.roll q::before,.roll q::after{content:'"'}
@media (max-width:1180px){.roller{grid-template-columns:repeat(3,1fr)}}
@media (max-width:900px){.rut__hur{grid-template-columns:1fr}}
@media (max-width:560px){.roller{grid-template-columns:1fr 1fr}.rut__grupp{font-size:18px;padding:0 12px}.rut__steg li{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.roll{transition:none}.roll:hover{transform:none}}
/* varv 21: rutnätets spalter får inte växa med texten, annars skjuter Nuni-rutinen ut sidan på mobil */
.rut__hur{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
.rut__hur>div,.rut__steg li>*,.rut__nuni{min-width:0;overflow-wrap:anywhere}
@media (max-width:900px){.rut__hur{grid-template-columns:minmax(0,1fr)}}
.rut--guide .rut__all{max-width:100%}
.rut--guide .rut__all .btn{white-space:normal;text-align:center;line-height:1.3;max-width:100%}
.roller{grid-template-columns:repeat(5,minmax(0,1fr))}.roll{min-width:0}
@media (max-width:1180px){.roller{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.roller{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:400px){.roller{grid-template-columns:minmax(0,1fr)}}

/* varv 22: två videolager i heron, det som spelar ligger överst och tonar in */
.film__vid{position:absolute;inset:0;transition:opacity 1.1s ease}
.film__vid.is-playing{opacity:1;z-index:2}
.film__vid--b{z-index:1}
/* byggrapport 24: lagret som lämnar står kvar helt synligt under det som tonar in, affischen syns aldrig igenom */
.film__vid.is-ut{opacity:1;z-index:1;transition:none}
/* bygge 40, Said 28/9: nekar telefonen uppspelningen (strömsparläge) står sheasmörbilden kvar och lagren döljs tills ett lager spelar */
.film .film__vid.is-stilla{opacity:0;visibility:hidden;transition:none}
/* iOS lägger en egen startknapp över en video som inte fick spela. Sajtens videor spelar av sig själva och har inga kontroller. */
video::-webkit-media-controls-start-playback-button{display:none!important;-webkit-appearance:none}

/* varv 24: Om produkterna, en sida per råvara med hela texten och produkten vid sidan */
.om__grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:48px;align-items:start}
.om__txt{max-width:66ch;display:flex;flex-direction:column;gap:14px}
.om__txt h2{margin-top:26px}.om__txt h2:first-child{margin-top:0}
.om__txt h3{font-family:var(--f-disp);font-size:22px;font-weight:600;margin:10px 0 0}
.om__txt .body{max-width:none}
.om__kort{position:sticky;top:calc(var(--nav-h) + 20px);background:var(--white);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.om__kort>a img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;height:auto}
.om__kort>div{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px}
@media (max-width:900px){.om__grid{grid-template-columns:minmax(0,1fr)}.om__kort{position:static}}

/* varv 25, Aida 14:27. Faktarutorna som jämnt rutnät, fyra på dator och två på mobil. Köpknappen får bryta rad och kapas aldrig. */
.fakta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.fakta span{flex:none;margin-right:0;padding:12px 14px 12px 0;border-right:1px solid var(--line);border-bottom:0}
.fakta span:nth-child(n+2){padding-left:14px}
.fakta span:nth-child(4n){border-right:0}
@media (max-width:900px){.fakta{grid-template-columns:repeat(2,minmax(0,1fr))}.fakta span{flex:none}.fakta span:nth-child(odd){padding-left:0;border-right:1px solid var(--line)}.fakta span:nth-child(even){border-right:0;padding-left:14px}.fakta span:nth-child(n+3){border-top:1px solid var(--line)}}
.pd__buy>*{min-width:0}
.pd__buy .btn--big{flex:1 1 200px;white-space:normal;text-align:center;line-height:1.25}

/* varv 26, Aida 15:17. Mindre luft före rubrikerna, luftigt men inte tomt. Reveal snabbare så sidan inte ser tom ut medan man scrollar. */
.sec{padding:clamp(48px,6.5vw,104px) 0}
.sec--tight{padding:clamp(24px,3.5vw,44px) 0 0}
.head{margin-bottom:clamp(22px,3.5vw,40px)}
.rv{transition:opacity .6s ease,transform .7s var(--ease);transform:translateY(16px)}
.rv-img{transition:opacity .7s ease,transform .8s var(--ease);transform:translateY(14px)}
.page{transition:background-color .8s ease}
/* omdömen sida för sida, fyra per sida, mindre kort */
.quotes--pag .q[data-sida]:not(.is-on){display:none}
.q--sm{padding:18px 20px;gap:8px}
.q--sm blockquote{font-size:17px;line-height:1.4}
.q--sm figcaption{font-size:13px}
.pag{display:flex;gap:8px;margin-top:22px;flex-wrap:wrap}
.pag button{min-width:44px;min-height:44px;border:1px solid var(--line);border-radius:999px;background:transparent;font-family:var(--f-body);font-size:14px;font-weight:600;color:var(--ink);cursor:pointer;transition:background .25s,color .25s}
.pag button.is-on{background:var(--ink);color:#fff;border-color:var(--ink)}
.pag button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* varv 27: Hudprofilen. En rutin i taget, resten dolda. Samma kort och steg som guiden. */
.profil__p{padding:clamp(40px,6vw,90px) 0}
.profil__p h2{margin:8px 0 12px}
.profil__p .rut__hur{margin-top:26px}
.profil__p .row-btn{margin-top:4px;display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.profil__tom{padding:clamp(40px,6vw,90px) 0}
.profil__tom[hidden]{display:none}
.profil__dela.is-kopierad{background:var(--ink);color:#fff;border-color:var(--ink)}
.phero--profil{padding-bottom:clamp(20px,3vw,36px)}

/* varv 29: Aidas eget språk i guiden, flera stycken och Tänk på */
.rut__intro{gap:10px}
.rut__tank{margin:4px 0 0;padding:12px 16px;border-left:3px solid var(--gold);background:var(--white);border-radius:0 var(--r) var(--r) 0;font-size:15px;line-height:1.55;color:var(--mute);display:flex;flex-direction:column;gap:8px}
.rut__tank b{color:var(--ink);font-weight:600}
.rut__tank p{margin:0}
.tvasteg{display:flex;flex-direction:column;gap:10px;max-width:60ch}
.tvasteg p{margin:0}

/* varv 30: guidens intro, hälsning, ingress och luft */
.rut--guide .rut__intro,.profil__p .rut__intro{max-width:64ch;gap:14px;margin:8px 0 34px}
.rut__intro .eyebrow{margin-bottom:6px}
.rut__lead{margin:0;font-family:var(--f-body);font-weight:500;font-size:18px;line-height:1.6;color:var(--ink)}
.rut__sahar{font-style:normal;font-weight:600;color:var(--gold)}
.rut__varfor{font-size:16px;line-height:1.7}
.rut--guide .rut__tank,.profil__p .rut__tank{margin-top:10px;padding:14px 18px;line-height:1.6;max-width:64ch}
@media (max-width:560px){.rut__lead{font-size:17px}}

/* varv 32: intron som redaktionellt block, förlaga Om produkterna på nuniglobal.se */
.rut--guide .rut__intro--ed,.profil__p .rut__intro--ed{max-width:none;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:center;margin:28px 0 44px}
.rut__intro--rev .rut__bild{order:2}
.rut__bild{margin:0;aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;background:var(--sand)}
.rut__bild img{width:100%;height:100%;object-fit:cover;display:block}
.rut__txt{display:flex;flex-direction:column;gap:16px;max-width:52ch}
.rut__rubrik{margin:0;font-family:var(--f-disp);font-weight:400;font-size:clamp(34px,4vw,52px);line-height:1.05;letter-spacing:-.01em;color:var(--ink)}
.rut__txt .rut__lead{font-size:17px;font-weight:400;line-height:1.7;color:var(--ink)}
.rut__mer{margin-top:4px}
.rut__mer summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:2px}
.rut__mer summary::-webkit-details-marker{display:none}
.rut__mer summary::after{content:"→";transition:transform .3s var(--ease)}
.rut__mer[open] summary::after{transform:rotate(90deg)}
.rut__mer>div{display:flex;flex-direction:column;gap:12px;padding-top:18px}
.rut__mer .rut__tank{margin-top:0}
@media (max-width:900px){.rut--guide .rut__intro--ed,.profil__p .rut__intro--ed{grid-template-columns:minmax(0,1fr);gap:22px;margin:16px 0 36px}.rut__intro--rev .rut__bild{order:0}.rut__bild{aspect-ratio:3/2}.rut__txt{max-width:none}}

/* varv 33: Aidas hälsning, hennes ord och hennes hjärta. Bekräftat i tråden 16/9 20:26, bruna hjärtat och inget annat. */
.rut__hej{margin:-4px 0 0;font-family:var(--f-body);font-size:15px;font-weight:600;letter-spacing:.01em;color:var(--mute);display:flex;align-items:center;gap:7px}
.rut__hjarta{font-size:16px;line-height:1}

/* varv 41: bandet tre per rad, sex bilder blir tva rena rader i stallet for fyra plus tva. Said 16/9. */
.band:not(.band--6){grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:900px){.band:not(.band--6){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.band:not(.band--6){grid-template-columns:minmax(0,1fr)}}
/* rubriken pa en rad dar den far plats */

/* varv 42: en bild med width- och height-attribut later attributet styra hojden om CSS inte sager nagot.
   Dar aspect-ratio ska galla maste height sattas, annars blir kortet sa hogt som attributet sager. Matt 16/9. */
.roll img,.rut__k img{height:auto}

/* varv 43: citaten i linje langst ner sa korten lasas som en rad, och rubriken pa en rad dar den far plats. Said 16/9. */
.roll{display:flex;flex-direction:column}

@media (min-width:1000px){#roller .head h2{white-space:nowrap}}

/* varv 44: citatet ligger under kortet, kortet blir lagre. Said 16/9. */
.roll__w{display:flex;flex-direction:column;gap:10px;min-width:0}
.roller>.roll__w{min-width:0}
.roll{padding:10px;gap:6px}

/* varv 45: hudkartans val far hela bredden, nio chips ryms pa en rad. Matt 16/9: raden var 778 px, chipsen kravde 868. */
.hud__topp{grid-column:1/-1;min-width:0}
.hud__topp .hud__h{margin:2px 0 14px}
.hud__topp .chips--zon{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;margin-bottom:26px}
.hud__topp .chips--zon::-webkit-scrollbar{display:none}
.hud__topp .chips--zon>button{flex:0 0 auto}
/* varv 45: korten lika hoga sa citaten hamnar pa samma linje, och ett lugnare citat */
.roller{align-items:stretch}
.roll__w{height:100%}
.roll{flex:1}

/* varv 48: klampen bort. Den kapade Aidas text med tre punkter for att vinna 21 px, fel byte.
   Korten far variera nagra pixlar, varje ord star kvar. Matt 16/9. */

/* varv 50: rollerna som redaktionella rader. Kortlooken nollstalls, en rad per textyta,
   citat med svenskt citattecken och kundens namn. Said 16/9. */
.roller{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--line);align-items:stretch}
.roll{display:grid;grid-template-columns:124px minmax(0,1fr) minmax(0,.66fr);gap:30px;align-items:start;
  padding:22px 0;background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;flex:none;transform:none}
.roll:hover{transform:none;border-color:var(--line);border-bottom-color:var(--line)}
.roll__bild{margin:0;width:124px;aspect-ratio:4/5;overflow:hidden;border-radius:3px;background:var(--sand)}
.roll__bild img{width:100%;height:100%;object-fit:cover;display:block;aspect-ratio:auto;border-radius:0}
.roll__txt{display:flex;flex-direction:column;gap:9px;min-width:0;padding-top:3px}
.roll__namn{font-family:var(--f-disp);font-weight:400;font-size:clamp(26px,2.6vw,34px);line-height:1.04;letter-spacing:-.01em;color:var(--ink);text-decoration:none}
.roll__namn:hover{color:var(--gold)}
.roll__roll{margin:0;font-size:15.5px;line-height:1.5;color:var(--ink-2);flex:none}
.roll__cit{display:grid;grid-template-columns:19px minmax(0,1fr);gap:8px;align-items:start;margin:0;padding-top:3px}
.roll__tkn{font-family:var(--f-em);font-size:38px;line-height:.72;color:var(--gold)}
.roll__q{display:block;margin:0;padding:0;border:0;min-height:0;font-family:var(--f-em);font-style:italic;font-size:24px;line-height:1.3;color:var(--ink);text-wrap:pretty}
.roll__q::before,.roll__q::after{content:none}
.roll__namn2{margin-top:12px;font-size:10.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2)}
@media (max-width:900px){.roller{grid-template-columns:none}.roll{grid-template-columns:112px minmax(0,1fr);gap:20px;row-gap:18px}.roll__bild{width:112px}.roll__cit{grid-column:1/-1}}

/* varv 55: inlaggen som de ser ut dar de postats. Vit kortplat, kontorad, ikonrad,
   gillasiffra och avkortad bildtext. Allt hos oss, ingen inbaddning och ingen tredjepart.
   Ingen text i sektionen ar skriven av oss. Said 17/9. */
.ig{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px;align-items:start}
.ig__k{display:flex;flex-direction:column;background:#fff;border:1px solid #DBDBDB;border-radius:6px;overflow:hidden;min-width:0}
.ig__topp{display:flex;align-items:center;gap:10px;padding:11px 13px;text-decoration:none;color:#262626}
.ig__av{width:32px;height:32px;border-radius:50%;object-fit:cover;flex:none;background:var(--sand)}
.ig__konto{font-size:13.5px;font-weight:700;letter-spacing:0;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ig__topp:hover .ig__konto{color:#00376B}
.ig__bild{display:block;aspect-ratio:4/5;overflow:hidden;background:#EFEFEF}
.ig__bild img{width:100%;height:100%;object-fit:cover;display:block}
.ig__akt{display:flex;align-items:center;gap:14px;padding:11px 13px 4px}
.ig__ikon{width:23px;height:23px;fill:none;stroke:#262626;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ig__sp{flex:1}
.ig__txt{display:flex;flex-direction:column;gap:5px;padding:2px 13px 14px;min-width:0}
.ig__gillar{font-size:13.5px;font-weight:700;color:#262626}
.ig__q{margin:0;font-size:13.5px;line-height:1.45;color:#262626;text-wrap:pretty}
.ig__q b{font-weight:700;margin-right:3px}
.ig__mer{color:#8E8E8E;text-decoration:none}
.ig__komm{font-size:13.5px;color:#8E8E8E;text-decoration:none}
.ig__komm:hover{color:#262626}
.ig__datum{font-size:10.5px;letter-spacing:.02em;text-transform:uppercase;color:#8E8E8E;margin-top:2px}
@media (max-width:1180px){.ig{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.ig{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}}
@media (max-width:560px){.ig{grid-template-columns:minmax(0,1fr);gap:18px}
  /* husregeln, 44 px tryckyta pa mobil */
  .ig__komm{display:flex;align-items:center;min-height:44px}
  .ig__txt{padding-bottom:10px}}

/* varv 56: montaget. Kommentarerna under Nunis egna inlagg som en vagg av roster.
   Ingen kortplat, hairline mellan rosterna, citatet i husets kursiv. Said 17/9. */
.mont{columns:3;column-gap:34px}
.mont__k{margin:0 0 26px;padding:0 0 26px;border-bottom:1px solid var(--line);break-inside:avoid;display:flex;flex-direction:column;gap:12px}
.mont__q{margin:0;font-family:var(--f-em);font-style:italic;font-size:20px;line-height:1.38;color:var(--ink);text-wrap:pretty}
.mont__q::before{content:"\201D";font-size:34px;line-height:0;color:var(--gold);margin-right:5px;vertical-align:-2px}
.mont__nam{display:flex;align-items:center;gap:9px;font-size:10.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2)}
.mont__gilla{display:inline-flex;align-items:center;gap:4px;letter-spacing:.06em;color:var(--gold)}
.mont__gilla::before{content:"";width:11px;height:11px;background:var(--gold);flex:none;
  clip-path:polygon(50% 100%,8% 56%,8% 28%,29% 12%,50% 28%,71% 12%,92% 28%,92% 56%)}
@media (max-width:1100px){.mont{columns:2;column-gap:28px}}
@media (max-width:640px){.mont{columns:1}.mont__q{font-size:19px}}

/* varv 56b: rubriken far hela bredden nar sektionen inte har nagon ingress,
   sa den ryms pa farre rader. Said 17/9. */
.head--ensam{grid-template-columns:1fr}
#montage .head{margin-bottom:38px}
#montage .head h2{max-width:none}  /* matt 17/9: texten behover 954 px, behallaren ger 1256. ch var fel enhet, 34ch blev 795 px */

/* varv 57: Instagram-rosterna bredvid produktens egna omdomen, i vansterspalten.
   Samma sprak som montaget men tatare, det har ar en sidoyta och inte huvudnumret. Said 17/9. */
.pig{margin-top:32px;padding-top:26px;border-top:1px solid var(--line)}
.pig .eyebrow{margin-bottom:18px}
.pig .mont__k{margin:0 0 18px;padding:0 0 18px;gap:9px}
.pig .mont__k:last-child{margin-bottom:0;padding-bottom:0;border-bottom:0}
.pig .mont__q{font-size:17px;line-height:1.42}
.pig .mont__q::before{font-size:28px}
@media (max-width:900px){.pig{margin-top:26px;padding-top:22px}}

/* varv 58: Said 17/9. */
/* produktkorten i guiden centreras nar de ar farre an fyra */
.rut__grid{display:flex;flex-wrap:wrap;justify-content:center;gap:16px}
.rut__grid>.rut__k{flex:0 1 calc((100% - 48px)/4);min-width:0}
@media (max-width:1180px){.rut__grid>.rut__k{flex-basis:calc((100% - 16px)/2)}}
@media (max-width:560px){.rut__grid>.rut__k{flex-basis:100%}}
/* mindre tomrum mellan sektionerna, hela sajten */
.sec{padding:clamp(34px,4vw,64px) 0}
/* Insight AI med markeringen fran CRM:et */
.insight-mark{gap:10px}
.insight-mark svg{width:31px;height:25px}
.insight-mark__text{letter-spacing:.01em}
/* varv 58b: loggan i CRM:ets djupa guld for ljusa ytor, footern med mindre tomrum ovanfor, kampanjtexten centrerad */
.insight-mark{gap:11px}
.insight-mark svg{width:40px;height:32px}
.foot .insight-mark svg{color:var(--ink)}
.foot{padding-top:clamp(56px,6vw,96px);background:linear-gradient(to bottom,transparent 0,#E6D7C6 140px)}

/* varv 60: prickarna mellan sidnumren */
.pag__el{display:inline-flex;align-items:center;justify-content:center;min-width:24px;min-height:44px;color:var(--ink);opacity:.6}
/* varv 60: startsidans blandade omdömen, mindre rutor och text som på produktsidan, Aida 15/9 15:17 */
#omdomen .quotes--pag{align-items:start}
#omdomen .q--sm blockquote{font-size:16px;line-height:1.45}
#omdomen .q--sm .mono a{color:inherit;text-decoration:underline;text-underline-offset:3px}
#omdomen .pag{justify-content:center}
/* varv 61: Din Nuni-rutin, ett flöde uppifrån och ner. Huden, svaret, produkterna, så här gör du. */
.page--profil{padding-top:clamp(96px,11vw,140px)}
.pr2{padding:0 0 clamp(56px,7vw,96px)}
.pr2 .wrap{display:flex;flex-direction:column;gap:clamp(28px,3.4vw,44px)}
.pr2__topp{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,4vw,64px);align-items:center}
.pr2__intro{display:flex;flex-direction:column;gap:14px;max-width:58ch}
.pr2__h1{margin:0;font-family:var(--f-disp);font-weight:400;font-size:clamp(44px,5.6vw,76px);line-height:1;letter-spacing:-.015em;color:var(--ink)}
.pr2__intro .rut__lead{font-size:18px;font-weight:400;line-height:1.65;margin:0}
.pr2__bild{margin:0;aspect-ratio:4/5;max-height:520px;border-radius:var(--r);overflow:hidden;background:var(--sand)}
.pr2__bild img{width:100%;height:100%;object-fit:cover;display:block}
.pr2__mer{margin-top:0}
.pr2__svar{display:flex;align-items:center;justify-content:space-between;gap:20px 32px;flex-wrap:wrap;padding:clamp(20px,2.6vw,30px) clamp(20px,3vw,36px);border-radius:var(--r);background:var(--ink);color:var(--white)}
.pr2__svar .eyebrow{color:var(--sand-2)}
.pr2__nuni{margin:6px 0 0;font-family:var(--f-disp);font-size:clamp(22px,2.4vw,30px);line-height:1.2;color:var(--white);max-width:34ch}
.pr2__svar .btn--dark{background:var(--white);color:var(--ink);border-color:var(--white);white-space:normal;text-align:center}
.pr2__block{display:flex;flex-direction:column;gap:14px}
.pr2__lista{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.pr2__rad{display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:22px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
.pr2__img{display:block;width:96px;height:96px;border-radius:10px;overflow:hidden;background:var(--sand)}
.pr2__img img{width:100%;height:100%;object-fit:cover;display:block}
.pr2__txt{display:flex;flex-direction:column;gap:6px;min-width:0}
.pr2__namn{font-family:var(--f-disp);font-size:21px;line-height:1.2;color:var(--ink);text-decoration:none}
.pr2__txt p{margin:0;font-size:15px;line-height:1.6;color:var(--mute);max-width:62ch}
.pr2__kop{display:flex;flex-direction:column;align-items:flex-end;gap:10px;text-align:right}
.pr2__hur{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(24px,4vw,56px);align-items:start}
.pr2__hur>.pr2__block:only-child{grid-column:1/-1}
.pr2__steg{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.pr2__steg li{padding:18px 20px;border-radius:var(--r);background:var(--white);border:1px solid var(--line)}
.pr2__nar{display:block;font-family:var(--f-disp);font-size:20px;color:var(--ink);margin-bottom:6px}
.pr2__steg p{margin:0;font-size:15px;line-height:1.6;color:var(--mute)}
.pr2 .rut__tank{margin:30px 0 0;max-width:none}
.pr2__slut{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
@media (max-width:900px){.pr2__topp,.pr2__hur{grid-template-columns:minmax(0,1fr)}.pr2__bild{aspect-ratio:16/10;max-height:none;order:-1}.pr2 .rut__tank{margin-top:0}}
@media (max-width:600px){.pr2__rad{grid-template-columns:72px minmax(0,1fr);gap:14px}.pr2__img{width:72px;height:72px}.pr2__kop{grid-column:2;align-items:flex-start;text-align:left;flex-direction:row;flex-wrap:wrap;align-items:center;gap:10px 14px}.pr2__svar-kop,.pr2__svar-kop .btn{width:100%}}
@media (max-width:600px){.pr2__rad{align-items:start}}
/* varv 62: Hur är din hud, sju bildrutor på en rad. Samma bild som på rutinsidan man hamnar på. */
.quiz--rutor{background:var(--white);border:0;border-radius:calc(var(--r) + 4px);padding:clamp(22px,2.6vw,34px);box-shadow:0 24px 60px -40px rgba(61,46,36,.55)}
.quiz--rutor .quiz__q h3{margin:0 0 18px;font-size:clamp(28px,2.8vw,38px);line-height:1.05}
.quiz__rad{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;flex-wrap:nowrap}
.quiz__rad>button{all:unset;box-sizing:border-box;display:flex;flex-direction:column;gap:8px;cursor:pointer;min-width:0;-webkit-tap-highlight-color:transparent}
.quiz__bild{display:block;aspect-ratio:3/4;height:auto;border-radius:12px;overflow:hidden;background:var(--sand);box-shadow:inset 0 0 0 1px var(--line);transition:transform .5s var(--ease),box-shadow .3s}
.quiz__bild img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s var(--ease)}
.quiz__namn{font-family:var(--f-disp);font-size:17px;line-height:1.15;color:var(--ink);transition:color .25s}
.quiz__under{margin-top:-5px;font-size:12px;line-height:1.35;color:var(--mute)}
.quiz__rad>button:hover .quiz__bild{transform:translateY(-3px);box-shadow:0 14px 26px -16px rgba(61,46,36,.6)}
.quiz__rad>button:hover .quiz__bild img{transform:scale(1.06)}
.quiz__rad>button:hover .quiz__namn{color:var(--terra)}
.quiz__rad>button:focus-visible .quiz__bild{outline:2px solid var(--terra);outline-offset:3px}
.quiz__rad>button:active .quiz__bild{transform:scale(.97)}
@media (max-width:1100px){.quiz__rad{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:108px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px;margin-inline:calc(clamp(22px,2.6vw,34px) * -1);padding-inline:clamp(22px,2.6vw,34px)}.quiz__rad::-webkit-scrollbar{display:none}.quiz__rad>button{scroll-snap-align:start}}
@media (prefers-reduced-motion:reduce){.quiz__bild,.quiz__bild img{transition:none}}
.quiz__svar[hidden]{display:none}
.hud>.quiz--rutor{grid-column:1/-1;margin:clamp(20px,3vw,40px) 0 0}
.quiz__namn{font-size:clamp(15px,1.35vw,19px);overflow-wrap:anywhere}
.quiz__rad{gap:clamp(10px,1.2vw,16px)}
@media (max-width:1100px){.quiz__rad{grid-auto-columns:120px;scroll-padding-inline:clamp(22px,2.6vw,34px)}}
.hud>.quiz--rutor,.quiz--rutor .quiz__q{min-width:0;max-width:100%}
/* varv 63: Hur är din hud, sidans första val. Grupp, sedan en bildruta per hudtyp, klicket öppnar rutinen. */
.valj{padding-bottom:0}
.valj__kort{background:var(--white);border-radius:calc(var(--r) + 6px);padding:clamp(22px,3vw,40px);box-shadow:0 30px 70px -48px rgba(61,46,36,.6)}
.valj__topp{display:flex;align-items:end;justify-content:space-between;gap:14px 32px;flex-wrap:wrap;margin-bottom:clamp(18px,2vw,26px)}
.valj__h{margin:0;font-family:var(--f-disp);font-weight:400;font-size:clamp(32px,3.4vw,48px);line-height:1;color:var(--ink)}
.valj__grupper{display:flex;gap:6px;flex-wrap:wrap}
.valj__g{min-height:44px;padding:0 18px;border:1px solid var(--line);border-radius:999px;background:transparent;font-family:var(--f-body);font-size:14px;font-weight:600;color:var(--ink);cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.valj__g:hover{border-color:var(--ink)}
.valj__g.is-on{background:var(--ink);border-color:var(--ink);color:var(--white)}
.valj__g:focus-visible{outline:2px solid var(--terra);outline-offset:2px}
.valj__rad{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:clamp(10px,1.2vw,16px)}
.valj__k{display:flex;flex-direction:column;gap:10px;min-width:0;color:var(--ink);text-decoration:none;-webkit-tap-highlight-color:transparent}
.valj__k[hidden]{display:none}
.valj__bild{display:block;aspect-ratio:2/3;height:auto;border-radius:12px;overflow:hidden;background:var(--sand);transition:transform .5s var(--ease),box-shadow .3s}
.valj__bild img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s var(--ease)}
.valj__t{font-family:var(--f-disp);font-size:clamp(15px,1.2vw,18px);line-height:1.2;overflow-wrap:anywhere;transition:color .25s}
.valj__k:hover .valj__bild{transform:translateY(-3px);box-shadow:0 14px 26px -16px rgba(61,46,36,.6)}
.valj__k:hover .valj__bild img{transform:scale(1.06)}
.valj__k:hover .valj__t{color:var(--terra)}
.valj__k:focus-visible{outline:none}.valj__k:focus-visible .valj__bild{outline:2px solid var(--terra);outline-offset:3px}
@media (max-width:1100px){.valj__rad{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:132px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:calc(clamp(22px,3vw,40px) * -1);padding-inline:clamp(22px,3vw,40px);scroll-padding-inline:clamp(22px,3vw,40px);padding-bottom:4px}.valj__rad::-webkit-scrollbar{display:none}.valj__k{scroll-snap-align:start}}
@media (max-width:560px){.valj__grupper{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(clamp(22px,3vw,40px) * -1);padding-inline:clamp(22px,3vw,40px)}.valj__grupper::-webkit-scrollbar{display:none}.valj__g{flex:0 0 auto}}
.valj,.valj__kort,.valj__rad{min-width:0;max-width:100%}
/* varv 63: hudkartan, figuren smalare och panelen mittställd bredvid, så ingen tom yta under listan */
@media (min-width:901px){.hud{grid-template-columns:minmax(240px,330px) minmax(0,1fr);align-items:center;row-gap:6px}.hud>.hud__topp{align-self:start}}
@media (prefers-reduced-motion:reduce){.valj__bild,.valj__bild img{transition:none}}
/* varv 63: rutinsidans hero kortare så Hur är din hud syns direkt under */
@media (min-width:901px){.phero--rutin{min-height:0;padding-bottom:clamp(24px,3vw,40px)}.phero--rutin h1{font-size:clamp(44px,4.4vw,66px);line-height:1.02}.phero--rutin .phero__img{max-height:420px}}
.phero--rutin + .page .valj,.page>.valj{padding-top:clamp(20px,2.5vw,36px)}
/* varv 64: rutinsidan i Aidas läsordning. Inledningen står ovanför stegen, rubriken klarar 52 tecken på två rader, bilden i fast format. */
.pr2__topp{align-items:start}
.pr2__intro{padding-top:clamp(0px,2vw,24px)}
.pr2__h1--lang{font-size:clamp(34px,3.3vw,48px);line-height:1.06;max-width:22ch;text-wrap:balance}
.pr2__h1{text-wrap:balance}
.pr2__bild{width:100%;max-width:440px;justify-self:end;aspect-ratio:4/5;height:auto;max-height:none}
.pr2__hur{grid-template-columns:minmax(0,1fr);gap:22px;padding:clamp(22px,2.6vw,34px);border-radius:var(--r);background:var(--white);border:1px solid var(--line)}
.pr2__steg-blk{display:flex;flex-direction:column;gap:14px;min-width:0}
.pr2__inledning{margin:0;max-width:66ch;font-size:17px;line-height:1.65;color:var(--ink)}
.pr2__steg li{background:var(--lin,#F3E8D8);border-color:transparent}
.pr2 .pr2__hur .rut__tank{margin:34px 0 0;background:transparent;border-radius:0}
.pr2__nuni{max-width:40ch}
@media (max-width:900px){.pr2__bild{max-width:none;justify-self:stretch;aspect-ratio:16/10}.pr2 .pr2__hur .rut__tank{margin-top:0}.pr2__intro{padding-top:0}}
.pr2__topp{align-items:center;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)}
.pr2__intro{padding-top:0}
.pr2__bild{max-width:380px}
.pr2__tummar{display:flex;align-items:center;gap:0;margin-top:10px}
.pr2__tummar img{width:52px;height:52px;border-radius:50%;object-fit:cover;border:2px solid var(--ink);margin-left:-10px;background:var(--sand)}
.pr2__tummar img:first-child{margin-left:0}
.pr2__tummar span{margin-left:14px;font-family:var(--f-disp);font-size:22px;color:var(--white)}
@media (max-width:900px){.pr2__topp{grid-template-columns:minmax(0,1fr)}.pr2__bild{max-width:none}}
/* varv 64: rollraderna centrerade, texten står mitt för bilden i stället för i överkant */
#roller .roll{align-items:center}
/* varv 65: kort text ska inte ge tomma ytor. Bilden följer textens höjd i stället för ett fast format, och ett ensamt steg står som en rad. */
@media (min-width:901px){
.pr2__topp{align-items:stretch}
.pr2__intro{align-self:center;padding-block:clamp(8px,1.5vw,20px)}
.pr2__bild{aspect-ratio:auto;height:auto;min-height:300px;max-height:520px;align-self:stretch}
.pr2__bild img{height:100%}
}
.pr2__steg li:only-child{display:grid;grid-template-columns:minmax(110px,auto) minmax(0,1fr);gap:4px 24px;align-items:baseline;padding:16px 20px}
.pr2__steg li:only-child .pr2__nar{margin:0}
@media (max-width:600px){.pr2__steg li:only-child{grid-template-columns:minmax(0,1fr)}}
.pr2__hur .pr2__steg{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
@media (min-width:901px){.pr2__bild{position:relative}.pr2__bild img{position:absolute;inset:0;width:100%;height:100%}}
/* varv 66: Gravid och Bebis, Nunis svar om graviditet och nyfödda bredvid kundernas egna ord */
.pr2__familj{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,56px);align-items:start}
.pr2__faq{display:flex;flex-direction:column;gap:12px;max-width:56ch}
.pr2__faq-h{margin:0;font-family:var(--f-disp);font-weight:400;font-size:clamp(24px,2.2vw,32px);line-height:1.15;color:var(--ink);text-wrap:balance}
.pr2__faq .rut__varfor{font-size:16px;line-height:1.7;margin:0}
.pr2__rost{display:flex;flex-direction:column;gap:12px;min-width:0}
.pr2__quotes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
.pr2__quotes .q{opacity:1;transform:none;margin:0}
.pr2__quotes .q blockquote{font-size:15px;line-height:1.5}
.pr2__quotes .mono a{color:inherit;text-decoration:underline;text-underline-offset:3px}
@media (max-width:900px){.pr2__familj,.pr2__quotes{grid-template-columns:minmax(0,1fr)}}
@media (min-width:901px){.pr2__faq{position:sticky;top:110px}}

/* Varv 69, 18/9. Said: Torr hy mot de övriga skiljer sig för starkt, ingen balans, flakigt och beta.
   Mätt i guide.json: 14 till 90 ord per rutin, 6,4 gångers spann. Materialet är Aidas och är ojämnt.
   Formen ska bära det, så alla femton läses i samma ordning med samma vikt, bara olika mycket i sig.
   Tänk på är inte längre en egen spalt bredvid stegen, den ligger under dem i full bredd. */
.pr2__hur{display:flex;flex-direction:column;gap:clamp(20px,2.2vw,28px)}
.pr2 .pr2__hur .rut__tank{margin:0;max-width:none;background:transparent;border-radius:0;border-left:3px solid var(--gold);padding:2px 0 2px 20px}
.pr2 .pr2__hur .rut__tank b{display:block;margin-bottom:2px}
/* ett ensamt steg ska väga lika mycket som ett par, inte läsas som en rest */
.pr2__steg li:only-child{grid-template-columns:minmax(0,1fr);gap:8px;padding:18px 20px}
.pr2__steg li:only-child .pr2__nar{margin:0}
/* samma kort runt Gravid och Bebis som runt stegen, så sidan inte byter form när Aida inte skrivit steg */
.pr2__familj{margin-top:clamp(20px,2.4vw,30px);padding:clamp(22px,2.6vw,34px);border-radius:var(--r);background:var(--white);border:1px solid var(--line)}
.pr2__faq-h{font-size:clamp(21px,1.7vw,26px)}
@media (max-width:900px){.pr2__familj{padding:20px}}
/* Varv 70, 18/9. Instagram-remsan ligger under hela omdömesblocket i stället för i spalten bredvid
   bläddringen, där den stod stilla medan höger sida bytte sida. Egen rad, samma bredd som sidan. */
#rev .pig{margin-top:clamp(28px,3vw,44px);padding-top:26px;border-top:1px solid var(--line)}
#rev .pig .mont__k{margin:0;padding:0;border-bottom:0}
@media (min-width:901px){#rev .pig{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:clamp(20px,2.6vw,38px);align-items:start}
#rev .pig .eyebrow{grid-column:1/-1;margin-bottom:0}}

/* Varv 83, Aida 19/9: tydliga rutinlänkar och ett stycke mindre luft. */
.rut__tank a{color:var(--ink);font-weight:600;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.rut__tank a:hover{color:var(--terra,var(--ink))}
.rut__tank a:focus-visible{outline:2px solid currentColor;outline-offset:4px;border-radius:2px}
.sec{padding:clamp(28px,3vw,48px) 0}
.sec--tight{padding:clamp(20px,2.8vw,36px) 0 0}
.stack{gap:14px}
.profil__p{padding:clamp(32px,4.8vw,72px) 0}
.pr2 .wrap{gap:clamp(22px,2.6vw,34px)}
.om-story{max-width:68ch;margin-inline:auto}
.sheet{background:#9B5B43}
.phero--om .phero__img{aspect-ratio:4/5;height:auto;max-width:380px;justify-self:center}.phero--om .phero__img img{object-position:center}
/* Varv 84. A personal sign-off, with the customer's original logo artwork. */
@font-face{font-family:NuniSignature;src:url('font/allura400.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
.founders{display:grid;grid-template-columns:minmax(0,1fr) 180px;align-items:center;gap:30px;padding:30px 0 16px;margin-top:8px;border-top:1px solid rgb(110 98 84 / .22)}
.founders__closing{font-family:var(--f-disp);font-size:clamp(21px,2.2vw,27px);line-height:1.4;color:var(--ink);text-wrap:balance}
.founders__signature{font-family:NuniSignature,cursive;font-size:clamp(48px,5.5vw,72px);font-weight:400;line-height:1.45;white-space:nowrap;color:var(--ink);margin:8px 0 -4px;transform:rotate(-4deg);transform-origin:left center}
.founders__signature span{font-size:.72em}
.founders__caption{font-size:11px;letter-spacing:.12em;text-transform:uppercase;line-height:1.8;color:var(--ink)}
.founders__seal{position:relative;padding-bottom:20px}
.founders__logo{display:block;width:100%;height:auto;overflow:visible}
.founders__tree,.founders__woman{transform-box:fill-box;transform-origin:50% 100%;animation-duration:12s;animation-timing-function:cubic-bezier(.45,0,.55,1);animation-iteration-count:infinite;animation-play-state:paused}
.founders__tree{animation-name:nuni-tree-breeze}
.founders__woman{animation-name:nuni-woman-sway}
.founders.is-playing .founders__tree,.founders.is-playing .founders__woman{animation-play-state:running}
@keyframes nuni-tree-breeze{0%,100%{transform:rotate(0deg) skewX(0deg)}25%{transform:rotate(.8deg) skewX(.5deg)}65%{transform:rotate(-1deg) skewX(-.6deg)}}
@keyframes nuni-woman-sway{0%,100%{transform:rotate(0deg)}30%{transform:rotate(-1.8deg)}70%{transform:rotate(1deg)}}
.founders__motion{position:absolute;right:-12px;bottom:-24px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:transparent;color:var(--mute);cursor:pointer}
.founders__motion[hidden]{display:none}
.founders__motion svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.founders__motion:focus-visible{outline:1px solid currentColor;outline-offset:0;border-radius:50%}
.founders__play,.founders__motion[aria-pressed=true] .founders__pause{display:none}
.founders__motion[aria-pressed=true] .founders__play{display:block}
@media(max-width:600px){.founders{grid-template-columns:minmax(0,1fr) 112px;gap:16px;padding-top:24px}.founders__signature{font-size:44px}.founders__closing{font-size:22px}.founders__caption{font-size:9px;letter-spacing:.08em}.founders__seal{padding-bottom:0}}
@media(max-width:359px){.founders{grid-template-columns:minmax(0,1fr) 90px;gap:12px}.founders__signature{font-size:34px}.founders__closing{font-size:20px}.founders__caption{font-size:8px}}
@media(prefers-reduced-motion:reduce){.founders__tree,.founders__woman{animation:none}.founders__motion{display:none}}

/* Varv 85: keep the hero transition behind the routine chooser, not over its text. */
.phero--rutin + .page > .valj{z-index:1}
.valj__k[href*="hud=gravid"] img,.pr2[data-h="gravid"] .pr2__bild img{object-position:35% center}

/* Varv 86: decorative section fades stay behind content on every page. */
.phero + .page > section{position:relative;z-index:1}
.valj__rad{grid-template-columns:repeat(9,minmax(0,1fr))}
@media(max-width:1100px){.valj__rad{grid-template-columns:none}}
/* Headings keep their full ink colour while the surrounding surfaces blend. */
.page h1,.page h2,.page h3{ text-wrap:balance }
/* Preview-only menu palette, chosen via a shareable query parameter. */
body[data-meny="nougat"] .sheet{background:#795C49}
body[data-meny="sandbrun"] .sheet{background:#71604E}

.valj{scroll-margin-top:100px}

.pr2__h1{overflow-wrap:anywhere;hyphens:auto}

/* Aida20sep: sista finputs, lokal verifiering före publicering. */
.sheet,.sheet a,.sheet__tile span,.sheet__btn,.sheet__btn b{color:#F7EBDB}
.tri3__k--symbol .nuni-mark{display:block;width:150px;height:110px;object-fit:contain;margin:0 auto 20px}
@media(max-width:600px){
 #kvinna-ravara-du .pillars{gap:16px;padding:18px 0}
 #kvinna-ravara-du .pillar{grid-template-columns:88px minmax(0,1fr);gap:12px}
 #kvinna-ravara-du .pillar .nuni-mark--bild{width:76px;max-width:76px;max-height:64px}
 #kvinna-ravara-du .pillar h2{font-size:23px;margin-bottom:4px}
 #kvinna-ravara-du .pillar p{font-size:13px;line-height:1.45}
}
.pd__acc .acc__in p{margin:0 0 12px;padding:0}
.pd__acc .acc__in p:last-child{margin-bottom:0}
.pd__acc .acc__h{margin-top:16px;margin-bottom:6px}
.pd__acc .acc__in{padding-bottom:16px}

/* Aida20sep: samma varma, ljusare bruna ton i kampanj och rutin. */
.kamp,.pr2__svar{background:#795C49;color:#F7EBDB}
.kamp__body p,.kamp__row s,.kamp__row .mono{color:#F7EBDB}
/* byggrapport 25: Aidas rad under rubriken, vad paketet innehåller */
.kamp__body .kamp__inne{font-weight:600;margin-top:-6px}
.pr2__nuni,.pr2__svar .eyebrow{color:#F7EBDB}
/* Kundens två stående Kenya-original behöver plats för både vuxen och barn. */
.pr2[data-h="gravid"] .pr2__bild,.pr2[data-h="bebis"] .pr2__bild{aspect-ratio:2/3;align-self:start;min-height:0;max-height:none;height:auto}
.pr2[data-h="gravid"] .pr2__bild img,.pr2[data-h="bebis"] .pr2__bild img{object-position:center;position:static;height:auto;aspect-ratio:2/3}

/* Mobilpolish 20/9: stadig navigation och alla val inom skärmen. */
.nav.is-hidden{transform:none}
html{scroll-padding-top:calc(var(--nav-h) + 16px)}
@media(max-width:1100px){
 .valj__rad{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-flow:row;grid-auto-columns:auto;overflow:visible;scroll-snap-type:none;margin-inline:0;padding-inline:0}
 .hud__topp .chips--zon{flex-wrap:wrap;overflow:visible}
}
@media(max-width:800px){.valj__rad{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){
 .nav,.nav.is-solid,.is-dark .nav:not(.is-solid){background:#F3E8D8;color:var(--ink);box-shadow:0 1px 0 rgba(85,61,43,.16);gap:12px;padding-inline:20px}
 .nav__right{gap:10px}
 .nav__brand img{max-height:46px;width:auto}
 .is-dark .nav:not(.is-solid) .nav__brand img{filter:none}
 .nav__cart,.nav__burger{width:44px;height:44px;border:1px solid rgba(85,61,43,.16);border-radius:50%;justify-content:center}
 .nav__n{background:transparent;color:var(--ink);font-size:14px}
 body.menu-open .nav{background:transparent;box-shadow:none;color:#F7EBDB}
 body.menu-open .nav__brand img{filter:brightness(0) invert(1)}
 body.menu-open .nav__n{color:#F7EBDB}
 body.menu-open .nav__cart,body.menu-open .nav__burger{border-color:rgba(247,235,219,.3)}
 .phero--butik .filters,.valj__grupper,.hud__topp .chips--zon{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;min-width:0;overflow:visible;margin-inline:0;padding-inline:0}
 .phero--butik .filters>.mono{grid-column:1/-1;width:auto;margin:0 0 4px}
 .phero--butik .filters>.n{margin:4px 0 0}
 .phero--butik .filters button,.valj__g,.hud__topp .chips--zon>button{width:100%;min-width:0;min-height:44px;padding:10px 12px;white-space:normal;line-height:1.3;text-align:center;font-size:13px;border-radius:14px}
 .valj__kort{padding:20px}
 .valj__topp{gap:18px}
 .valj__grupper{padding:0;margin:0}
 .valj__rad{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}
 .valj__bild{aspect-ratio:4/5}
 .valj__t{font-size:18px;line-height:1.2;overflow-wrap:normal}
}

/* Byggorder 26, Aida 23/9 (id 3811): kampanjytan med inledning, två lika höga kort sida vid sida från 901 px, bild överst */
.kamp__intro{max-width:780px;margin-bottom:clamp(24px,3vw,40px)}
.kamp__intro h2{font-size:clamp(30px,3.4vw,48px);margin:8px 0 0}
.kamp__intro p{color:var(--ink-2);font-size:17px;max-width:52ch}
.kamp__grid{display:grid;grid-template-columns:1fr;gap:24px;align-items:stretch}
.kamp__grid .kamp{grid-template-columns:1fr;grid-template-rows:auto 1fr;height:100%}
.kamp__grid .kamp__img{aspect-ratio:3/2;min-height:0;border-radius:0}
.kamp__grid .kamp__img img{height:100%;min-height:0;aspect-ratio:auto;object-fit:cover;border-radius:0}
.kamp__grid .kamp__body{padding:clamp(22px,2.6vw,40px);gap:12px;justify-content:flex-start}
.kamp__grid .kamp__body h2{font-size:clamp(28px,2.8vw,44px)}
.kamp__grid .kamp__row b{font-size:clamp(36px,3vw,44px);line-height:1}
.kamp__grid .kamp__body .kamp__inne{margin-top:0}
.kamp__grid .row-btn{margin-top:auto;padding-top:8px}
.kamp__ord{color:#F7EBDB;font-size:15px}
.kamp__body .eyebrow{color:#EEDCC6}
.kamp__body .eyebrow::before{background:#EEDCC6}
.kamp__frakt{margin-top:clamp(20px,2.4vw,32px)}
.kamp__yta{margin-top:clamp(48px,6vw,88px)}
@media (min-width:901px){.kamp__grid{grid-template-columns:1fr 1fr}}
/* toningen från sektionen under, .sec--sage::before med top:-160px, målas inte längre över korten */
#kampanj{position:relative;z-index:1}

/* Byggorder 28, Said 23/9 03:4x: höstkampanjen som eget inslag. Glöd ur terrakotta och sand bakom scenen, Aidas slagrad överst,
   tyngre bild och pris i korten, popupen på startsidan. Samma palett och typsnitt, kornet ligger kvar ovanpå allt (body::after). */
#kampanj.sec{isolation:isolate;padding:clamp(56px,7vw,112px) 0}
.kamp__yta{position:relative;isolation:isolate}
.kamp__glod{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;-webkit-mask-image:radial-gradient(120% 90% at 50% 55%,#000 55%,transparent 100%);mask-image:radial-gradient(120% 90% at 50% 55%,#000 55%,transparent 100%)}
.kamp__yta>.kamp__glod{inset:calc(-1 * clamp(32px,5vw,72px)) calc(-1 * var(--gutter))}
.kamp__glod i{position:absolute;inset:-20% -12%;background:radial-gradient(38% 42% at 28% 62%,rgba(192,111,86,.30),transparent 72%),radial-gradient(34% 40% at 74% 48%,rgba(201,169,136,.50),transparent 74%),radial-gradient(55% 50% at 52% 70%,rgba(215,161,148,.30),transparent 78%),radial-gradient(70% 60% at 50% 40%,rgba(230,215,198,.55),transparent 80%);animation:kamp-glod 26s ease-in-out infinite alternate;will-change:transform}
.kamp__glod i+i{background:radial-gradient(30% 34% at 64% 30%,rgba(192,111,86,.22),transparent 72%),radial-gradient(28% 32% at 36% 38%,rgba(226,180,120,.26),transparent 74%);animation-duration:22s;animation-direction:alternate-reverse;opacity:.9}
@keyframes kamp-glod{from{transform:translate3d(-4%,2%,0) scale(1);opacity:.85}to{transform:translate3d(4%,-3%,0) scale(1.08);opacity:1}}
@media (prefers-reduced-motion:reduce){.kamp__glod i{animation:none}}

.kamp__intro{max-width:none;margin-bottom:clamp(28px,3.4vw,48px)}
.kamp__intro .eyebrow,.kamp__frakt{color:#5E4536}
.kamp__intro .kamp__slag{font-family:var(--f-disp);font-size:clamp(44px,7vw,104px);line-height:.98;letter-spacing:-.02em;color:var(--ink);margin:14px 0 0;text-wrap:balance}
.kamp__intro .kamp__lede{color:#5E4536;font-size:clamp(16.5px,1.3vw,18px);line-height:1.7;max-width:52ch;margin:18px 0 0}
.kamp__intro h2{font-size:clamp(22px,2.1vw,30px);line-height:1.2;max-width:34ch;margin:clamp(28px,3.4vw,48px) 0 0;color:var(--ink)}
@media (min-width:901px){
 .kamp__intro{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);column-gap:clamp(40px,6vw,104px);align-items:end}
 .kamp__intro .eyebrow{grid-column:1/-1}
 .kamp__slag{grid-column:1;grid-row:2;align-self:end}
 .kamp__lede{grid-column:2;grid-row:2}
 .kamp__intro h2{grid-column:1/-1;grid-row:4}
}

.kamp__grid{margin-inline:calc(-1 * min(var(--gutter) - 8px,48px));gap:clamp(16px,2vw,28px)}
.kamp__grid .kamp{border-radius:16px;box-shadow:0 34px 70px -38px rgba(98,52,34,.65),0 0 0 1px rgba(122,74,50,.10);transition:opacity .6s ease,transform .6s var(--ease),box-shadow .6s var(--ease)}
.kamp__grid .kamp__img{position:relative}
.kamp__grid .kamp__img::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(61,46,36,.34),transparent 42%),radial-gradient(120% 90% at 50% 40%,transparent 60%,rgba(61,46,36,.22));pointer-events:none}
.kamp__grid .kamp__img img{transition:transform 1.4s var(--ease)}
.kamp__grid .kamp__row{flex-wrap:wrap;gap:6px 14px;align-items:baseline}
.kamp__grid .kamp__row b{font-size:clamp(52px,5.2vw,76px);line-height:.95;letter-spacing:-.02em;color:#FBE6CC}
.kamp__spar{align-self:center;font-weight:600;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);background:#EEDCC6;border-radius:999px;padding:5px 12px 4px;line-height:1.4}
/* temat sätter --deep till sand i varv 17, vit text på den ger 2,2 i kontrast. Korten får en ljus knapp, popupen terrakotta. */
.kamp__grid .btn--gold,.kamp__grid .btn--dark{background:#FBE6CC;border-color:#FBE6CC;color:var(--ink)}
.kamp__grid .btn--gold::after,.kamp__grid .btn--dark::after{background:var(--ink)}
.kamp__grid .btn--gold:hover,.kamp__grid .btn--dark:hover{color:#FBE6CC}
.kpop .btn--gold{background:#8A4636;border-color:#8A4636;color:#fff}.kpop .btn--gold::after{background:var(--ink)}
.kamp__grid .btn{transition:color .45s var(--ease),border-color .45s,box-shadow .45s var(--ease),transform .16s var(--ease)}
.kamp__grid .btn:hover{box-shadow:0 0 0 1px rgba(251,230,204,.35),0 12px 34px -8px rgba(226,150,110,.8)}
.kamp__grid .btn:active,.kpop .btn:active{transform:scale(.97)}
.kpop .btn{transition:color .45s var(--ease),box-shadow .45s var(--ease),transform .16s var(--ease)}
.kpop .btn:hover{box-shadow:0 12px 30px -10px rgba(138,70,54,.75)}
@media (hover:hover) and (pointer:fine){
 .kamp__grid .kamp:hover{transform:translateY(-4px);box-shadow:0 44px 80px -40px rgba(98,52,34,.75),0 0 0 1px rgba(192,111,86,.22)}
 .kamp__grid .kamp:hover .kamp__img img{transform:scale(1.035)}
}
@media (prefers-reduced-motion:reduce){.kamp__grid .kamp,.kamp__grid .kamp__img img{transition:none;transform:none}.kamp__grid .btn{transition:none}.kamp__grid .kamp:hover{transform:none}.kamp__grid .kamp:hover .kamp__img img{transform:none}}
.kamp__slut{font-family:var(--f-disp);font-size:clamp(22px,2.2vw,32px);line-height:1.3;color:var(--ink);max-width:40ch;margin:clamp(36px,4.4vw,64px) 0 0;text-wrap:balance}
.kamp__slut+.kamp__frakt{margin-top:14px}

/* popupen, bara startsidan */
.kpop{padding:0;border:0;background:transparent;color:var(--ink);width:min(880px,calc(100% - 24px));max-width:none;max-height:calc(100dvh - 24px);overflow:visible}
.kpop[open]{animation:kpop-horn .38s var(--ease);transform-origin:100% 100%}
/* byggorder 29: dimman ljusare och utan egen oskärpa, så att glaset har sidan att läsas mot */
.kpop::backdrop{background:rgba(61,46,36,.2);animation:kpop-dimma .38s ease}
/* kortet stiger ur flikens hörn på dator, som ett ark nerifrån på mobil */
@keyframes kpop-horn{from{opacity:0;transform:translate(28px,36px) scale(.965)}to{opacity:1;transform:none}}
@keyframes kpop-ark{from{opacity:0;transform:translateY(56px)}to{opacity:1;transform:none}}
@keyframes kpop-dimma{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.kpop[open],.kpop::backdrop{animation:none}}
html:has(.kpop[open]){overflow:hidden}
.kpop__in{position:relative;isolation:isolate;display:grid;grid-template-columns:1fr 1fr;background:var(--lin);border-radius:14px;overflow:hidden;box-shadow:0 40px 90px -30px rgba(40,24,16,.6);max-height:calc(100dvh - 24px);overflow-y:auto}
.kpop__img{margin:0;position:relative;min-height:100%}
.kpop__img img{width:100%;height:100%;object-fit:cover}
.kpop__body{padding:clamp(28px,3.6vw,48px);display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.kpop__body .eyebrow{color:#4A3528}
.kpop__body h2{font-size:clamp(34px,3.6vw,48px);line-height:1;letter-spacing:-.015em}
.kpop__erb{display:flex;flex-direction:column;gap:6px;width:100%;margin-top:4px;padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.kpop__erb li{font-size:16.5px;line-height:1.45;color:var(--ink)}
.kpop__erb b{font-family:var(--f-disp);font-weight:400;font-size:19px;color:#6B2F22;white-space:nowrap}
.kpop__frakt{font-size:15px;color:#4A3528}
.kpop__body .row-btn{margin-top:6px;gap:10px 22px}
.kpop__nej::after{display:none}
.kpop__sign{font-size:14px;color:#4A3528;line-height:1.4;margin-top:4px}
.kpop__sign span{display:block;font-family:NuniSignature,var(--f-em);font-size:30px;line-height:1.1;color:var(--ink)}
.kpop__x{position:absolute;top:10px;right:10px;z-index:2;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:rgba(252,248,242,.9);color:var(--ink);box-shadow:0 6px 18px -8px rgba(40,24,16,.5);transition:transform .3s var(--ease),background .3s}
.kpop__x:hover{transform:rotate(90deg)}
.kpop__x:focus-visible,.kpop__nej:focus-visible,.kpop .btn:focus-visible{outline:2px solid #8A4636;outline-offset:3px}
@media (prefers-reduced-motion:reduce){.kpop__x{transition:none}.kpop__x:hover{transform:none}}
@media (max-width:700px){
 .kpop{width:calc(100% - 16px);margin:auto auto calc(8px + env(safe-area-inset-bottom))}
 .kpop[open]{animation:kpop-ark .38s var(--ease)}
 .kpop__in{grid-template-columns:1fr;grid-auto-rows:max-content;border-radius:22px;max-height:calc(100dvh - 24px - env(safe-area-inset-bottom))}
 .kpop__img{aspect-ratio:3/2;min-height:0}
 .kpop__body{padding:22px 22px 24px;gap:10px}
 .kpop__body h2{font-size:34px}
 .kpop__erb li{font-size:15.5px}
 .kpop__sign span{font-size:26px}
}

/* Byggorder 29, Aida 23/9 21:31 (id 3895): kampanjen står direkt under filmen. Skarven får ett varmt ljus som spiller ut ur filmens nederkant
   och en mjuk skugga på sanden, så att övergången läses som avsiktlig. Luften ovanför kampanjen blir en, inte filmens plus sektionens. */
.film + .page > #kampanj.sec{padding-top:clamp(44px,5.6vw,84px)}
.film + .page > #kampanj::before{content:"";position:absolute;left:0;right:0;top:0;height:clamp(140px,18vw,260px);z-index:-1;pointer-events:none;background:radial-gradient(55% 100% at 50% 0,rgba(192,111,86,.20),transparent 72%),linear-gradient(to bottom,rgba(61,46,36,.13),rgba(61,46,36,.04) 38%,rgba(61,46,36,0))}
/* Byggorder 29, Aida 23/9 21:31 (id 3895): popupen blir en flik nertill på startsidan, bara där. Fliken och kortet är frostat glas i linnets ton,
   glöden ur 28 lyser igenom kortet. Utan stöd för backdrop-filter är båda massivt linne som förut. Inget annat på sajten får glas. */
.kflik{position:fixed;z-index:45;left:0;right:0;bottom:calc(12px + env(safe-area-inset-bottom));margin-inline:auto;width:max-content;max-width:calc(100% - 24px);display:flex;align-items:center;padding:5px;border-radius:999px;background:var(--lin);border:1px solid rgba(122,74,54,.14);color:var(--ink);box-shadow:0 18px 40px -20px rgba(98,52,34,.55),0 2px 8px -2px rgba(61,46,36,.14);opacity:0;transform:translateY(14px);transition:opacity .3s var(--ease),transform .3s var(--ease)}
.kflik[hidden]{display:none}
.kflik.is-in{opacity:1;transform:none}
.kflik__knapp{display:flex;align-items:center;gap:11px;min-width:0;min-height:44px;padding:0 14px 0 0;border:0;border-radius:999px;background:none;color:inherit;font-family:var(--f-body);font-size:14px;font-weight:600;line-height:1.25;letter-spacing:.005em;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
.kflik__bild{flex:none;position:relative;width:44px;height:44px;border-radius:50%;overflow:hidden;background:var(--sand);box-shadow:0 0 0 1.5px rgba(255,251,245,.8),0 6px 14px -6px rgba(61,46,36,.6)}
.kflik__bild img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(2.4);transform-origin:81% 52%;transition:transform .6s var(--ease)}
.kflik__t{min-width:0;text-wrap:balance}
.kflik__x{flex:none;position:relative;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:none;color:#5E4536;cursor:pointer;transition:background-color .25s ease,color .25s ease;-webkit-tap-highlight-color:transparent}
.kflik__x::before{content:"";position:absolute;left:-1px;top:12px;bottom:12px;width:1px;background:rgba(61,46,36,.16)}
.kflik__knapp:focus-visible,.kflik__x:focus-visible{outline:2px solid #8A4636;outline-offset:2px}
.kflik__knapp:active .kflik__bild{transform:scale(.94)}
.kflik__bild{transition:transform .16s var(--ease)}
@media (hover:hover) and (pointer:fine){
 .kflik__knapp:hover .kflik__bild img{transform:scale(2.6)}
 .kflik__knapp:hover .kflik__t{color:#8A4636}
 .kflik__x:hover{background:rgba(61,46,36,.08);color:var(--ink)}
}
@media (min-width:701px){.kflik{left:auto;right:28px;bottom:28px;margin:0}.kpop__body{justify-content:center}}
@media (max-width:359px){.kflik__knapp{font-size:13.5px;gap:9px;padding-right:10px}}
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.kflik{background:rgba(247,238,226,.62);border-color:rgba(255,251,245,.7);-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);box-shadow:inset 0 1px 0 rgba(255,255,255,.65),inset 0 0 0 1px rgba(255,255,255,.14),0 18px 40px -20px rgba(98,52,34,.55),0 2px 8px -2px rgba(61,46,36,.14)}.kpop__in{background:rgba(247,238,226,.72);border:1px solid rgba(255,251,245,.62);-webkit-backdrop-filter:blur(30px) saturate(1.5);backdrop-filter:blur(30px) saturate(1.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 0 0 1px rgba(255,255,255,.14),0 40px 90px -30px rgba(98,52,34,.5)}}
@media (prefers-reduced-motion:reduce){.kflik,.kflik__bild,.kflik__bild img,.kflik__x{transition:none}.kflik{transform:none}.kpop[open],.kpop::backdrop{animation:none}}

/* bygge 31, varv tre, Said 24/9: "kollage som spelar animerat", band, fun, elegant. Svaren på Aidas fråga glider i två band
   som korsar varandra, terrakotta och mörkt. Ovanför flyter ett kollage av Nunis egna bilder in och andas med skrollet.
   Skriptet sköter all rörelse. Utan skript och vid reducerad rörelse står kollaget still och banden går att svepa. */
.rostband{position:relative;overflow:clip}
.rostband__topp{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(24px,4vw,64px);align-items:center}
.rostband .head{margin:0}
.kollage{position:relative;height:clamp(320px,33vw,480px)}
.kollage__b{position:absolute;left:var(--x);top:var(--y);width:var(--w);aspect-ratio:var(--ar);object-fit:cover;border-radius:clamp(12px,1.2vw,18px);
 box-shadow:0 28px 50px -28px rgba(61,46,36,.6),0 2px 6px rgba(61,46,36,.08);transform:rotate(var(--r));will-change:transform;cursor:default}
.kollage__b--1{--x:0%;--y:10%;--w:36%;--ar:4/5;--r:-6deg;z-index:2}
.kollage__b--2{--x:30%;--y:0%;--w:27%;--ar:3/4;--r:4deg;z-index:3}
.kollage__b--3{--x:58%;--y:6%;--w:38%;--ar:4/5;--r:-3deg;z-index:2}
.kollage__b--4{--x:16%;--y:56%;--w:24%;--ar:1/1;--r:5deg;z-index:4}
.kollage__b--5{--x:44%;--y:48%;--w:22%;--ar:4/5;--r:-5deg;z-index:5}
.kollage__b--6{--x:66%;--y:60%;--w:30%;--ar:5/4;--r:3deg;z-index:4}
.rband-yta{position:relative;padding:clamp(34px,5vw,80px) 0 clamp(20px,3vw,44px)}
.rband{position:relative;width:120vw;margin-left:-10vw;overflow:hidden;padding:clamp(14px,1.4vw,20px) 0}
.rband--a{background:#8A4636;color:#F7EDE0;transform:rotate(-2.4deg);z-index:1}
.rband--b{background:#3D2E24;color:#EEDFCB;transform:rotate(1.9deg);margin-top:clamp(12px,3.4vw,50px);z-index:2;box-shadow:0 18px 40px -24px rgba(30,20,14,.7)}
.rband__spar{display:flex;width:max-content;will-change:transform}
.bandrost{flex:none;display:flex;align-items:center;gap:clamp(14px,1.4vw,20px);margin:0;padding:0 clamp(26px,3vw,52px) 0 0}
.bandrost__puck{flex:none;width:clamp(46px,4.4vw,64px);height:clamp(46px,4.4vw,64px);border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px rgba(247,237,224,.35)}
.bandrost .rost__q{margin:0;font-family:var(--f-disp);font-weight:400;color:inherit;white-space:nowrap;font-size:clamp(20px,2.2vw,32px);line-height:1.1;letter-spacing:-.01em}
.bandrost .rost__hang{color:#F2B9A2;margin-right:.08em}
.rband--b .rost__hang{color:#D98C73}
.bandrost__txt{display:flex;align-items:baseline;gap:clamp(12px,1.2vw,18px);white-space:nowrap}
.bandrost .rost__meta{display:flex;align-items:center;gap:12px;margin:0;font-size:12px;color:inherit;opacity:.78;white-space:nowrap}
.bandrost .rost__alias{color:inherit;font-size:13px;font-weight:700;letter-spacing:.04em}
.bandrost .rost__kalla{min-height:24px;padding-block:10px;margin-block:-10px;color:inherit;text-decoration:underline;text-decoration-color:rgba(247,237,224,.35);text-underline-offset:3px}
.bandrost .rost__kalla:hover{text-decoration-color:currentColor}
.bandrost .rost__gilla{color:inherit}
.rost__alias{font-weight:700}.rost__kalla{color:var(--ink-2)}
.rost__gilla{display:inline-flex;align-items:center;gap:5px;font-weight:600}
.rost__gilla::before{content:"";width:10px;height:10px;background:currentColor;flex:none;clip-path:polygon(50% 100%,8% 56%,8% 28%,29% 12%,50% 28%,71% 12%,92% 28%,92% 56%)}
.rostband__fot{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:clamp(10px,1.6vw,22px)}
.rband__paus{flex:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:none;cursor:pointer;display:grid;place-items:center;color:var(--ink);transition:border-color .3s}
.rband__paus:hover{border-color:rgba(61,46,36,.45)}
.rband__paus:focus-visible{outline:2px solid #8A4636;outline-offset:3px}
.rband__paus i{width:10px;height:12px;border-inline:3px solid currentColor;box-sizing:border-box}
.rband__paus.is-pausad i{width:0;height:0;border:0;border-left:10px solid currentColor;border-block:6px solid transparent;margin-left:3px}
/* utan skript eller vid reducerad rörelse: banden går att svepa */
.rband:not(.is-live){overflow-x:auto;scrollbar-width:none}
.rband:not(.is-live)::-webkit-scrollbar{display:none}
/* produktsidan: ett band i terrakotta, rakt och rundat, inne i spalten */
#rev .pig{display:block}
.rband-yta--en{padding:18px 0 0}
/* nästa sektions bakgrund (.sec--sand::before, site.css rad 599) når 160 px upp och la sig över bandet */
#rev{position:relative;z-index:2}
.rband-yta--en .rband{width:auto;margin:0;transform:none;border-radius:clamp(14px,1.4vw,20px)}
.rband-yta--en .bandrost .rost__q{font-size:clamp(19px,1.7vw,24px)}
@media (max-width:900px){
 .rostband__topp{grid-template-columns:1fr}
 .kollage{height:clamp(240px,64vw,340px);margin-top:4px}
 .rband--b{margin-top:14px}
}
@media (max-width:640px){.bandrost .rost__meta{gap:9px}.rostband__fot{margin-top:6px}}

/* bygge 31, Nuur 3917: varukorgen på mobilen, en papperspåse, ordet Korg och antalet i en liten stämpel */
.nav__pase{display:none;width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round;flex:none}
.nav__kort{display:none}
@media(max-width:1180px){.nav__pase,.nav__cart .nav__kort{display:inline-block}}
@media(max-width:600px){
 .nav__cart{width:auto;padding:0 8px 0 14px;border-radius:999px;gap:7px;letter-spacing:.1em;font-size:11px}
 .nav__cart .nav__n{min-width:24px;height:24px;background:#8A4636;color:#F7EDE0;font-size:12px;font-weight:700;letter-spacing:0}
 .nav__cart .nav__n.is-on{transform:scale(1.22) rotate(-8deg)}
 body.menu-open .nav__cart .nav__n{background:#F7EBDB;color:#8A4636}
}
@media(max-width:340px){.nav__cart .nav__kort{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.nav__cart{padding:0 8px 0 11px}}

/* bygge 31, Said 24/9: "något storslaget här", sedan "rulla som i Livsstil24-gruppens sektion 2". En akt på hel skärm.
   Till vänster en mosaik av omdömen och Nunis egna bilder i sex kolumner som rullar upp och ner i olika fart, till höger
   betyget i en panel. På dator låses akten när den nått toppen, panelen glider ut och mosaiken öppnar sig och zoomar ut.
   Kolumnerna rullar med CSS och stannar under muspekaren. Paus för hela mosaiken. */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* utan skript, vid reducerad rörelse och på smal skärm: panelen överst och mosaiken under. Låsningen och öppningen
   gäller bara när skriptet satt is-live på en bred skärm (granskning 51). */
.omdakt{position:relative;padding:0;background:#EFE4D6}
.omdakt__fast{position:relative;display:flex;flex-direction:column-reverse}
.omdakt__mosaik{position:relative;height:72svh;overflow:hidden;background:#EFE4D6}
.omdakt__mosaik::before,.omdakt__mosaik::after{content:"";position:absolute;left:0;right:0;height:16vh;z-index:3;pointer-events:none}
.omdakt__mosaik::before{top:0;background:linear-gradient(#EFE4D6,rgba(239,228,214,0))}
.omdakt__mosaik::after{bottom:0;background:linear-gradient(rgba(239,228,214,0),#EFE4D6)}
.mgrid{position:absolute;inset:-6% 0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;padding:0 14px;--mskala:1.42;transform-origin:0 50%}
@media (min-width:901px){
 .omdakt__fast{max-width:var(--max);margin:0 auto}
 .omdakt.is-live{height:190svh}
 .omdakt.is-live .omdakt__fast{display:block;position:sticky;top:calc(var(--nav-h) + 16px);height:calc(100svh - var(--nav-h) - 32px);overflow:hidden;max-width:var(--max);margin:0 auto;border-radius:28px}  /* Said 25/9: akten i linje med sidans ram */
 .omdakt.is-live .omdakt__mosaik{position:absolute;inset:0;height:auto;--klipp:50;clip-path:inset(0 calc(var(--klipp) * 1%) 0 0);will-change:clip-path}
 .omdakt.is-live .mgrid{inset:-8% 0;transform:scale(var(--mskala));will-change:transform}
 .omdakt.is-live .omdakt__panel{position:absolute;top:0;right:0;bottom:0;width:50%;padding:40px clamp(28px,5vw,96px);will-change:transform}
}
.mkol{overflow:hidden;min-width:0}
.mtrack{display:flex;flex-direction:column;animation:mrulla var(--tid,60s) linear infinite}
.mkol:nth-child(even) .mtrack{animation-direction:reverse}
.mkol--1{--tid:62s}.mkol--2{--tid:78s}.mkol--3{--tid:54s}.mkol--4{--tid:88s}.mkol--5{--tid:68s}.mkol--6{--tid:96s}
@keyframes mrulla{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,-50%,0)}}
.mkol:hover .mtrack,.mkol:focus-within .mtrack,.omdakt.is-pausad .mtrack{animation-play-state:paused}
.mhalv{display:flex;flex-direction:column;gap:14px;padding-bottom:14px}
.mb{margin:0;overflow:hidden;border-radius:16px;background:var(--sand-2)}
.mb img{display:block;width:100%;height:100%;object-fit:cover}
.mb--hog{aspect-ratio:72/100}.mb--ruta{aspect-ratio:1/1}.mb--valv{aspect-ratio:72/96;border-radius:999px 999px 16px 16px}
.vk{margin:0;padding:16px 16px 14px;border-radius:16px;background:rgba(252,247,240,.86);border:1px solid rgba(255,252,247,.9);box-shadow:0 14px 30px -26px rgba(61,46,36,.6)}
.vk .stars{margin:0 0 9px}
.vk blockquote{margin:0;font-family:var(--f-body);font-size:13.5px;line-height:1.55;color:var(--ink);text-wrap:pretty}
.vk figcaption{display:flex;flex-direction:column;gap:2px;margin-top:11px}
.vk__namn{font-size:13px;font-weight:700;color:var(--ink)}
.vk__kalla{font-size:11.5px;color:var(--ink-2)}
.vk__kalla a{color:#8A4636;text-decoration:underline;text-decoration-color:rgba(138,70,54,.35);text-underline-offset:3px;padding-block:12px;margin-block:-12px}
.omdakt__panel{position:relative;z-index:4;background:#EFE4D6;display:flex;flex-direction:column;justify-content:center;
 padding:clamp(44px,6vw,72px) var(--gutter) clamp(28px,4vw,48px)}
.tbetyg__tal{display:flex;align-items:baseline;gap:.18em;white-space:nowrap;margin-top:clamp(14px,1.6vw,22px);color:var(--ink);line-height:.82}
.tbetyg__siffra{font-family:var(--f-disp);font-size:clamp(110px,12vw,210px);letter-spacing:-.045em;font-variant-numeric:tabular-nums}
.tbetyg__av{font-family:var(--f-disp);font-size:clamp(26px,2.4vw,40px);color:var(--ink-2)}
.tbetyg__stj{position:relative;width:clamp(170px,15vw,240px);aspect-ratio:5/1;margin-top:clamp(16px,1.6vw,24px);
 background:rgba(61,46,36,.14);-webkit-mask:var(--stj) 0 0/20% 100% repeat-x;mask:var(--stj) 0 0/20% 100% repeat-x;
 --stj:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.6l2.9 6 6.5.8-4.8 4.5 1.2 6.5L12 17.2l-5.8 3.2 1.2-6.5L2.6 9.4l6.5-.8z'/%3E%3C/svg%3E")}
.tbetyg__stj i{position:absolute;inset:0;right:auto;width:calc(var(--f) * 100%);background:linear-gradient(90deg,#8A4636,#C06F56)}
.tbetyg__txt{margin:clamp(18px,1.8vw,26px) 0 0;font-family:var(--f-disp);font-size:clamp(22px,2vw,30px);line-height:1.2;color:var(--ink)}
.tbetyg__txt b{font-weight:400;font-variant-numeric:tabular-nums}
.tbetyg__sub{margin:10px 0 0;font-size:15px;line-height:1.5;color:var(--ink-2);max-width:30ch}
.omdakt__knappar{display:flex;align-items:center;gap:14px;margin-top:clamp(22px,2.4vw,34px)}
.mosaik__paus{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:none;cursor:pointer;display:grid;place-items:center;color:var(--ink)}
.mosaik__paus:focus-visible{outline:2px solid #8A4636;outline-offset:3px}
.mosaik__paus i{width:10px;height:12px;border-inline:3px solid currentColor;box-sizing:border-box}
.mosaik__paus.is-pausad i{width:0;height:0;border:0;border-left:10px solid currentColor;border-block:6px solid transparent;margin-left:3px}
.omdakt__skrolla{position:absolute;right:clamp(28px,5vw,96px);bottom:26px;z-index:5;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
@media (max-width:1100px){.mgrid{grid-template-columns:repeat(4,minmax(0,1fr))}.mkol--5,.mkol--6{display:none}}
@media (max-width:900px){
 .omdakt__mosaik{height:62svh}
 .mgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:0 10px}
 .mkol--3,.mkol--4{display:none}
 .mhalv{gap:10px;padding-bottom:10px}
 .omdakt__skrolla{display:none}
 .vk{padding:12px}.vk blockquote{font-size:12.5px}
}
@media (prefers-reduced-motion:reduce){.mtrack{animation:none}.omdakt__mosaik{height:auto;max-height:84svh;overflow-y:auto}.mgrid{position:relative;inset:auto}.mhalv[aria-hidden]{display:none}.omdakt__mosaik::before,.omdakt__mosaik::after{display:none}}

/* bygge 31, Said 24/9: presentkortet sist i butikens rutnät. En yta i glas över en varm glöd, i den ett presentkort i
   terrakotta som lutar efter muspekaren, där folien sveper över och beloppet rullar. Fyller alltid den sista raden. */
.pk-kort{position:relative;isolation:isolate;overflow:hidden;display:grid;align-items:center;
 padding:clamp(22px,2.4vw,40px);border-radius:24px;color:var(--ink);text-decoration:none;container-type:inline-size;
 background:rgba(252,247,240,.55);border:1px solid rgba(255,252,247,.85);box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 30px 60px -40px rgba(61,46,36,.55)}
/* grind 54: kortets egen display skrev över [hidden], det syntes under Torr och med ?r= */
.pk-kort[hidden]{display:none}
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.pk-kort{background:rgba(252,247,240,.38);-webkit-backdrop-filter:blur(22px) saturate(1.5);backdrop-filter:blur(22px) saturate(1.5)}}
.pk-kort__glod{position:absolute;inset:-30%;z-index:-1;pointer-events:none;
 background:radial-gradient(40% 45% at 22% 40%,rgba(192,111,86,.42),transparent 70%),radial-gradient(35% 40% at 80% 70%,rgba(214,167,139,.5),transparent 70%);
 animation:pkglod 14s ease-in-out infinite alternate}
@keyframes pkglod{to{transform:translate3d(6%,-4%,0) scale(1.08)}}
.pk-kort__scen{perspective:900px;display:grid;place-items:center}
.pk-kort__kort{position:relative;overflow:hidden;width:min(100%,380px);aspect-ratio:1.586;border-radius:18px;padding:clamp(16px,1.6vw,24px);
 display:grid;grid-template-rows:auto 1fr auto;color:#F7EDE0;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s var(--ease);
 background:linear-gradient(135deg,#9A5240 0%,#8A4636 38%,#5B2F24 78%,#3D2E24 100%);
 box-shadow:0 1px 0 rgba(255,235,215,.35) inset,0 28px 50px -24px rgba(61,30,20,.75),0 8px 16px -10px rgba(61,30,20,.5)}
.pk-kort__kort::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(247,237,224,.22);margin:7px}
.pk-kort__kort::after{content:"";position:absolute;inset:-40% -60%;pointer-events:none;
 background:linear-gradient(105deg,transparent 38%,rgba(255,228,200,.32) 47%,rgba(255,244,230,.5) 50%,rgba(255,228,200,.32) 53%,transparent 62%);
 transform:translateX(var(--sx,-60%));animation:pkfolie 5.5s var(--ease) infinite}
@keyframes pkfolie{0%,55%{transform:translateX(-60%)}100%{transform:translateX(60%)}}
.pk-kort__logo{width:clamp(54px,5vw,72px);height:auto;filter:brightness(0) invert(1);opacity:.92}
.pk-kort__typ{position:absolute;top:clamp(18px,1.8vw,26px);right:clamp(18px,1.8vw,26px);font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;opacity:.85}
.pk-kort__belopp{align-self:end;font-family:var(--f-disp);font-size:clamp(34px,3.6vw,52px);line-height:1;letter-spacing:-.02em;transition:opacity .35s ease,transform .45s var(--ease)}
.pk-kort__belopp.is-byt{opacity:0;transform:translateY(12px)}
.pk-kort__fot{margin-top:8px;font-size:11px;letter-spacing:.06em;opacity:.78}
.pk-kort__txt{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.pk-kort__rubrik{font-family:var(--f-disp);font-size:clamp(26px,2.4vw,36px);line-height:1.08;letter-spacing:-.015em}
.pk-kort__brod{font-size:15px;line-height:1.6;color:var(--ink-2);max-width:40ch}
.pk-kort__val{display:flex;flex-wrap:wrap;gap:8px}
.pk-kort__val i{font-style:normal;font-size:13px;font-weight:600;padding:7px 13px;border-radius:999px;border:1px solid rgba(61,46,36,.18);background:rgba(255,255,255,.35)}
.pk-kort__knapp{margin-top:6px}
.pk-kort:hover .pk-kort__knapp{transform:translateY(-1px)}
.pk-kort:focus-visible{outline:2px solid #8A4636;outline-offset:4px}
.pk-kort__in{display:grid;grid-template-columns:1fr;gap:clamp(20px,2.4vw,34px);align-items:center}
@container (min-width:560px){.pk-kort__in{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(28px,3.4vw,56px)}}
@media (prefers-reduced-motion:reduce){.pk-kort__glod,.pk-kort__kort::after{animation:none}.pk-kort__kort{transform:none}}

/* bygge 31, Said 24/9: citaten under Hitta din rutin blir knappar som öppnar en genomskinlig modal. Rak serif i stället för
   kursiv, alias, pil som glider. Modalen i frostat glas över en mjukt suddad sida, stiger fram, går att bläddra. */
.roll__cit{appearance:none;font:inherit;text-align:left;color:inherit;background:none;border:0;cursor:pointer;border-radius:16px;
 margin:-10px -12px;padding:10px 12px;transition:background .4s var(--ease),box-shadow .4s var(--ease)}
.roll__cit:hover,.roll__cit:focus-visible{background:rgba(255,252,247,.55);box-shadow:0 12px 30px -22px rgba(61,46,36,.6)}
.roll__cit:focus-visible{outline:2px solid #8A4636;outline-offset:2px}
.roll__cit .roll__tkn{font-family:var(--f-disp);font-size:34px;line-height:.9;color:#8A4636}
.roll__cit .roll__q{font-family:var(--f-disp);font-style:normal;font-size:clamp(19px,1.6vw,22px);line-height:1.28;letter-spacing:-.01em}
.roll__cit .roll__namn2{display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;margin-top:10px;font-size:13px;letter-spacing:.02em;text-transform:none;font-weight:600}
.roll__cit .roll__namn2 b{font-family:var(--f-body);font-size:14px;font-weight:700;letter-spacing:.01em;color:var(--ink)}
.roll__las{color:#8A4636;display:inline-flex;align-items:center;gap:6px}
.roll__las::after{content:"\2192";transition:transform .4s var(--ease)}
.roll__cit:hover .roll__las::after{transform:translateX(4px)}
dialog.omd{padding:0;border:0;background:transparent;color:var(--ink);width:min(780px,calc(100vw - 32px));max-width:none;max-height:min(88vh,880px);overflow:visible}
.omd::backdrop{background:rgba(40,26,18,.3);-webkit-backdrop-filter:blur(10px) saturate(1.2);backdrop-filter:blur(10px) saturate(1.2);animation:omdbd .4s ease both}
@keyframes omdbd{from{opacity:0}}
.omd__in{position:relative;max-height:inherit;overflow:auto;overscroll-behavior:contain;border-radius:28px;padding:clamp(26px,3.6vw,52px);
 background:var(--lin);border:1px solid rgba(255,252,247,.85);box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 40px 90px -40px rgba(30,20,14,.6)}
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.omd__in{background:rgba(250,244,236,.66);-webkit-backdrop-filter:blur(30px) saturate(1.6);backdrop-filter:blur(30px) saturate(1.6)}}
.omd[open] .omd__in{animation:omdin .6s var(--ease) both}
@keyframes omdin{from{opacity:0;transform:translateY(26px) scale(.97);filter:blur(6px)}}
.omd__x{position:absolute;top:14px;right:14px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.4);font-size:24px;line-height:1;color:var(--ink);cursor:pointer}
.omd__x:focus-visible,.omd__pil:focus-visible{outline:2px solid #8A4636;outline-offset:2px}
.omd__sida.is-in{animation:omdsida .55s var(--ease) both}
@keyframes omdsida{from{opacity:0;transform:translateX(calc(var(--fran,1) * 18px))}}
.omd__topp{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 16px;padding-right:48px}
.omd__bet{font-size:13px;font-weight:600;color:#8A4636}
.omd__stor{margin:clamp(18px,2vw,28px) 0 0}
.omd__stor .stars{margin-bottom:14px}
.omd__stor blockquote{position:relative;margin:0;font-family:var(--f-disp);font-size:clamp(28px,3.6vw,46px);line-height:1.1;letter-spacing:-.018em;text-wrap:balance}
.omd__stor blockquote::before{content:"\201D";position:absolute;left:-.5em;top:-.05em;color:#8A4636}
.omd__stor figcaption{display:flex;flex-direction:column;gap:3px;margin-top:18px;font-size:13px;color:var(--ink-2)}
.omd__stor figcaption b{font-size:15px;color:var(--ink)}
.omd__fler{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-top:clamp(24px,3vw,36px)}
.omd__sma{margin:0;padding:16px 16px 14px;border-radius:16px;background:rgba(255,255,255,.42);border:1px solid rgba(255,252,247,.8)}
.omd__sma .stars{margin-bottom:8px}
.omd__sma blockquote{margin:0;font-size:14px;line-height:1.55}
.omd__sma figcaption{margin-top:10px;font-size:12px;color:var(--ink-2)}
.omd__sma figcaption b{color:var(--ink)}
.omd__till{display:inline-flex;margin-top:clamp(20px,2.4vw,30px)}
.omd__nav{display:flex;align-items:center;justify-content:flex-end;gap:14px;margin-top:18px}
.omd__pil{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.4);font-size:18px;color:var(--ink);cursor:pointer;transition:transform .3s var(--ease)}
.omd__pil:hover{transform:translateY(-1px)}
.omd__nr{font-size:13px;font-weight:600;color:var(--ink-2);font-variant-numeric:tabular-nums}
@media (max-width:640px){dialog.omd{width:calc(100vw - 20px)}.omd__in{border-radius:22px}.omd__stor blockquote::before{position:static;margin-right:.08em}}
@media (prefers-reduced-motion:reduce){.omd[open] .omd__in,.omd__sida.is-in,.omd::backdrop{animation:none}}

/* bygge 31, Aida 25/9 00:35: "Vad betyder sheasmöret för dig" utan bilder och band. En lugn kortlek i sidans ram. Frågan
   stort till vänster, ett svar i taget överst i leken, två kort anas bakom. Leken bläddrar själv i lugn takt, stannar när
   man pekar, och kortet går att svepa bort åt sidan eller bläddra med pilarna. */
.leksek__in{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,96px);align-items:center}
.leksek__txt h2{margin-top:clamp(12px,1.4vw,18px);font-size:clamp(38px,4.6vw,72px);line-height:1.02;letter-spacing:-.02em}
.lek__styr{display:flex;align-items:center;gap:14px;margin-top:clamp(26px,3vw,40px)}
.lek__pil{width:48px;height:48px;border-radius:50%;border:1px solid rgba(61,46,36,.22);background:rgba(255,252,247,.5);font-size:18px;color:var(--ink);cursor:pointer;
 transition:background .35s var(--ease),color .35s var(--ease),transform .35s var(--ease)}
.lek__pil:hover{background:#8A4636;color:#F7EDE0;transform:translateY(-1px)}
.lek__pil:focus-visible{outline:2px solid #8A4636;outline-offset:3px}
.lek__nr{font-size:13px;font-weight:600;color:var(--ink-2);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.lek__nr b{color:var(--ink)}
.leksek__mer{display:inline-flex;margin-top:clamp(20px,2.4vw,30px)}
.lek{position:relative;display:grid;gap:18px}
.lek__k{margin:0;padding:clamp(28px,3vw,44px);border-radius:24px;background:#FBF6EE;border:1px solid rgba(255,252,247,.9);
 box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 30px 60px -38px rgba(61,46,36,.55)}
.lek__k .rost__q{font-family:var(--f-disp);font-weight:400;color:var(--ink);letter-spacing:-.012em;text-wrap:pretty;margin:0}
.lek__k .rost__hang{display:inline-block;width:.5em;margin-left:-.5em;color:#8A4636}
.lek__k--kort .rost__q{font-size:clamp(30px,3.4vw,46px);line-height:1.08}
.lek__k--mellan .rost__q{font-size:clamp(24px,2.5vw,34px);line-height:1.16}
.lek__k--lang .rost__q{font-size:clamp(19px,1.8vw,24px);line-height:1.34}
.lek__k .rost__meta{display:flex;align-items:center;gap:14px;margin-top:clamp(18px,2vw,26px);font-size:13px;color:var(--ink-2)}
.lek__k .rost__alias{font-size:14px;color:var(--ink)}
.lek__k .rost__kalla{color:var(--ink-2);min-height:44px;display:inline-flex;align-items:center}
.lek__k .rost__gilla{color:#8A4636}
.leksek:not(.is-live) .lek__styr{display:none}
.lek.is-live{display:block;min-height:var(--lek-h,420px);touch-action:pan-y}
.lek.is-live .lek__k{position:absolute;inset:0 0 auto 0;height:calc(var(--lek-h) - 40px);display:flex;flex-direction:column;justify-content:center;will-change:transform,opacity;transition:transform .7s var(--ease),opacity .6s var(--ease);cursor:grab}
/* korten bakom är bara papper, texten syns först när kortet ligger överst */
.lek.is-live .lek__k > *{transition:opacity .45s var(--ease)}
.lek.is-live .lek__k:not(.is-topp) > *{opacity:0}
.lek.is-live .lek__k.is-dra{transition:none;cursor:grabbing}
@media (max-width:900px){.leksek__in{grid-template-columns:1fr}.lek.is-live{min-height:var(--lek-h,380px)}.lek__k--kort .rost__q{font-size:28px}.lek__k--mellan .rost__q{font-size:22px}.lek__k--lang .rost__q{font-size:17px;line-height:1.4}.lek__k{padding:24px}}
@media (prefers-reduced-motion:reduce){.lek.is-live .lek__k{transition:opacity .01s}}

/* bygge 31, Aida 25/9: hudtyperna som knappar, text och klick, inga bilder. Aida 25/9 01:24: "det vertikala var bättre",
   raderna med texten till vänster och pilen till höger står kvar. Nuur 01:02: ingen färgväxling när man trycker. */
.valj .valj__rad.valj__rad--knapp{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));grid-auto-flow:row;grid-auto-columns:auto;gap:12px;overflow:visible;scroll-snap-type:none;margin-inline:0;padding-inline:0}
.valj__rad--knapp .valj__k{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:14px;min-height:64px;padding:14px 14px 14px 20px;border-radius:16px;text-align:left;
 border:1px solid rgba(61,46,36,.16);background:rgba(255,252,247,.6);color:var(--ink);text-decoration:none;transition:border-color .3s var(--ease),transform .25s var(--ease)}
.valj__rad--knapp .valj__t{font-family:var(--f-disp);font-size:clamp(16px,1.3vw,19px);line-height:1.22;margin:0;overflow-wrap:normal;text-wrap:balance}
.valj__rad--knapp .valj__pil{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(138,70,54,.1);color:#8A4636;font-size:14px;transition:transform .3s var(--ease)}
/* Nuur 25/9 00:59: knappens egen display skrev över [hidden], och den gamla hovringen färgade texten terrakotta på terrakotta */
.valj__rad--knapp .valj__k[hidden]{display:none}
.valj__rad--knapp .valj__k .valj__t{color:inherit}
@media (hover:hover){.valj__rad--knapp .valj__k:hover{border-color:rgba(61,46,36,.42)}
.valj__rad--knapp .valj__k:hover .valj__pil{transform:translateX(3px)}}
.valj__rad--knapp .valj__k:active{transform:scale(.985)}
.valj__rad--knapp .valj__k:focus-visible{outline:2px solid #8A4636;outline-offset:3px}
@media (max-width:600px){.valj .valj__rad.valj__rad--knapp{grid-template-columns:1fr;gap:10px}.valj__rad--knapp .valj__k{min-height:58px;padding:12px 12px 12px 18px}.valj__rad--knapp .valj__t{font-size:17px}}
/* bygge 34: fem tumnaglar på kakaosmöret, kolumnen får krympa, knapparna delar bredden men aldrig under 44 px */
.pd__gal{grid-template-columns:minmax(0,1fr)}
.pd__thumbs{overflow-x:auto;scrollbar-width:none}
.pd__thumbs::-webkit-scrollbar{display:none}
.pd__thumbs button{flex:0 1 72px;min-width:44px}

/* bygge 35, Said 27/9, riktning A: omdömesblocket på produktsidorna. Betyget i en panel utan ram som följer med medan man
   läser, korten i två spalter så att sex omdömen blir tre rader. Fördelningen räknas bara ur omdömena som står på sidan och
   säger hur många. Bläddringen står kvar direkt efter korten i koden (pr-varv17.js hittar den så) och ligger under korten.
   Instagramraden under är orörd. */
#rev .bet{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(26px,3.4vw,40px)}
.bet__panel{display:flex;flex-direction:column;align-items:stretch;gap:20px;min-width:0}
.bet__panel>.eyebrow{align-self:flex-start}

/* rubriken: talet stort, stjärnorna och "av 5" bredvid på samma baslinje, antalet under. Texten i h2 är oförändrad. */
.bet__h{margin:0;font-size:20px;line-height:1.1;color:var(--ink)}
.bet__rad1{display:flex;align-items:flex-end;align-items:last baseline;gap:clamp(14px,1.3vw,20px)}
.bet__tal{font-size:clamp(72px,6.6vw,100px);line-height:.9;letter-spacing:-.035em}
/* orden i rubriken stiger fram som i resten av sajten (data-words). Ordens ram lyfter texten 0,17 em över sin baslinje,
   så talet och "av 5" flyttas ned lika mycket var i sin egen storlek och hamnar på samma baslinje. Uppmätt i Chromium. */
.bet__rad1 .w{position:relative;top:.17em}
.bet__tal{padding-bottom:.17em}
.bet__sida{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.bet__stj{display:flex;gap:4px}
.bet__stj i{display:block;width:17px;height:17px;background:linear-gradient(90deg,var(--gold) var(--f),rgba(61,46,36,.16) var(--f));clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.bet__av{font-size:clamp(19px,1.5vw,22px);color:var(--ink-2)}
.bet__h .bet__pa{display:block;margin-top:14px;font-family:var(--f-disp);font-style:normal;font-size:clamp(21px,1.7vw,25px);line-height:1.2;color:var(--ink)}

/* fördelningen, en tunn faktalista med hårlinjer */
.bet__dist{padding-top:18px;border-top:1px solid var(--line)}
.bet__rader{margin:0;display:grid;gap:6px}
.bet__rad{display:grid;grid-template-columns:5.8em minmax(0,1fr);align-items:center;column-gap:14px;font-size:12px;line-height:1.6}
.bet__rad dt{font-weight:600;letter-spacing:.02em;color:var(--ink-2);white-space:nowrap}
.bet__rad dd{margin:0;display:grid;grid-template-columns:minmax(0,1fr) 2.4em;align-items:center;column-gap:12px}
.bet__spar{position:relative;display:block;height:1px;background:var(--line)}
.bet__spar i{position:absolute;left:0;top:-1px;height:3px;width:max(3px,var(--a));border-radius:3px;background:var(--gold);transform-origin:left center;transition:transform 1.1s var(--ease) .15s}
.bet__rad:nth-child(2) .bet__spar i{transition-delay:.21s}
.bet__rad:nth-child(3) .bet__spar i{transition-delay:.27s}
.bet__rad:nth-child(4) .bet__spar i{transition-delay:.33s}
.bet__rad:nth-child(5) .bet__spar i{transition-delay:.39s}
.bet__dist.rv:not(.in) .bet__spar i{transform:scaleX(0)}
.bet__n{text-align:right;font-weight:600;font-variant-numeric:tabular-nums;color:var(--ink-2)}
.bet__kalla{margin:12px 0 0;font-size:12px;line-height:1.5;color:var(--mute)}
.bet__panel .bet__lede{margin:0;padding-top:18px;border-top:1px solid var(--line);font-size:15px;line-height:1.6;max-width:none;text-wrap:pretty}

/* korten, två spalter som lägger sig efter sin egen höjd */
#rev .bet>.quotes{display:block;columns:2;column-gap:16px}
#rev .bet>.quotes .q{break-inside:avoid;margin:0 0 16px;padding:22px 24px 20px;gap:10px;background:var(--white);border:1px solid var(--line);border-radius:var(--r);box-shadow:0 22px 40px -34px rgba(61,46,36,.45)}
#rev .bet>.quotes .q:nth-last-child(1 of .is-on){margin-bottom:0}
#rev .bet>.quotes .q blockquote{font-size:17px;line-height:1.45}
#rev .bet>.quotes .q figcaption{margin-top:4px;padding-top:12px;border-top:1px solid var(--line);gap:3px}
/* kundens text utan ligaturer, orden står som kunden skrev dem */
#rev .q blockquote,#rev .q figcaption{font-variant-ligatures:none}
/* korten glider fram när de syns, både första gången och vid varje ny sida */
@keyframes bet-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
#rev .bet>.quotes .q.rv{transition:none}
#rev .bet>.quotes .q.rv.in.is-on{animation:bet-in .6s var(--ease) both}
#rev .bet>.quotes .q.is-on:nth-child(2 of .is-on){animation-delay:.05s}
#rev .bet>.quotes .q.is-on:nth-child(3 of .is-on){animation-delay:.1s}
#rev .bet>.quotes .q.is-on:nth-child(4 of .is-on){animation-delay:.15s}
#rev .bet>.quotes .q.is-on:nth-child(5 of .is-on){animation-delay:.2s}
#rev .bet>.quotes .q.is-on:nth-child(6 of .is-on){animation-delay:.25s}

#rev .bet>.pag{margin:0}
.bet--en>.pag{display:none}

/* dator: panelen i vänsterspalten följer med, bläddringen i högerspalten 28 px under korten. Panelen spänner båda raderna
   och bär 72 px luft under sig (28 px luft och 44 px bläddring), så att underkanten stannar vid kortens underkant. */
@media (min-width:1180px){
  #rev .bet{grid-template-columns:minmax(340px,4fr) minmax(0,8fr);grid-template-rows:auto 1fr;column-gap:clamp(56px,5.6vw,96px);row-gap:0;align-items:start}
  .bet__panel{grid-column:1;grid-row:1/span 2;margin-bottom:72px}
  .bet--en .bet__panel{margin-bottom:0}
  #rev .bet>.quotes{grid-column:2;grid-row:1}
  #rev .bet>.pag{grid-column:2;grid-row:2;margin-top:28px;flex-wrap:nowrap;gap:6px}
}
@media (min-width:1180px) and (min-height:660px){
  .bet__panel{position:sticky;top:calc(var(--nav-h) + 28px)}
}

/* platta: panelen överst i två delar, betyget till vänster och fördelningen till höger */
@media (min-width:700px) and (max-width:1179px){
  .bet__panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);column-gap:clamp(32px,5vw,64px);row-gap:20px;align-items:end}
  .bet__panel>.eyebrow,.bet__panel .bet__lede{grid-column:1/-1}
  .bet__dist{border-top:0;padding-top:0}
  .bet--tp .bet__panel{grid-template-columns:minmax(0,1fr)}
}

/* mobil: panelen kompakt överst, korten i en spalt, bläddringen under korten */
@media (max-width:699px){
  .bet__panel{gap:16px}
  .bet__tal{font-size:64px}
  .bet__h .bet__pa{margin-top:10px;font-size:20px}
  .bet__dist,.bet__panel .bet__lede{padding-top:14px}
  #rev .bet>.quotes{columns:1}
  #rev .bet>.quotes .q{padding:20px 20px 18px}
}

@media (prefers-reduced-motion:reduce){
  #rev .bet>.quotes .q.rv.in.is-on{animation:none}
  .bet__spar i{transform:none!important;transition:none}
}

/* Instagramlänken i remsan under omdömena var 39,8 px hög, tryckytan blir 44 px utan att raden växer */
#rev .bandrost .rost__kalla{display:inline-flex;align-items:center;min-height:44px;margin-block:-12px}

/* bygge 35, granskning 57 LOW 2: tumnagelraden skrollar i sidled och klippte fokusringens över- och underkant. Luft inuti raden
   och lika mycket negativ marginal utanför, så att raden tar samma plats som förut. */
.pd__thumbs{padding-block:6px;margin-block:-6px}

/* Aida 28/9 02:07, granskning 62: varukorgens lucka. Bekräftelsen efter ett köp läses upp för skärmläsare men syns inte, som i förlagan.
   Ett fel syns med panelens inre marginal. Klasserna sätts av temats commerce.js i skarpt läge. */
html body .cart .cart__message--ok{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
html body .cart .cart__message--fel:not(:empty){margin:14px 26px 0;color:#A3452E;font-size:14px;font-weight:600;line-height:1.45}