/* Skuggr: stilmallen. Uppbyggnad, klassnamn och värden följer glasr.se (landing/landing.css) regel för regel;
   färger, typsnitt och mått kommer från tokens.css. Lägg aldrig en färg direkt här, lägg den i tokens.css. */
html,body{margin:0;background:var(--bg);overflow-x:hidden}

/* Första vyn: rubrik, ingress och fem mobilskärmar */
*{box-sizing:border-box;margin:0}
body{font-family:var(--font);color:var(--ink);background:var(--bg);overflow-x:hidden;-webkit-font-smoothing:antialiased}
.ram{max-width:var(--max);margin:0 auto;padding:0 var(--sidmarg)}
.topp{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:end;padding:64px 0 44px}
h1{font-size:var(--h1);line-height:var(--h1-lh);letter-spacing:var(--h1-ls);font-weight:700;max-width:560px}
.topp p{font-size:17px;line-height:1.6;color:var(--text2);max-width:470px}
.knappar{display:flex;align-items:center;gap:18px;margin-top:22px;flex-wrap:wrap}
.cta{background:var(--accent);color:var(--vit);border-radius:var(--radie-knapp);padding:12px 20px;font-weight:600;font-size:15px}
.ring{font-size:14.5px;color:var(--text2)}
.ring b{color:var(--ink);font-weight:600}
.rad{display:grid;grid-template-columns:repeat(5,1fr);gap:22px;padding-bottom:72px;perspective:1100px}
.tel{transform:perspective(800px) translateY(0) rotateY(var(--ry)) scale(var(--sk));animation:s2Snurra 1.1s cubic-bezier(.2,.75,.2,1) both;animation-delay:calc(var(--i) * 140ms + 150ms)}
@keyframes s2Snurra{from{opacity:0;transform:perspective(800px) translateY(70px) rotateY(var(--fran)) scale(.85)}to{opacity:1;transform:perspective(800px) translateY(0) rotateY(var(--ry)) scale(var(--sk))}}
@media (prefers-reduced-motion:reduce){.tel{animation:none}}
.tel{border-radius:30px;padding:7px;background:var(--ink)}
.skarm{border-radius:24px;overflow:hidden;background:var(--vit)}
.text{margin-top:16px;font-size:14px;line-height:1.5;color:var(--text2)}
.text b{display:block;color:var(--ink);font-weight:600;margin-bottom:2px}
.vit{background:var(--vit);border-top:1px solid var(--linje)}
.tva{display:grid;grid-template-columns:1fr 1fr;gap:48px;padding-top:72px;padding-bottom:72px}
.tva h2{font-size:30px;line-height:1.2;letter-spacing:-.02em;font-weight:700}
.tva p{font-size:16.5px;line-height:1.65;color:var(--text2)}
.tva p+p{margin-top:14px}
@media (max-width:900px){.topp,.tva{grid-template-columns:1fr;gap:16px;padding-top:40px}
h1{font-size:34px}
.rad{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:24px;margin:0 -24px;padding:0 24px 56px;gap:16px}
.rad>div{flex:0 0 62vw;scroll-snap-align:start}
.tel{--ry:0deg!important;--sk:1!important}}
.skarm{aspect-ratio:390/844;container-type:inline-size;position:relative;font-family:var(--font);color:var(--ink);display:flex;flex-direction:column}
.sb{height:calc(var(--u)*50);flex:none;display:flex;align-items:flex-end;justify-content:space-between;padding:0 calc(var(--u)*30) calc(var(--u)*8);font-weight:600;font-size:calc(var(--u)*16)}
.sb i{display:flex;gap:calc(var(--u)*6);align-items:center}
.sb .sig{align-items:flex-end;gap:calc(var(--u)*2)}
.sb i b{display:block;background:var(--ink);border-radius:calc(var(--u)*2)}
.sb .sig b{width:calc(var(--u)*3.5)}
.sb .bat{width:calc(var(--u)*25);height:calc(var(--u)*12);border:calc(var(--u)*1.5) solid var(--ink);border-radius:calc(var(--u)*4);padding:calc(var(--u)*1.5)}
.sb .bat b{height:100%;width:75%}
.sb.gron{background:var(--gr2)}
.inne{flex:1;overflow:hidden;padding:calc(var(--u)*14) calc(var(--u)*18) 0;font-size:calc(var(--u)*14)}
.h{font-size:calc(var(--u)*30);font-weight:700;letter-spacing:-.02em}
.mu{color:var(--mu);font-size:calc(var(--u)*13.5)}
.kort{border:1px solid var(--li);border-radius:calc(var(--u)*14);padding:calc(var(--u)*14);margin-top:calc(var(--u)*14)}
.kn{background:var(--gr);color:var(--vit);border-radius:calc(var(--u)*12);text-align:center;font-weight:700;padding:calc(var(--u)*13);margin-top:calc(var(--u)*12);font-size:calc(var(--u)*15)}
.kn.vit{background:var(--vit);color:var(--ink);border:1px solid var(--tel-kant)}
.tva2{display:flex;gap:calc(var(--u)*8)}
.tva2>*{flex:1}
.ra{display:flex;align-items:center;gap:calc(var(--u)*12);padding:calc(var(--u)*11) 0;border-bottom:1px solid var(--li)}
.ra .t{font-weight:700;width:calc(var(--u)*46)}
.ra b{display:block;font-size:calc(var(--u)*14.5)}
.tag{margin-left:auto;font-size:calc(var(--u)*11);font-weight:700;border-radius:calc(var(--u)*6);padding:calc(var(--u)*3) calc(var(--u)*7);background:var(--gr2);color:var(--gr)}
.lbl{font-size:calc(var(--u)*12);font-weight:700;color:var(--mu);text-transform:uppercase;letter-spacing:.06em;margin-top:calc(var(--u)*20)}
.meny{flex:none;height:calc(var(--u)*82);border-top:1px solid var(--li);display:flex;padding-top:calc(var(--u)*8);background:var(--vit)}
.meny span{flex:1;text-align:center;font-size:calc(var(--u)*11);font-weight:600;color:var(--mu)}
.meny span::before{content:"";display:block;width:calc(var(--u)*22);height:calc(var(--u)*22);margin:0 auto calc(var(--u)*4);border:calc(var(--u)*2) solid currentColor;border-radius:calc(var(--u)*6)}
.meny span.pa{color:var(--gr)}
.hem{position:absolute;bottom:calc(var(--u)*8);left:50%;transform:translateX(-50%);width:calc(var(--u)*134);height:calc(var(--u)*5);border-radius:9px;background:var(--ink)}
.mtop{background:var(--gr);color:var(--vit);display:flex;justify-content:space-between;align-items:center;padding:calc(var(--u)*10) calc(var(--u)*18);font-weight:600;font-size:calc(var(--u)*14)}
.steg{display:flex;justify-content:space-between;padding:calc(var(--u)*12) calc(var(--u)*24);border-bottom:1px solid var(--li)}
.steg span{text-align:center;font-size:calc(var(--u)*11);color:var(--mu);font-weight:600}
.steg span::before{content:attr(data-n);display:grid;place-items:center;width:calc(var(--u)*24);height:calc(var(--u)*24);border-radius:50%;margin:0 auto calc(var(--u)*4);background:var(--gr2);color:var(--gr);font-size:calc(var(--u)*12)}
.steg span.pa{color:var(--ink)}
.steg span.pa::before{background:var(--ink);color:var(--vit)}
.skiss{margin-top:calc(var(--u)*14);border:1px solid var(--li);border-radius:calc(var(--u)*14);background:var(--tel-skiss) linear-gradient(var(--tel-rutnat) 1px,transparent 1px) 0 0/calc(var(--u)*18) calc(var(--u)*18),linear-gradient(90deg,var(--tel-rutnat) 1px,transparent 1px) 0 0/calc(var(--u)*18) calc(var(--u)*18)}
.skiss svg{display:block;width:100%;height:auto}
.skiss .glas{fill:var(--tel-glas-fyll);stroke:var(--tel-glas);stroke-width:3;stroke-dasharray:1000;stroke-dashoffset:1000;animation:s2Rita 1.6s ease-out 1.3s forwards}
.skiss .mlinje{stroke:var(--gr);stroke-width:1.6;opacity:0;animation:s2Fram .5s ease-out 2.7s forwards}
.skiss text{font:600 15px var(--font);fill:var(--gr);opacity:0;animation:s2Fram .5s ease-out 2.9s forwards}
@keyframes s2Rita{to{stroke-dashoffset:0}}
@keyframes s2Fram{to{opacity:1}}
.rutor{display:flex;gap:calc(var(--u)*8);margin-top:calc(var(--u)*10)}
.rutor div{flex:1;border:1px solid var(--li);border-radius:calc(var(--u)*12);padding:calc(var(--u)*10) calc(var(--u)*12);font-size:calc(var(--u)*11);color:var(--mu);font-weight:600;letter-spacing:.04em}
.rutor b{display:block;color:var(--ink);font-size:calc(var(--u)*20);letter-spacing:-.01em;margin-top:calc(var(--u)*2)}
.kol{display:flex;gap:calc(var(--u)*10);margin-top:calc(var(--u)*12);width:calc(var(--u)*470)}
.kol>div{flex:0 0 calc(var(--u)*220);background:var(--tel-kol);border-radius:calc(var(--u)*14);padding:calc(var(--u)*10)}
.kol h4{font-size:calc(var(--u)*13);display:flex;justify-content:space-between;margin-bottom:calc(var(--u)*8)}
.kol h4 em{font-style:normal;color:var(--mu)}
.kk{background:var(--vit);border-radius:calc(var(--u)*10);padding:calc(var(--u)*10);margin-bottom:calc(var(--u)*8);box-shadow:var(--tel-kort-skugga);font-size:calc(var(--u)*12.5)}
.kk b{display:block;font-size:calc(var(--u)*13.5)}
.kk i{display:block;height:calc(var(--u)*4);border-radius:4px;margin-top:calc(var(--u)*8);background:var(--c,var(--gr));width:var(--w,60%)}
.sms{background:var(--tel-sms);border-radius:calc(var(--u)*18);padding:calc(var(--u)*11) calc(var(--u)*14);font-size:calc(var(--u)*14);line-height:1.4;margin-top:calc(var(--u)*8);max-width:85%}
.pm{display:flex;align-items:center;gap:calc(var(--u)*8);margin-left:auto;font-weight:700}
.pm em{font-style:normal;display:grid;place-items:center;width:calc(var(--u)*34);height:calc(var(--u)*34);border:1px solid var(--tel-kant);border-radius:calc(var(--u)*9);font-weight:500;font-size:calc(var(--u)*18)}

