/* Medicinsk viktnedgång: grafisk uppdatering. Texten är oförändrad, bara form och rörelse.
   Allt ligger under body.vn. Rörelse 300-900 ms, ease-out. prefers-reduced-motion = slutläge direkt. */
body.vn{--vn-cream:#f6f2e7;--vn-tint:#efe8d8;--vn-card:#fffdf8;--vn-deep:#16291d;--vn-pine:#2d5a3f;--vn-mint:#b9ebc8;--vn-terra:#cf6244;--vn-ink:#16291d;--vn-soft:#434a44;--vn-line:rgba(22,41,29,.1);--vn-ease:cubic-bezier(.2,.8,.2,1);--vn-w:1160px;background:var(--vn-cream)}
body.vn .info-page.vn-main{max-width:none;margin:0;padding:0;overflow-x:clip}
.vn-wrap{width:100%;max-width:var(--vn-w);margin:0 auto;padding-left:24px;padding-right:24px;box-sizing:border-box}

/* ===== inträde, bara när skriptet körs ===== */
.vn-js .vn-r{opacity:0;transform:translate3d(0,26px,0);transition:opacity .85s var(--vn-ease),transform .85s var(--vn-ease);transition-delay:var(--d,0s)}
.vn-js .vn-r.vn-in{opacity:1;transform:none}
@keyframes vnUp{from{opacity:0;transform:translate3d(0,24px,0)}to{opacity:1;transform:none}}

/* ===== typografi i sektionerna ===== */
body.vn .vn-sec{position:relative;padding:clamp(64px,8vw,120px) 0}
body.vn .vn-sec--tint{background:var(--vn-tint)}
body.vn .vn-sec h2{font-family:"Cabinet Grotesk","Cabinet Grotesk Fallback","Inter Tight",system-ui,sans-serif;font-weight:700;font-size:clamp(2rem,1.35rem + 2.3vw,3.4rem);line-height:1.04;letter-spacing:-.034em;margin:0 0 22px;color:var(--vn-ink);max-width:19ch;text-wrap:balance}
body.vn .vn-sec p{font-size:clamp(1.0625rem,1rem + .25vw,1.1875rem);line-height:1.65;color:var(--vn-soft);margin:0 0 18px;max-width:62ch}
body.vn .vn-sec p a,body.vn .vn-sec li a{color:var(--vn-pine);text-underline-offset:3px;text-decoration-thickness:1px}
body.vn .vn-head{max-width:760px;margin-bottom:clamp(32px,4vw,56px)}
body.vn .vn-head p:last-child{margin-bottom:0}
body.vn .vn-sec p.vn-after{margin-top:clamp(28px,3vw,44px);margin-bottom:0;max-width:70ch}
.vn-eyebrow{display:flex;align-items:center;gap:12px;font-size:.78rem!important;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--lp-ink-muted,#5a625c)!important;margin:0 0 18px!important}
.vn-eyebrow span{display:inline-grid;place-items:center;min-width:34px;height:24px;padding:0 8px;border-radius:999px;background:var(--vn-deep);color:#fff;font-size:.7rem;letter-spacing:.06em;font-variant-numeric:tabular-nums}

/* ===== Hero ===== */
.vn-hero{position:relative;padding:clamp(40px,6vw,88px) 0 clamp(16px,3vw,40px)}
.vn-hero::before{content:"";position:absolute;z-index:0;left:-14%;top:-120px;width:72%;height:130%;background:radial-gradient(closest-side,rgba(255,248,226,.95),rgba(255,248,226,0));pointer-events:none}
.vn-hero__grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(32px,5vw,80px);align-items:center}
body.vn .vn-hero h1{font-family:"Cabinet Grotesk","Cabinet Grotesk Fallback","Inter Tight",system-ui,sans-serif;font-weight:700;font-size:clamp(2.6rem,1.4rem + 4.6vw,5.2rem);line-height:.98;letter-spacing:-.045em;margin:0 0 24px;color:var(--vn-ink);text-wrap:balance;animation:vnUp 1s var(--vn-ease) both .05s}
body.vn .vn-hero .ip-kicker{animation:vnUp .9s var(--vn-ease) both;margin-bottom:22px}
body.vn .vn-hero .lead{font-size:clamp(1.125rem,1rem + .5vw,1.375rem);line-height:1.55;color:var(--vn-soft);max-width:34em;margin:0 0 30px;animation:vnUp 1s var(--vn-ease) both .18s}
.vn-hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:34px;animation:vnUp 1s var(--vn-ease) both .28s}
.vn-hero .ip-byline{animation:vnUp 1s var(--vn-ease) both .38s}
.vn-hero__media{position:relative;animation:vnUp 1.2s var(--vn-ease) both .2s}
body.vn .vn-hero .rik-hero{margin:0;aspect-ratio:1508/1180;border-radius:32px;box-shadow:0 40px 80px -40px rgba(22,41,29,.5),0 2px 8px rgba(22,41,29,.06)}
.vn-chip{position:absolute;left:-18px;bottom:36px;display:inline-flex;align-items:center;gap:9px;margin:0!important;padding:11px 18px 11px 14px;border-radius:999px;background:rgba(255,253,248,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 18px 34px -16px rgba(22,41,29,.45);font-size:.9rem!important;font-weight:600;color:var(--vn-ink)!important;animation:vnFloat 6s ease-in-out infinite 1.4s,vnUp 1.1s var(--vn-ease) both .7s}
@keyframes vnFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}

/* ===== kort svar + i korthet ===== */
.vn-top{position:relative;z-index:1;padding-bottom:clamp(40px,5vw,72px)}
body.vn .vn-top .kort-svar{margin:clamp(20px,3vw,36px) 0 0;padding:clamp(24px,3vw,36px) clamp(22px,3vw,40px);border-radius:28px;background:var(--vn-card);border:1px solid var(--vn-line);box-shadow:0 30px 60px -44px rgba(22,41,29,.35)}
body.vn .vn-top .kort-svar__fraga{font-size:clamp(1.4rem,1.1rem + 1vw,1.9rem);letter-spacing:-.025em;margin-bottom:12px}
body.vn .vn-top .kort-svar__svar{max-width:78ch;font-size:clamp(1.0625rem,1rem + .2vw,1.1875rem)}
body.vn .vn-top .rik-fakta{margin:clamp(24px,3vw,40px) 0 0}
body.vn .vn-top .rik-fakta__rubrik{margin-bottom:16px}
body.vn .vn-top .rik-fakta li{background:var(--vn-card);border:1px solid var(--vn-line);border-radius:24px;padding:24px 22px 22px;transition:transform .5s var(--vn-ease),box-shadow .5s var(--vn-ease)}
body.vn .vn-top .rik-fakta li:hover{transform:translateY(-5px);box-shadow:0 28px 50px -32px rgba(22,41,29,.4)}
body.vn .vn-top .rik-fakta__stor{font-size:clamp(1.5rem,1.15rem + 1vw,2rem)!important;letter-spacing:-.03em}
body.vn .vn-top .rik-fakta__text{font-size:.95rem}

/* ===== 01 vad är ===== */
.vn-split{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(32px,6vw,96px);align-items:start}
.vn-split__fig{position:sticky;top:110px}
body.vn .vn-split .rik-block{margin:0;padding:clamp(28px,3vw,44px);border-radius:32px;background:var(--vn-deep);border:0;border-left:0;box-shadow:0 40px 70px -40px rgba(22,41,29,.6);position:relative;overflow:hidden}
body.vn .vn-split .rik-block::before{content:"\201D";position:absolute;right:18px;top:-36px;font:700 220px/1 "Cabinet Grotesk",serif;color:rgba(185,235,200,.1);pointer-events:none}
body.vn .vn-split .rik-lyft__text{font-size:clamp(1.4rem,1.05rem + 1.2vw,2rem);line-height:1.22;letter-spacing:-.025em;color:#faf8f4;position:relative}
.vn-code{display:flex;align-items:baseline;gap:14px;margin:22px 0 0!important;padding:0 6px}
.vn-code b{font:700 clamp(2.4rem,2rem + 1.4vw,3.2rem)/1 "Cabinet Grotesk","Inter Tight",sans-serif;letter-spacing:-.04em;color:var(--vn-pine)}
.vn-code span{font-size:.92rem;color:var(--lp-ink-muted,#5a625c)}

/* ===== grafikblock från artikelmotorn, nu på sektionernas bredd ===== */
body.vn .vn-sec .rik-block{margin:0;border-radius:32px}
body.vn .vn-sec .rik-kedja{background:var(--vn-card);border:1px solid var(--vn-line);box-shadow:0 30px 60px -44px rgba(22,41,29,.35);padding:clamp(24px,3vw,44px)}
body.vn .vn-sec .rik-block__rubrik{font-size:clamp(1.3rem,1.1rem + .8vw,1.75rem);letter-spacing:-.025em}
body.vn .vn-sec .rik-block--mork{background:var(--vn-deep);padding:clamp(28px,3.4vw,52px);box-shadow:0 40px 70px -44px rgba(22,41,29,.65)}

/* ===== 03 urval ===== */
.vn-crit{list-style:none;margin:0!important;padding:0!important;display:grid;grid-template-columns:1fr auto 1fr;gap:0 18px;align-items:start}
body.vn .vn-crit>li{margin:0;display:flex;flex-direction:column;gap:12px}
body.vn .vn-crit>li.vn-r{padding:clamp(26px,3vw,40px);border-radius:32px;background:var(--vn-card);border:1px solid var(--vn-line);box-shadow:0 30px 60px -46px rgba(22,41,29,.35);transition:transform .5s var(--vn-ease),box-shadow .5s var(--vn-ease)}
body.vn .vn-crit>li.vn-r:hover{transform:translateY(-6px);box-shadow:0 36px 64px -40px rgba(22,41,29,.45)}
.vn-crit__kicker{font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--vn-pine)}
.vn-crit__stor{font:700 clamp(2.2rem,1.6rem + 2.4vw,3.6rem)/1 "Cabinet Grotesk","Inter Tight",sans-serif;letter-spacing:-.04em;color:var(--vn-ink)}
.vn-crit__stor b{color:var(--vn-pine);font-weight:700}
.vn-crit__txt{font-size:1.0625rem;line-height:1.55;color:var(--vn-soft)}
.vn-crit__chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:8px}
.vn-crit__chips i{font-style:normal;font-size:.85rem;font-weight:500;padding:6px 13px;border-radius:999px;background:#e8f1ea;color:var(--vn-pine)}
.vn-crit__eller{display:grid!important;place-items:center;align-self:center}
.vn-crit__eller span{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--vn-deep);color:#fff;font-size:.82rem;font-weight:600;letter-spacing:.04em}

/* ===== 04 upplägg: delarna ===== */
.vn-parts{list-style:none;margin:clamp(24px,3vw,40px) 0 0!important;padding:0!important;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
body.vn .vn-parts>li{position:relative;margin:0;padding:clamp(24px,2.6vw,36px) clamp(22px,2.6vw,34px) clamp(24px,2.6vw,36px) clamp(76px,6vw,92px);border-radius:28px;background:var(--vn-card);border:1px solid var(--vn-line);font-size:1.0625rem;line-height:1.6;color:var(--vn-soft);transition:transform .5s var(--vn-ease),box-shadow .5s var(--vn-ease)}
body.vn .vn-parts>li:hover{transform:translateY(-5px);box-shadow:0 30px 54px -36px rgba(22,41,29,.4)}
body.vn .vn-parts>li strong{display:block;font:700 1.3rem/1.2 "Cabinet Grotesk","Inter Tight",sans-serif;letter-spacing:-.02em;color:var(--vn-ink);margin-bottom:8px}
.vn-parts__nr{position:absolute;left:clamp(22px,2.4vw,30px);top:clamp(24px,2.6vw,34px);width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#e8f1ea;color:var(--vn-pine);font:700 1.05rem/1 "Cabinet Grotesk","Inter Tight",sans-serif;transition:background .4s,color .4s,transform .5s var(--vn-ease)}
body.vn .vn-parts>li:hover .vn-parts__nr{background:var(--vn-pine);color:#fff;transform:scale(1.1)}

/* ===== 05 evidens ===== */
.vn-evid{list-style:none;margin:0!important;padding:0!important;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
body.vn .vn-evid>li{margin:0;padding:clamp(26px,3vw,44px);border-radius:32px;background:var(--vn-card);border:1px solid var(--vn-line);box-shadow:0 30px 60px -46px rgba(22,41,29,.35);display:flex;flex-direction:column}
body.vn .vn-evid p{margin:0}
.vn-evid__namn{display:flex;align-items:baseline;gap:12px;margin-bottom:22px!important}
.vn-evid__namn strong{font:700 1.15rem/1 "Cabinet Grotesk","Inter Tight",sans-serif;letter-spacing:-.01em;padding:7px 14px;border-radius:999px;background:var(--vn-deep);color:#fff}
.vn-evid__namn span{font-size:.95rem;color:var(--lp-ink-muted,#5a625c);font-variant-numeric:tabular-nums}
.vn-evid__big{display:flex;align-items:flex-start;gap:4px;line-height:.9!important}
.vn-evid__big b{font:700 clamp(4rem,3rem + 4vw,6.6rem)/.9 "Cabinet Grotesk","Inter Tight",sans-serif;letter-spacing:-.05em;color:var(--vn-pine);font-variant-numeric:tabular-nums}
.vn-evid__big i{font:700 clamp(1.8rem,1.4rem + 1.4vw,2.8rem)/1 "Cabinet Grotesk","Inter Tight",sans-serif;font-style:normal;color:var(--vn-pine);margin-top:.35em}
body.vn .vn-evid__lab{font-size:.92rem!important;color:var(--lp-ink-muted,#5a625c)!important;margin:10px 0 26px!important}
.vn-bars{display:grid;gap:10px;margin-bottom:26px}
.vn-bar{display:grid;grid-template-columns:92px minmax(0,1fr) 52px;align-items:center;gap:12px;font-size:.88rem;color:var(--vn-soft)}
.vn-bar::before{content:"";grid-column:2;grid-row:1;height:14px;border-radius:999px;background:rgba(22,41,29,.07)}
.vn-bar span{grid-column:1;grid-row:1}.vn-bar i{grid-column:2;grid-row:1}.vn-bar em{grid-column:3;grid-row:1}
.vn-bar i{display:block;height:14px;border-radius:999px;background:linear-gradient(90deg,#2d5a3f,#6aa883);width:var(--w);transform-origin:left;transition:transform 1.5s var(--vn-ease) .25s}
.vn-bar--b i{background:#c9cfc9}
.vn-bar em{font-style:normal;font-weight:600;color:var(--vn-ink);font-variant-numeric:tabular-nums;text-align:right}
.vn-js .vn-evid>li:not(.vn-in) .vn-bar i{transform:scaleX(0)}
body.vn .vn-evid__txt{font-size:1rem!important;line-height:1.6!important;margin-top:auto!important}

/* ===== 06 förlopp ===== */
.vn-tl{list-style:none;margin:0!important;padding:0!important;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;position:relative}
.vn-tl::before,.vn-tl::after{content:"";position:absolute;left:12px;right:12px;top:11px;height:2px;border-radius:2px}
.vn-tl::before{background:rgba(22,41,29,.14)}
.vn-tl::after{background:linear-gradient(90deg,#2d5a3f,#7fb892);transform-origin:left;transition:transform 2.6s var(--vn-ease) .2s}
.vn-js .vn-tl:not(.vn-in)::after{transform:scaleX(0)}
body.vn .vn-tl>li{position:relative;margin:0;padding-top:46px;font-size:1rem}
.vn-tl__dot{position:absolute;left:0;top:0;width:24px;height:24px;border-radius:50%;background:var(--vn-pine);border:2px solid var(--vn-pine);box-shadow:0 0 0 7px rgba(45,90,63,.14);z-index:1;transition:background .5s var(--vn-ease),border-color .5s,box-shadow .5s,transform .5s var(--vn-ease);transition-delay:calc(.3s + var(--k,0) * .6s)}
.vn-js .vn-tl:not(.vn-in) .vn-tl__dot{background:var(--vn-tint);border-color:rgba(22,41,29,.22);box-shadow:none}
body.vn .vn-tl strong{display:block;font:700 clamp(1.3rem,1.1rem + .7vw,1.65rem)/1.15 "Cabinet Grotesk","Inter Tight",sans-serif;letter-spacing:-.025em;color:var(--vn-ink);margin-bottom:10px}
body.vn .vn-tl p{font-size:1rem!important;line-height:1.6!important;margin:0!important}
body.vn .vn-tl__key strong::after{content:"Tydligast fas";display:table;margin:10px 0 0;padding:5px 11px;border-radius:999px;background:var(--vn-terra);color:#fff;font:600 .7rem/1 "Inter Tight",sans-serif;letter-spacing:.08em;text-transform:uppercase}
.vn-js .vn-tl>li{transition:opacity .8s var(--vn-ease),transform .8s var(--vn-ease);transition-delay:calc(.2s + var(--k,0) * .6s)}
.vn-js .vn-tl:not(.vn-in)>li{opacity:0;transform:translateY(16px)}

/* ===== 07 långsiktigt ===== */
body.vn .vn-sec--dark{background:var(--vn-deep);overflow:hidden}
body.vn .vn-sec--dark::before{content:"";position:absolute;right:-10%;top:-30%;width:60%;height:160%;background:radial-gradient(closest-side,rgba(127,184,146,.22),rgba(127,184,146,0));animation:vnDrift 14s ease-in-out infinite alternate;pointer-events:none}
@keyframes vnDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-8%,6%,0)}}
.vn-long{position:relative;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(32px,6vw,96px);align-items:center}
.vn-long__fig{position:relative;justify-self:center;width:min(100%,360px);aspect-ratio:1}
.vn-ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.vn-ring circle{fill:none;stroke-width:5}
.vn-ring__bg{stroke:rgba(250,248,244,.12)}
.vn-ring__fg{stroke:var(--vn-mint);stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:0;transition:stroke-dashoffset 2.4s var(--vn-ease) .3s}
.vn-js .vn-long__fig:not(.vn-in) .vn-ring__fg{stroke-dashoffset:100}
.vn-long__big{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#faf8f4}
.vn-long__big b{font:700 clamp(5rem,4rem + 5vw,8.5rem)/.85 "Cabinet Grotesk","Inter Tight",sans-serif;letter-spacing:-.05em}
.vn-long__big span{font-size:1.15rem;letter-spacing:.06em;color:rgba(250,248,244,.72);margin-top:8px}
body.vn .vn-sec--dark h2{color:#faf8f4;max-width:17ch}
body.vn .vn-sec--dark p{color:rgba(250,248,244,.8);max-width:60ch}
body.vn .vn-sec--dark .vn-eyebrow{color:rgba(250,248,244,.7)!important}
body.vn .vn-sec--dark .vn-eyebrow span{background:var(--vn-mint);color:var(--vn-deep)}

/* ===== 08 jämförelse ===== */
.vn-diff{list-style:none;margin:0!important;padding:0!important;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
body.vn .vn-diff>li{margin:0;display:flex;gap:18px;align-items:flex-start;padding:clamp(22px,2.4vw,32px);border-radius:26px;background:var(--vn-card);border:1px solid var(--vn-line);font-size:1.0625rem;line-height:1.55;color:var(--vn-ink);transition:transform .5s var(--vn-ease),box-shadow .5s var(--vn-ease)}
body.vn .vn-diff>li:hover{transform:translateY(-4px);box-shadow:0 26px 48px -34px rgba(22,41,29,.4)}
.vn-diff svg{flex:none;margin-top:1px;transition:transform .5s var(--vn-ease)}
.vn-diff>li:hover svg{transform:scale(1.15) rotate(-6deg)}

/* ===== 09 kostnad ===== */
.vn-cost{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,6vw,96px);align-items:start}
.vn-price{position:sticky;top:110px;padding:clamp(28px,3vw,44px);border-radius:32px;background:var(--vn-deep);color:#faf8f4;box-shadow:0 40px 70px -40px rgba(22,41,29,.65)}
body.vn .vn-sec .vn-price p{color:rgba(250,248,244,.74);max-width:none}
body.vn .vn-price__lab{font-size:.78rem!important;font-weight:600;letter-spacing:.14em;text-transform:uppercase;margin:0 0 12px!important}
.vn-price__sum{display:flex;align-items:baseline;gap:12px;margin:0 0 22px!important}
body.vn .vn-sec .vn-price__sum b{font:700 clamp(4rem,3rem + 4vw,6rem)/.9 "Cabinet Grotesk","Inter Tight",sans-serif;letter-spacing:-.05em;color:#fff;font-variant-numeric:tabular-nums}
body.vn .vn-sec .vn-price__sum span{font-size:1.05rem;color:rgba(250,248,244,.74)}
.vn-price ul{list-style:none;margin:0 0 22px!important;padding:0!important;display:grid;gap:0}
body.vn .vn-price li{margin:0;padding:13px 0 13px 34px;position:relative;border-top:1px solid rgba(250,248,244,.12);font-size:1.02rem;line-height:1.4;color:#faf8f4}
.vn-price li::before{content:"";position:absolute;left:0;top:50%;width:20px;height:20px;margin-top:-10px;border-radius:50%;background:var(--vn-mint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.6 10.4l3 3 5.8-6.4' fill='none' stroke='%2316291d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat}
body.vn .vn-sec .vn-price__not{font-size:.95rem!important;margin:0 0 24px!important}
.vn-price .btn{width:100%;justify-content:center;background:#fff;color:var(--vn-deep);box-shadow:none}
.vn-price .btn:hover{background:var(--vn-mint);color:var(--vn-deep)}

/* ===== 10 frågor ===== */
.vn-faqwrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,6vw,96px);align-items:start}
.vn-head--side{margin-bottom:0!important;position:sticky;top:110px}
.vn-faq{display:grid;gap:12px}
body.vn .vn-faq details{border-radius:24px;background:var(--vn-card);border:1px solid var(--vn-line);transition:box-shadow .4s var(--vn-ease),border-color .4s}
body.vn .vn-faq details[open]{border-color:rgba(45,90,63,.3);box-shadow:0 26px 48px -36px rgba(22,41,29,.4)}
body.vn .vn-faq summary{list-style:none;cursor:pointer;position:relative;padding:22px 64px 22px 28px;font:700 clamp(1.1rem,1rem + .4vw,1.3rem)/1.3 "Cabinet Grotesk","Inter Tight",sans-serif;letter-spacing:-.015em;color:var(--vn-ink)}
body.vn .vn-faq summary::-webkit-details-marker{display:none}
body.vn .vn-faq summary::after{content:"";position:absolute;right:22px;top:50%;width:30px;height:30px;margin-top:-15px;border-radius:50%;background:#e8f1ea url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath d='M9 15h12M15 9v12' stroke='%232d5a3f' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/30px no-repeat;transition:transform .4s var(--vn-ease),background-color .3s}
body.vn .vn-faq details[open] summary::after{transform:rotate(135deg);background-color:var(--vn-mint)}
body.vn .vn-faq summary:focus-visible{outline:2px solid var(--vn-pine);outline-offset:-4px;border-radius:24px}
.vn-faq__a{padding:0 28px 6px}
body.vn .vn-faq__a p{font-size:1.0625rem;margin:0 0 18px;max-width:none}
body.vn .vn-faq details[open] .vn-faq__a{animation:vnDown .5s var(--vn-ease)}
@keyframes vnDown{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* ===== Kom igång ===== */
body.vn .vn-cta{background:linear-gradient(120deg,#204130,#2d5a3f 55%,#3a6e4f);background-size:160% 160%;animation:vnGrad 18s ease-in-out infinite alternate;color:#fff;padding:clamp(72px,9vw,130px) 0;text-align:center;overflow:hidden}
@keyframes vnGrad{from{background-position:0% 50%}to{background-position:100% 50%}}
.vn-cta__in{max-width:760px!important}
body.vn .vn-cta h2{color:#fff;margin:0 auto 20px;max-width:none;font-size:clamp(2.4rem,1.5rem + 3.4vw,4.6rem)}
body.vn .vn-cta p{color:rgba(255,255,255,.84);margin:0 auto 34px;max-width:46ch}
body.vn .vn-cta p a{color:#fff}
body.vn .vn-cta .artikel-cta{margin:0;background:#fff;color:var(--vn-deep);box-shadow:0 22px 40px -22px rgba(0,0,0,.5);transition:transform .35s var(--vn-ease),background .25s}
body.vn .vn-cta .artikel-cta:hover{background:var(--vn-mint);color:var(--vn-deep);transform:translateY(-3px)}

/* ===== Vidare läsning ===== */
.vn-rel{padding-top:clamp(56px,7vw,96px);padding-bottom:clamp(56px,7vw,96px)}
body.vn .vn-rel .v3-related{padding:0;max-width:none}
body.vn .vn-rel .v3-related>h2{font-weight:700;letter-spacing:-.03em}
body.vn .v3-related-card{display:flex;flex-direction:column;transition:transform .5s var(--vn-ease),box-shadow .5s var(--vn-ease)}
body.vn .v3-related-card:hover{transform:translateY(-6px);box-shadow:0 28px 50px -32px rgba(22,41,29,.45)}

/* ===== sidonavigering (prickar) på bred skärm ===== */
.vn-dots{position:fixed;right:22px;top:50%;transform:translateY(-50%);z-index:40;display:none;flex-direction:column;align-items:flex-end;gap:4px}
@media (min-width:1360px){.vn-dots{display:flex}}
.vn-dots a{position:relative;display:flex;align-items:center;justify-content:flex-end;gap:10px;height:20px;text-decoration:none;color:var(--vn-ink)}
.vn-dots a span{font-size:.78rem;font-weight:600;padding:5px 11px;border-radius:999px;background:var(--vn-deep);color:#fff;opacity:0;transform:translateX(6px);transition:opacity .25s,transform .3s var(--vn-ease);pointer-events:none;white-space:nowrap}
.vn-dots a i{display:block;width:8px;height:8px;border-radius:999px;background:rgba(22,41,29,.28);transition:height .45s var(--vn-ease),background .3s}
.vn-dots a:hover span,.vn-dots a:focus-visible span{opacity:1;transform:none}
.vn-dots a[aria-current="true"] i{height:26px;background:var(--vn-pine)}
.vn-dots a:hover i{background:var(--vn-pine)}
.vn-dots.vn-dark a i{background:rgba(255,255,255,.4)}
.vn-dots.vn-dark a[aria-current="true"] i{background:var(--vn-mint)}

/* ===== mobil ===== */
@media (max-width:900px){
  .vn-hero__grid{grid-template-columns:1fr;gap:32px}
  body.vn .vn-hero .rik-hero{aspect-ratio:1508/1100;border-radius:26px}
  .vn-chip{left:14px;bottom:14px}
  .vn-split,.vn-cost,.vn-faqwrap{grid-template-columns:1fr}
  .vn-split__fig,.vn-price,.vn-head--side{position:static}
  .vn-split__fig{order:-1}
  .vn-crit{grid-template-columns:1fr;gap:14px 0}
  .vn-crit__eller{margin:-4px 0}
  .vn-parts,.vn-evid,.vn-diff{grid-template-columns:1fr}
  .vn-tl{grid-template-columns:1fr;gap:30px;padding-left:0!important}
  .vn-tl::before,.vn-tl::after{left:11px;right:auto;top:12px;bottom:12px;width:2px;height:auto;transform-origin:top}
  .vn-js .vn-tl:not(.vn-in)::after{transform:scaleY(0)}
  body.vn .vn-tl>li{padding:0 0 0 48px}
  .vn-tl__dot{top:2px}
  .vn-faq__a{padding:0 20px 4px}
  body.vn .vn-faq summary{padding:20px 60px 20px 20px}
  .vn-long{grid-template-columns:1fr}
  .vn-long__fig{width:min(70%,260px);justify-self:start}
}
@media (max-width:560px){
  .vn-wrap{padding-left:18px;padding-right:18px}
  body.vn .vn-sec h2{max-width:none}
  .vn-bar{grid-template-columns:78px minmax(0,1fr) 46px;gap:8px}
  body.vn .vn-parts>li{padding:76px 20px 22px}
  .vn-parts__nr{left:20px;top:22px}
  .vn-hero__cta .btn{flex:1 1 100%;justify-content:center}
}

/* ===== utan JS och med reducerad rörelse: slutläget direkt ===== */
@media (prefers-reduced-motion:reduce){
  .vn-js .vn-r,.vn-js .vn-tl>li{opacity:1!important;transform:none!important;transition:none!important}
  .vn-js .vn-evid>li .vn-bar i{transform:none!important}
  .vn-tl::after{transform:none!important;transition:none!important}
  .vn-tl .vn-tl__dot{transition:none}
  .vn-hero h1,.vn-hero .ip-kicker,.vn-hero .lead,.vn-hero__cta,.vn-hero .ip-byline,.vn-hero__media,.vn-chip,.vn-cta,.vn-sec--dark::before{animation:none!important}
}

/* grafikblockens etiketter (p-element i sektionerna ska inte ärva brödtextens storlek) */
body.vn .vn-sec .rik-block p{max-width:none;margin:0}
body.vn .vn-sec .rik-block .rik-block__etikett{font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--lp-ink-muted,#5a625c);margin:0 0 8px}
body.vn .vn-sec .rik-block .rik-block__rubrik{font-family:"Cabinet Grotesk","Cabinet Grotesk Fallback","Inter Tight",sans-serif;font-weight:700;line-height:1.15;color:var(--vn-ink);margin:0 0 clamp(22px,3vw,34px)}
body.vn .vn-sec .rik-block--mork .rik-block__etikett{color:rgba(250,248,244,.62)}
body.vn .vn-sec .rik-block--mork .rik-block__rubrik{color:#faf8f4}
body.vn .vn-sec .rik-lyft__text{margin:0}
body.vn .vn-sec .rik-rutin__steg span{max-width:none}
body.vn .vn-sec .rik-kedja{margin-bottom:0}
html{scroll-padding-top:90px}

/* BMI-skala under urvalet */
.vn-scale{margin-top:clamp(36px,4vw,56px)}
.vn-scale__track{position:relative;height:16px;border-radius:999px;background:rgba(22,41,29,.08)}
.vn-scale__track i{position:absolute;top:0;bottom:0;border-radius:999px;transform-origin:left;transition:transform 1.6s var(--vn-ease) .2s}
.vn-scale__a{left:18.75%;width:18.75%;background:linear-gradient(90deg,#9ccbae,#6aa883);border-radius:0!important}
.vn-scale__b{left:37.5%;right:0;background:linear-gradient(90deg,#2d5a3f,#16291d);border-radius:0 999px 999px 0!important}
.vn-js .vn-scale:not(.vn-in) .vn-scale__track i{transform:scaleX(0)}
.vn-scale__b{transition-delay:.9s!important}
.vn-scale__track u{position:absolute;top:-6px;left:var(--p);width:2px;height:28px;background:var(--vn-ink);text-decoration:none}
.vn-scale__track u b{position:absolute;top:34px;left:50%;transform:translateX(-50%);font:700 1.05rem/1 "Cabinet Grotesk","Inter Tight",sans-serif;color:var(--vn-ink);font-variant-numeric:tabular-nums}
body.vn .vn-sec .vn-scale__leg{display:flex;flex-wrap:wrap;gap:8px 26px;margin:54px 0 0;font-size:.9rem;max-width:none}
.vn-scale__k{display:inline-flex;align-items:center;gap:9px;color:var(--vn-soft)}
.vn-scale__k::before{content:"";width:12px;height:12px;border-radius:50%}
.vn-scale__k--a::before{background:#6aa883}
.vn-scale__k--b::before{background:#16291d}
@media (max-width:900px){.vn-scale__track u b{top:30px}}

/* kedjans kort lite större */
body.vn .vn-sec .rik-kedja__led li strong{font-size:1.08rem}
body.vn .vn-sec .rik-kedja__led li span{font-size:.97rem;line-height:1.5}

/* tangentbordsfokus */
body.vn .vn-main a:focus-visible,body.vn .vn-main summary:focus-visible{outline:2px solid var(--vn-pine);outline-offset:3px;border-radius:8px}
body.vn .vn-sec--dark a:focus-visible,body.vn .vn-cta a:focus-visible,body.vn .vn-price a:focus-visible{outline-color:var(--vn-mint)}

/* fast knapp på mobil */
.vn-sticky{position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:45;display:none;transform:translateY(140%);transition:transform .5s var(--vn-ease)}
.vn-sticky a{display:flex;justify-content:center;align-items:center;min-height:54px;border-radius:999px;background:var(--vn-pine);color:#fff;font:600 1.02rem/1 "Cabinet Grotesk","Inter Tight",sans-serif;text-decoration:none;box-shadow:0 18px 36px -14px rgba(22,41,29,.65)}
.vn-sticky.vn-show{transform:none}
@media (max-width:900px){.vn-sticky{display:block}}
@media (prefers-reduced-motion:reduce){.vn-sticky{transition:none}}

body.vn .vn-hero .rik-hero{background:#e9e4d3}
body.vn .vn-hero .rik-hero img{object-position:28% 50%}
