/* Godisträdet: bas för alla mallar (ur prototyp/mallar/_bygg_mallar.py, godkänd 2026-11-04). */
*,*::before,*::after{box-sizing:border-box}
:root{--bg:#fff8f0;--yta:#fff;--yta2:#fdf1e6;--text:#2b1a12;--text2:#5e4636;--kant:#e3cfbd;--accent:#b8185a;--pa-accent:#fff;--fokus:#1f4fd1;--stam:#8b5a3c;--kontur:rgba(43,26,18,.2);--annons:#f1ebe6;--annons-kant:#8c7e75;--bra:#1e7a46;--varn:#9a4b00;--varn-bg:#fff1dc;color-scheme:light dark}
@media (prefers-color-scheme:dark){:root{--bg:#1a1311;--yta:#261d1a;--yta2:#2e2420;--text:#f7ede6;--text2:#cfbcae;--kant:#4d3c35;--accent:#ff86b0;--pa-accent:#2a0715;--fokus:#9cc2ff;--stam:#754b31;--kontur:rgba(255,255,255,.45);--annons:#2a2320;--annons-kant:#8a7d75;--bra:#7fd6a0;--varn:#ffc27a;--varn-bg:#3a2a17}}
body{margin:0;background:var(--bg);color:var(--text);font:1rem/1.55 ui-rounded,"SF Pro Rounded","Segoe UI Variable Display","Segoe UI",system-ui,sans-serif}
a{color:inherit;text-underline-offset:.15em}
img,svg{max-width:100%}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
:focus-visible{outline:3px solid var(--fokus);outline-offset:2px}
.sida{max-width:72rem;margin:0 auto;padding:0 1rem}
.utkastrad{background:var(--varn-bg);color:var(--varn);font-size:.85rem;text-align:center;padding:.35rem 1rem;font-weight:600}
.utkastrad a{color:inherit}
.topp{display:flex;align-items:center;gap:1rem;padding:.6rem 0}
.logo{display:inline-flex;align-items:center;min-height:2.75rem;gap:.5rem;font-weight:800;font-size:1.2rem;text-decoration:none;border-radius:.5rem;margin-right:auto}
.logo img{display:block;height:2.25rem;width:auto;max-width:100%}@media (min-width:48rem){.logo img{height:2.5rem}}
.toppsok{display:flex;min-width:0;flex:0 1 20rem}
.toppsok input{flex:1;min-width:0;font:inherit;padding:.5rem .9rem;border:2px solid var(--annons-kant);border-radius:999px 0 0 999px;background:var(--yta);color:var(--text)}
.toppsok button{font:inherit;font-weight:700;border:0;border-radius:0 999px 999px 0;padding:.5rem .9rem;background:var(--accent);color:var(--pa-accent);cursor:pointer}
.huvudmeny{position:relative;margin:0 -1rem;border-bottom:2px solid var(--kant)}
.huvudmeny ul{display:flex;gap:.4rem;list-style:none;margin:0;padding:.4rem 1rem .6rem;overflow-x:auto;scrollbar-width:none}
.huvudmeny ul::after{content:"";flex:0 0 1rem}
.huvudmeny a{display:inline-flex;align-items:center;gap:.35rem;min-height:2.75rem;padding:0 .9rem;border-radius:999px;white-space:nowrap;text-decoration:none;font-weight:650;border:2px solid transparent}
.huvudmeny a:hover{border-color:var(--g)}
.huvudmeny a[aria-current]{background:color-mix(in srgb,var(--g) 20%,var(--yta));border-color:var(--g)}
.huvudmeny .frukt{width:1.4rem;height:1.4rem}
@media (max-width:40rem){.toppsok{display:none}.sokknapp{display:inline-grid}}
@media (max-width:63.99rem){.huvudmeny ul{mask-image:linear-gradient(90deg,#000 80%,#0000)}}
.sokknapp{display:none;place-items:center;width:2.75rem;height:2.75rem;border-radius:50%;border:2px solid var(--kant);text-decoration:none}
.sokknapp svg,.ikon{width:1.2rem;height:1.2rem;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.smulor ol{display:flex;flex-wrap:wrap;align-items:center;gap:.1rem .35rem;list-style:none;margin:.9rem 0 .25rem;padding:0;font-size:.9rem;color:var(--text2)}
.smulor li{display:inline-flex;align-items:center;gap:.35rem}
.smulor li+li::before{content:"";width:.7rem;height:.35rem;border-radius:1rem;background:repeating-linear-gradient(-55deg,#fff9 0 3px,#0000 3px 6px),var(--stam)}
.smulor a{display:inline-block;padding:.7rem .1rem}
.smulor [aria-current]{color:var(--text);font-weight:650}
h1{font-size:clamp(1.75rem,1.3rem + 2vw,2.6rem);line-height:1.15;margin:.25rem 0 .5rem;letter-spacing:-.01em}
h2{font-size:clamp(1.3rem,1.15rem + .7vw,1.6rem);line-height:1.25;margin:2.25rem 0 .75rem}
h3{font-size:1.1rem;line-height:1.3;margin:1.25rem 0 .4rem}
.ingress{font-size:1.1rem;color:var(--text2);max-width:40rem;margin:0 0 1rem}
.las{max-width:42rem}
.las p,.las li{margin:0 0 .9rem}
.etikett{display:inline-block;font-size:.75rem;font-weight:700;letter-spacing:.02em;padding:.1rem .45rem;border-radius:.35rem;background:var(--varn-bg);color:var(--varn)}
.rutnat{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(15rem,100%),1fr));gap:1rem;list-style:none;padding:0;margin:0}
.rutnat.sma{grid-template-columns:repeat(auto-fill,minmax(min(9.25rem,100%),1fr));gap:.75rem}@media (min-width:48rem){.rutnat.sma{grid-template-columns:repeat(auto-fill,minmax(12rem,1fr))}}
.kort{position:relative;display:flex;flex-direction:column;gap:.35rem;min-width:0;height:100%;padding:1rem;background:var(--yta);border:2px solid var(--kant);border-radius:1rem}
.kort:has(a.hela:hover){border-color:var(--g,var(--accent))}
.kort a.hela{text-decoration:none;font-weight:750;font-size:1.05rem;line-height:1.25}
.kort a.hela::after{content:"";position:absolute;inset:0;border-radius:1rem}
.kort a.hela:focus-visible{outline:none}
.kort:has(a.hela:focus-visible){outline:3px solid var(--fokus);outline-offset:2px}
.kort p{margin:0;color:var(--text2);font-size:.925rem}
.kort .frukt{width:2.6rem;height:2.6rem}
.lovkort{flex-direction:row;align-items:center;gap:.75rem;border-left:.5rem solid var(--g)}
.pbild{display:grid;place-items:center;aspect-ratio:1;border-radius:.75rem;background:color-mix(in srgb,var(--g) 16%,var(--yta2))}
.pbild svg{width:55%;height:55%}
.pkort .pbild{margin:-.25rem -.25rem .25rem}
.pnamn{font-size:.975rem!important}
.pvikt{font-size:.85rem;color:var(--text2)}
.jfr{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 .35rem;font-size:1.25rem;font-weight:800;line-height:1.15;margin-top:auto}
.jfr small{font-size:.8rem;font-weight:600;color:var(--text2)}
.lagst{font-size:.875rem}
.antal{font-size:.8rem;color:var(--text2)}
.taggar{display:flex;flex-wrap:wrap;gap:.35rem;list-style:none;padding:0;margin:.5rem 0}
.taggar a,.taggar span{display:inline-flex;align-items:center;min-height:2rem;padding:0 .7rem;border-radius:999px;border:2px solid var(--kant);background:var(--yta);font-size:.875rem;font-weight:600;text-decoration:none}
.taggar a{min-height:2.75rem}
.knapp{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;max-width:100%;text-align:center;min-height:2.75rem;padding:.45rem 1.1rem;border-radius:999px;border:2px solid var(--kant);background:var(--yta);color:var(--text);font:inherit;font-weight:700;text-decoration:none;cursor:pointer}
.knapp .frukt{width:1.5rem;height:1.5rem}
.knapp.egen{background:var(--accent);border-color:var(--accent);color:var(--pa-accent)}
.knapp.butik{background:var(--text);border-color:var(--text);color:var(--bg)}
.affil{display:inline-flex;flex-direction:column;align-items:flex-start;gap:.15rem}
.affil small,.annonsmark{font-size:.75rem;color:var(--text2);font-weight:600}
.annons{display:grid;place-items:center;min-height:17.5rem;margin:2.5rem auto;border:2px dashed var(--annons-kant);border-radius:.75rem;background:var(--annons);color:var(--text2);font-size:.85rem;text-align:center;padding:1rem}
@media (min-width:48rem){.annons{min-height:7.5rem;max-width:45.5rem}.annons.stor{min-height:17.5rem;max-width:none}}
.ruta{padding:1rem 1.1rem;border-radius:1rem;background:var(--yta);border:2px solid var(--kant);margin:1.25rem 0}
.ruta h2,.ruta h3{margin-top:0}
.fakta{border-left:.5rem solid var(--g,#2f9e6e)}
.varning{background:var(--varn-bg);border-color:color-mix(in srgb,var(--varn) 45%,var(--kant));color:var(--text)}
table{border-collapse:collapse;width:100%;font-size:.95rem}
th,td{text-align:left;padding:.6rem .5rem;border-bottom:1px solid var(--kant);vertical-align:top}
th{font-size:.85rem;color:var(--text2)}
.tabell{overflow-x:auto;border:2px solid var(--kant);border-radius:1rem;background:var(--yta);padding:0 .5rem}
.tal{font-variant-numeric:tabular-nums;white-space:nowrap}
details.faq{border-bottom:1px solid var(--kant)}
details.faq summary{cursor:pointer;font-weight:700;padding:.8rem 0;min-height:2.75rem}
details.faq p{margin:0 0 1rem}
.tva{display:grid;gap:1.5rem}.tva>*{min-width:0}
@media (min-width:60rem){.tva{grid-template-columns:minmax(0,1fr) 20rem;align-items:start}.tva.vanster{grid-template-columns:16rem minmax(0,1fr)}}
.byline{display:flex;flex-wrap:wrap;gap:.25rem 1rem;font-size:.9rem;color:var(--text2);margin:0 0 1rem}
.byline strong{color:var(--text)}
.kallor{font-size:.9rem;color:var(--text2)}
.kallor li{margin-bottom:.4rem;overflow-wrap:anywhere}   /* långa käll-URL:er, även på hubb/kategori/sida (bara bas.css) */
/* Källistan är utfällbar längst ned (ägarbeslut 2026-11-04) */
.kallor-ruta{margin:2rem 0 1rem;border-top:1px solid var(--kant)}.kallor-ruta summary{cursor:pointer;padding:.6rem 0;min-height:2.75rem}.kallor-ruta summary h2{display:inline;font-size:1.1rem;margin:0}
@media print{.kallor-ruta>*{display:block}}
.dl{display:grid;grid-template-columns:auto 1fr;gap:.35rem 1rem;margin:0}
.dl dt{color:var(--text2);font-size:.9rem}
.dl dd{margin:0;font-weight:650}
.fot{margin-top:3rem;padding:1.5rem 0 2rem;border-top:2px solid var(--kant);color:var(--text2);font-size:.925rem}
.fot ul{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;list-style:none;padding:0;margin:0 0 .75rem}
.fot a,.fot button{display:inline-block;padding:.65rem 0;color:var(--text);font:inherit;background:none;border:0;text-decoration:underline;cursor:pointer}
.frukt{flex:none;overflow:visible}
.frukt *{stroke:var(--kontur);stroke-width:1.2}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
/* sökformulär i sidinnehållet (startsidan, sök, 404) – ur prototyp B */
.sok{display:flex;gap:.5rem;max-width:32rem;margin:0 auto}
.sok input{flex:1;min-width:0;font:inherit;padding:.65rem 1rem;border:2px solid var(--annons-kant);border-radius:999px;background:var(--yta);color:var(--text)}
.sok button{border:0;border-radius:999px;padding:.65rem 1.3rem;background:var(--accent);color:var(--pa-accent)}
.sok button{font:inherit;font-weight:700;cursor:pointer}
.sok.vanster{margin:0 0 1.5rem}