/* Toppraden och länkar */
a{color:inherit;text-decoration:none}
.topprad{display:flex;align-items:center;gap:24px;padding:22px 0;border-bottom:1px solid var(--linje)}
.topprad .gm{width:40px;height:40px;display:block}
.topprad .hoger{margin-left:auto;display:flex;align-items:center;gap:22px;font-size:14px;color:var(--text2)}
.topprad .hoger .l[aria-current]{color:var(--ink);font-weight:600}
.topprad .demo{border:1px solid var(--accent);color:var(--accent);border-radius:var(--radie-knapp);padding:8px 14px;font-weight:600}
.topprad .in{border:1px solid var(--linje4);background:none;border-radius:var(--radie-knapp);padding:8px 14px;color:var(--ink);font:500 14px var(--font);cursor:pointer}
.cta{display:inline-block}
button.cta,button.cta2{border:0;font-family:inherit;cursor:pointer}
.cta2{display:inline-block;background:var(--vit);color:var(--ink);border:1px solid var(--linje4)!important;border-radius:var(--radie-knapp);padding:11px 19px;font-weight:600;font-size:15px}
.cta:hover{background:var(--accent-hover)}
.cta2:hover{border-color:var(--ink)!important}

/* Avsnitt */
.band{padding:var(--band) 0;border-top:1px solid var(--linje)}
.band.vitt{background:var(--vit)}
.sek-huvud{max-width:760px}
.sek-huvud.mitten{margin:0 auto;text-align:center}
.sek-huvud.mitten .ingress{margin-left:auto;margin-right:auto}
.sek-huvud.mitten .knappar{justify-content:center}
.ogon{display:block;font-size:var(--ogon);font-weight:700;letter-spacing:var(--ogon-ls);text-transform:uppercase;color:var(--accent);margin-bottom:14px}
h2{font-size:var(--h2);line-height:var(--h2-lh);letter-spacing:var(--h2-ls);font-weight:700}
.sek-huvud.stor h2,.sid-hero h1{font-size:var(--h1);line-height:var(--h1-lh);letter-spacing:var(--h1-ls);font-weight:700}
.dim{color:var(--dim)}
.ingress{font-size:var(--ingress);line-height:var(--ingress-lh);color:var(--text2);max-width:640px;margin-top:16px}

/* Loggraden */
.loggor{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px 44px;padding-top:28px;padding-bottom:28px;font-size:14.5px;font-weight:600;color:var(--dim);letter-spacing:.01em}
.loggor b{color:var(--ink)}
.band:has(>.loggor){padding:0}

/* Demon: Glasr i ett fönster, styrs av skriptet i start.html */
.frame{margin-top:44px;background:var(--vit);border:1px solid var(--linje2);border-radius:var(--radie-ram);overflow:hidden;box-shadow:var(--skugga-ram)}
.frame .chrome{display:flex;align-items:center;gap:14px;padding:11px 16px;background:var(--yta);border-bottom:1px solid var(--linje);font-size:12.5px;color:var(--text2)}
.frame .dots{display:flex;gap:6px}
.frame .dots i{width:10px;height:10px;border-radius:50%;background:var(--linje3)}
.frame .chrome .t{font-weight:600;color:var(--ink)}
.frame .chrome .r{margin-left:auto;color:var(--dim)}
.frame .body{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:440px}
.frame .side{background:var(--yta);border-right:1px solid var(--linje);padding:18px 14px;display:flex;flex-direction:column;gap:6px;font-size:13.5px}
.frame .brand{font-weight:800;font-size:19px;letter-spacing:-.02em;padding:0 8px 10px}
.frame .brand b{color:var(--accent)}
.frame .who{display:flex;gap:10px;align-items:center;padding:10px 8px;border-radius:10px;background:var(--vit);border:1px solid var(--linje)}
.frame .who .av{width:30px;height:30px;flex:0 0 30px;border-radius:var(--radie-knapp);background:var(--accent);color:var(--vit);display:grid;place-items:center;font-weight:700}
.frame .who>div:last-child{min-width:0}
.frame .who .n{font-weight:600;font-size:12.5px;overflow-wrap:anywhere}
.frame .who .s{font-size:11.5px;color:var(--dim)}
.frame .sec{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--dim);margin:14px 8px 4px}
.frame .mi{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:var(--radie-knapp);cursor:pointer;color:var(--text2)}
.frame .mi:hover{background:var(--yta-hover)}
.frame .mi.on{background:var(--accent-ljus);color:var(--accent);font-weight:600}
.frame svg{flex:none}
.frame .mi svg,.tabs button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.frame .foot{margin-top:auto;display:flex;gap:8px;font-size:12px;color:var(--dim);padding:8px}
.frame .main{padding:22px 26px;min-width:0}
.frame .crumb{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--dim);flex-wrap:wrap}
.frame .crumb b{color:var(--ink)}
.frame .st{margin-left:auto;background:var(--accent-ljus);color:var(--accent);font-weight:700;font-size:12px;border-radius:999px;padding:4px 10px}
.frame .content{margin-top:18px}
.frame .kicker{font-size:12.5px;color:var(--dim)}
.frame .h2{font-size:22px;font-weight:700;letter-spacing:-.015em;margin:4px 0 16px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.frame .tag{margin:0;font-size:11px;font-weight:700;border-radius:6px;padding:3px 8px;background:var(--accent-ljus);color:var(--accent);letter-spacing:.02em}
.frame .grid svg{max-width:100%;height:auto;display:block;border:1px solid var(--linje);border-radius:10px}
.frame .chip{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:1px solid var(--accent-kant);background:var(--accent-yta);border-radius:10px;padding:10px 14px;font-size:13.5px;margin-bottom:16px}
.frame .chip .m{color:var(--dim);font-size:12.5px}
.frame .chip .ok{margin-left:auto;color:var(--accent);font-weight:700}
.frame table{width:100%;border-collapse:collapse;font-size:13.5px}
.frame th{text-align:left;font-size:11px;letter-spacing:.08em;color:var(--dim);font-weight:700;padding:8px 8px 8px 0;border-bottom:1px solid var(--linje)}
.frame td{padding:11px 8px 11px 0;border-bottom:1px solid var(--linje5);vertical-align:top}
.frame .r{text-align:right}
.frame td.b,.frame td .b{font-weight:600}
.frame td .d{display:block;font-weight:400;color:var(--dim);font-size:12px;margin-top:2px}
.frame .sum{display:flex;justify-content:space-between;align-items:baseline;padding:14px 0 0;font-weight:700}
.frame .sum .l{color:var(--text2);font-weight:600;font-size:14px}
.frame .sum .v{font-size:22px;letter-spacing:-.01em}
.frame .foot2{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:20px;font-size:12.5px;color:var(--dim)}
.frame .gbtn{background:var(--accent);color:var(--vit);border:0;border-radius:var(--radie-knapp);padding:9px 14px;font:600 13px var(--font);cursor:pointer}
.frame .week{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.frame .day{border:1px solid var(--linje);border-radius:10px;padding:10px;min-height:150px;font-size:12.5px;background:var(--yta-falt)}
.frame .day b{display:block;margin-bottom:8px}
.frame .slot{background:var(--vit);border:1px solid var(--accent-kant);border-left:3px solid var(--accent);border-radius:7px;padding:8px;line-height:1.45;margin-bottom:6px}
.frame .slot.o{border-color:var(--varning-kant);border-left-color:var(--varning);background:var(--varning-yta)}
.tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:22px}
.tabs button{display:inline-flex;align-items:center;gap:8px;background:var(--vit);border:1px solid var(--linje3);border-radius:999px;padding:8px 14px;font:500 13.5px var(--font);color:var(--text2);cursor:pointer}
.tabs button.on{background:var(--ink);border-color:var(--ink);color:var(--vit)}
.tabs .play{background:var(--accent);border-color:var(--accent);color:var(--vit);width:38px;justify-content:center;padding:8px 0}
.cap{text-align:center;margin-top:18px;font-size:15px;color:var(--text2)}
.cap b{display:block;color:var(--ink);font-size:17px;margin-bottom:4px}

/* Moduler */
.mod{display:grid;grid-template-columns:1.05fr 1fr;gap:64px;align-items:center;padding:56px 0;border-top:1px solid var(--linje)}
.sek-huvud+.mod{margin-top:40px;border-top:0;padding-top:0}
.mod:last-child{padding-bottom:0}
.mod.rev .txt{order:2}
.mod .kat{font-size:12.5px;letter-spacing:.12em;color:var(--accent);font-weight:700;text-transform:uppercase}
.mod h3{font-size:30px;letter-spacing:-.02em;margin:10px 0 8px}
.mod .led{font-size:18px;font-weight:500;margin-bottom:12px}
.mod p{color:var(--text2);line-height:1.7;font-size:15.5px;margin-bottom:20px}
.mod ul,.p ul{list-style:none;padding:0}
.mod ul{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px}
.mod li,.p li{font-size:14px;display:flex;gap:10px;align-items:flex-start;line-height:1.45}
.mod li::before,.p li::before{content:"✓";color:var(--accent);font-weight:800}
.mod .bild{background:var(--bg);border:1px solid var(--linje);border-radius:var(--radie-ram);aspect-ratio:4/3;display:grid;place-items:center;overflow:hidden}
.mod .bild svg{max-width:100%;height:auto}

/* Roller */
.roller{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px}
.roll{background:var(--vit);border:1px solid var(--linje);border-radius:var(--radie-kort);padding:24px 22px;display:flex;flex-direction:column;gap:10px}
.roll .v{color:var(--accent);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.roll .r{font-size:19px;font-weight:700}
.roll p{color:var(--text2);font-size:14.5px;line-height:1.65;flex:1}
.taggar{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.taggar span{font-size:12px;font-weight:600;color:var(--text2);background:var(--bg);border:1px solid var(--linje);border-radius:6px;padding:3px 8px}

/* Så tänker vi */
.metod{display:grid;grid-template-columns:repeat(2,1fr);gap:28px 56px;margin-top:40px;counter-reset:m}
.metod .m{border-top:1px solid var(--linje);padding-top:22px;counter-increment:m}
.metod h4{font-size:19px;font-weight:700;display:flex;gap:12px;align-items:baseline}
.metod h4::before{content:"0" counter(m);font-size:13px;color:var(--accent);font-weight:700}
.metod p{color:var(--text2);font-size:15.5px;line-height:1.7;margin-top:10px}


/* Abonnemang */
.paket{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px;align-items:stretch}
.p{position:relative;background:var(--vit);border:1px solid var(--linje);border-radius:var(--radie-kort);padding:28px 26px;display:flex;flex-direction:column}
.p.pop{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.p .pop-tag{position:absolute;top:-11px;left:26px;background:var(--accent);color:var(--vit);font-size:11px;font-weight:800;letter-spacing:.1em;padding:4px 10px;border-radius:999px}
.p .n{font-size:22px;font-weight:700;letter-spacing:-.01em}
.p .anv{color:var(--accent);font-size:13.5px;font-weight:600;margin-top:4px}
.p .i{color:var(--text2);font-size:14.5px;line-height:1.6;margin:14px 0 18px}
.p ul{display:flex;flex-direction:column;gap:9px;flex:1;margin-bottom:24px}
.p .btn{display:block;text-align:center;border:1px solid var(--linje4);border-radius:var(--radie-knapp);padding:11px;font-weight:600;font-size:14.5px}
.p.pop .btn{background:var(--accent);border-color:var(--accent);color:var(--vit)}
.tillagg{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:16px}
.ti{background:var(--yta);border:1px solid var(--linje);border-radius:var(--radie-kort);padding:20px}
.ti .n{font-weight:700;font-size:15.5px}
.ti p{color:var(--text2);font-size:13.5px;line-height:1.6;margin-top:6px}
.pris-fin{margin-top:28px;color:var(--text2);font-size:15px}
.pris-fin a{color:var(--ink);font-weight:600}

/* Vanliga frågor */
.fraglista{margin-top:36px;max-width:860px}
.frag{border-top:1px solid var(--linje2)}
.frag:last-child{border-bottom:1px solid var(--linje2)}
.frag summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:16px;padding:19px 0;font-size:17px;font-weight:600}
.frag summary::-webkit-details-marker{display:none}
.frag summary::after{content:"+";margin-left:auto;font-size:22px;font-weight:400;color:var(--accent);transition:transform .18s}
.frag[open] summary::after{transform:rotate(45deg)}
.frag p{padding:0 0 22px;color:var(--text2);font-size:15.5px;line-height:1.7;max-width:70ch}

/* Sidfot */
.sidfot{border-top:1px solid var(--linje);padding:56px 0 36px;font-size:14px;color:var(--text2)}
.sidfot .gm{width:34px;height:34px;display:block}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px;margin-bottom:40px}
.fgrid p{margin-top:14px;max-width:300px;line-height:1.6}
.fgrid h5{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);margin-bottom:12px}
.fgrid a{display:block;padding:4px 0}
.fgrid a:hover,.fbot a:hover{color:var(--ink)}
.fbot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;border-top:1px solid var(--linje);padding-top:22px;font-size:13px}
.fbot .lankar{display:flex;gap:18px}

/* Undersidornas rubrik */
.sid-hero{border-top:0;padding-top:64px}

/* Kontakta oss */
.kgrid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:start;margin-top:44px}
form{background:var(--vit);border:1px solid var(--linje);border-radius:var(--radie-ram);padding:28px}
label{display:block;font-size:13px;color:var(--text2);font-weight:600;margin:14px 0 6px}
form>label:first-child{margin-top:0}
input,select,textarea{width:100%;background:var(--yta-falt);border:1px solid var(--linje3);border-radius:var(--radie-knapp);color:var(--ink);padding:12px 13px;font:15px var(--font)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring);background:var(--vit)}
textarea{min-height:120px;resize:vertical}
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.send{margin-top:20px;width:100%;background:var(--accent);color:var(--vit);border:0;border-radius:var(--radie-knapp);padding:14px;font:600 15px var(--font);cursor:pointer}
.send:hover{background:var(--accent-hover)}
.fin{color:var(--dim);font-size:13px;margin-top:12px;line-height:1.55}
.ktk{border:1px solid var(--linje);background:var(--vit);border-radius:var(--radie-kort);padding:22px;margin-bottom:14px}
.ktk b{display:block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:6px}
.ktk .v{font-size:19px;font-weight:600}
.ktk p{margin-top:6px;color:var(--text2);font-size:14.5px;line-height:1.6}

/* Padda */
@media (max-width:1100px){
.roller{grid-template-columns:1fr 1fr}
.tillagg{grid-template-columns:1fr 1fr}
.mod{gap:40px}
}
/* Telefon och smal padda */
@media (max-width:900px){
.topprad{gap:10px;padding:14px 0}
.topprad .gm{width:34px;height:34px}
.topprad .hoger{gap:8px}
.topprad .hoger .l{display:none}
.topprad .demo,.topprad .in{padding:8px 12px;font-size:13px}
.band{padding:var(--band-mobil) 0}
h2{font-size:28px}
.sek-huvud.stor h2,.sid-hero h1{font-size:34px}
.sid-hero{padding-top:40px}
.ingress{font-size:16px}
.frame .body{grid-template-columns:1fr;min-height:0}
.frame .side{display:none}
.frame .chrome .r{display:none}
.frame .main{padding:18px 16px}
.frame .week{grid-template-columns:1fr}
.frame .day{min-height:0}
.mod,.metod,.paket,.teamgrid,.fakta,.kgrid{grid-template-columns:1fr}
.mod{gap:28px;padding:44px 0}
.mod.rev .txt{order:0}
.fgrid{grid-template-columns:1fr 1fr}
.fgrid>div:first-child{grid-column:1/-1}
}
@media (max-width:560px){
.roller,.tillagg,.two{grid-template-columns:1fr}
.two{gap:0}
.mod ul{grid-template-columns:1fr}
.tabs button{padding:7px 11px;font-size:12.5px}
form{padding:20px}
/* Skuggr: solskyddsföretagets är längre än glasmästeriets och får inte plats i 34 px på en telefon */
.sek-huvud.stor h2{font-size:29px}
}

/* ═══ Skuggrs tillägg. Glasr sätter de här värdena i style-attribut och onclick; CSP:n här tillåter bara 'self',
   så samma värden ligger som klasser i stället. Inga nya färger. ═══ */
.hopp{position:absolute;left:-9999px}
.hopp:focus{left:12px;top:12px;z-index:50;background:var(--ink);color:var(--vit);padding:8px 12px;border-radius:var(--radie-knapp)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.topprad .logga{display:block}

/* Mobilskärmarnas lutning och ordning (Glasr: --i, --ry, --sk, --fran per skärm) */
.tel.v1{--i:2;--ry:24deg;--sk:.95;--fran:-80deg}
.tel.v2{--i:1;--ry:0deg;--sk:1;--fran:-60deg}
.tel.v3{--i:0;--ry:0deg;--sk:1;--fran:0deg}
.tel.v4{--i:1;--ry:0deg;--sk:1;--fran:60deg}
.tel.v5{--i:2;--ry:-24deg;--sk:.95;--fran:80deg}
.sb .sig b:nth-child(1){height:calc(var(--u)*4)}
.sb .sig b:nth-child(2){height:calc(var(--u)*6)}
.sb .sig b:nth-child(3){height:calc(var(--u)*8)}
.sb .sig b:nth-child(4){height:calc(var(--u)*10)}
.sb.fylld{background:var(--gr);color:var(--vit)}
.inne.utan-topp{padding-top:0}
.kort .namn{display:block;font-size:calc(var(--u)*20);margin-top:calc(var(--u)*4)}
.kort .uppg{margin-top:calc(var(--u)*6)}
.kort .jobb{display:block;font-size:calc(var(--u)*15)}
.kort.luft8{margin-top:calc(var(--u)*8)}
.mu.luft6{margin-top:calc(var(--u)*6)}
.mu.luft8{margin-top:calc(var(--u)*8)}
.kn.mork{background:var(--ink)}
.h.mindre{font-size:calc(var(--u)*24)}
.ra.utan-linje{border:0}
.kk i.o{--c:var(--stapel)}
.kk i.w20{--w:20%}.kk i.w30{--w:30%}.kk i.w35{--w:35%}.kk i.w55{--w:55%}.kk i.w70{--w:70%}.kk i.w80{--w:80%}
.pavag{background:var(--gr2);padding:0 calc(var(--u)*18) calc(var(--u)*12);display:flex;justify-content:space-between;align-items:center}
.pavag .till{color:var(--gr);font-weight:700;font-size:calc(var(--u)*13)}
.pavag .klocka{font-weight:700;font-size:calc(var(--u)*24)}
.pavag .kn{margin:0;padding:calc(var(--u)*9) calc(var(--u)*16)}

/* Demon: stegen ligger färdiga i sidan, skriptet visar ett i taget */
.frame [data-panel][hidden]{display:none}
.frame button.mi{width:100%;border:0;background:none;font:inherit;text-align:left}
.frame .slot .ok{color:var(--accent)}
.frame .pris{color:var(--dim);font-weight:400}

/* Undersidor: integritet och 404 */
.prosa{max-width:760px}
.prosa h2{font-size:22px;letter-spacing:-.01em;margin-top:36px}
.prosa p{color:var(--text2);font-size:15.5px;line-height:1.7;margin-top:12px;max-width:70ch}
.prosa a{color:var(--ink);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.ktk a.v{display:block}
/* Accenten i de inbäddade bilderna (logga, skisser) hämtas också ur tokens.css */
svg .af{fill:var(--accent)}
svg .as{stroke:var(--accent)}
svg .al{fill:var(--accent-ljus)}
.prosa ul{color:var(--text2);font-size:15.5px;line-height:1.7;margin-top:12px;padding-left:20px}
/* Glasr: om- och kontaktsidan har sidfoten utan övre luft och utan linje ovanför den nedersta raden */
.undersida~.sidfot{padding-top:0}
.undersida~.sidfot .fbot{border-top:0}