@charset "UTF-8";@import"https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap";.form-container{display:flex;flex-direction:column;justify-content:center;max-width:1200px;margin:0 auto}.form-container form{margin-bottom:5vh}.form-container .search-wrapper{display:flex;position:relative;justify-content:center;margin-bottom:3vh;padding-top:5vh;align-items:center;gap:1rem}.form-container .search-wrapper input{font-size:16px;border:none;outline:none;height:42px;border-radius:22px;width:220px;padding:0 18px;box-sizing:border-box;background:#ffffff26;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--white);box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}.form-container .search-wrapper input::placeholder{color:var(--white)}.form-container .search-wrapper input::-webkit-search-cancel-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:16px;width:16px;background-color:var(--white);-webkit-mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20fill='black'%20d='M18.3%205.71a1%201%200%200%200-1.41%200L12%2010.59%207.11%205.7A1%201%200%200%200%205.7%207.11L10.59%2012l-4.89%204.89a1%201%200%201%200%201.41%201.41L12%2013.41l4.89%204.89a1%201%200%200%200%201.41-1.41L13.41%2012l4.89-4.89a1%201%200%200%200%200-1.4z'/%3e%3c/svg%3e") no-repeat center;-webkit-mask-size:contain;mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20fill='black'%20d='M18.3%205.71a1%201%200%200%200-1.41%200L12%2010.59%207.11%205.7A1%201%200%200%200%205.7%207.11L10.59%2012l-4.89%204.89a1%201%200%201%200%201.41%201.41L12%2013.41l4.89%204.89a1%201%200%200%200%201.41-1.41L13.41%2012l4.89-4.89a1%201%200%200%200%200-1.4z'/%3e%3c/svg%3e") no-repeat center;mask-size:contain;cursor:pointer;opacity:0;transition:opacity .2s ease}.form-container .search-wrapper input:not(:placeholder-shown)::-webkit-search-cancel-button{opacity:1}@media (max-width: 320px){.form-container .search-wrapper input{min-width:185px}}.form-container .search-wrapper button{background-color:var(--darkgreen);color:var(--white);position:relative;min-width:96px;height:42px;padding:0 16px;border-radius:22px;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-weight:400;box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:background-color .2s ease,color .2s ease,transform .12s ease,box-shadow .2s ease}.form-container .search-wrapper button:hover:not(:disabled):not(.is-loading){background-color:var(--lightgreen);color:#000;transform:translateY(-1px) scale(1.02);box-shadow:#00000038 0 6px 12px,#0000002e 0 3px 6px}.form-container .search-wrapper button:active:not(:disabled):not(.is-loading){transform:translateY(0) scale(.99);box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}.form-container .search-wrapper button:focus-visible{outline:2px solid color-mix(in srgb,#fff 70%,var(--darkgreen) 30%);outline-offset:2px}.form-container .search-wrapper button .btn-text{display:inline}.form-container .search-wrapper button .btn-icon{display:none;width:20px;height:20px;flex:0 0 auto;fill:currentColor;stroke:currentColor}.form-container .search-wrapper button.is-loading>*{visibility:hidden}.form-container .search-wrapper button.is-loading,.form-container .search-wrapper button.is-loading:hover{background-color:var(--darkgreen);color:var(--white);transform:none;box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}.form-container .search-wrapper button.is-loading:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:18px;height:18px;padding:3px;border-radius:50%;background:var(--lightgreen);--_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;-webkit-mask:var(--_m);mask:var(--_m);-webkit-mask-composite:source-out;mask-composite:subtract;animation:l3 1s linear infinite;z-index:1}@media (max-width: 320px){.form-container .search-wrapper button{min-width:65px}}@media (max-width: 480px){.form-container .search-wrapper{justify-content:space-between}}@media (max-width: 1280px){.form-container .search-wrapper{padding-right:5vh;padding-left:5vh}}@keyframes l3{to{transform:rotate(1turn)}}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.button{outline:none;cursor:pointer;border:none;padding:.9rem 2rem;margin:0;position:relative;display:inline-block;letter-spacing:.05rem;font-weight:500;font-size:17px;border-radius:calc(infinity * 1px);overflow:hidden;background:var(--lightgreen);background-clip:padding-box;color:var(--white)}.button span{position:relative;z-index:2}.button:before,.button:after{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0}.button:before{content:"";background:var(--darkgreen);width:120%;left:-10%;transform:skew(30deg);transition:transform .4s cubic-bezier(.3,1,.8,1)}.button:hover:before{transform:translate3d(100%,0,0)}.button:hover span{color:var(--black)}.grid-content{padding-right:5vh;padding-left:5vh}.grid-content .grid-list-wrapper{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px;max-width:1200px;width:100%;margin:0 auto;padding:0 0 10vh}@media (max-width: 768px){.grid-content .grid-list-wrapper{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}}.grid-content .grid-list-wrapper .grid-list-item{list-style:none;opacity:0;animation:scaleIn .3s ease forwards}.grid-content .filter-results{font-size:20px;display:flex;justify-content:center;text-align:center}.grid-content .filter-results p{animation:bounce .6s ease}@keyframes bounce{0%,to{transform:translateY(0)}30%{transform:translateY(-12px)}60%{transform:translateY(0)}80%{transform:translateY(-6px)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.pagination{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;width:min(100%,420px);margin:24px auto 34px}@media (max-width: 480px){.pagination{padding-left:5vh;padding-right:5vh;grid-template-columns:1fr 1fr}}.pagination span{margin:0 10px;font-size:1.2rem;color:var(--white);text-align:center}@media (max-width: 480px){.pagination span{font-size:16px}}.pagination .button-pagination{background-color:var(--darkgreen);color:var(--white);border:none;padding:10px 20px;border-radius:5px;cursor:pointer;font-size:1rem;transition:background-color .4s ease;letter-spacing:.05rem;font-size:17px;font-weight:400}.pagination .button-pagination:hover{background-color:var(--lightgreen)}.pagination .button-pagination:hover:hover span{color:var(--black)}@media (max-width: 320px){.pagination .button-pagination{padding:10px}}@media (max-width: 480px){.pagination .button-pagination span{font-size:16px}}.pagination .button-pagination:disabled{opacity:.5;pointer-events:none}@media (max-width: 480px){.pagination .page{grid-column:1/-1;order:-1}}.filter-controls{display:flex;justify-content:space-between;align-items:center;flex-direction:row;gap:1rem;flex-wrap:wrap;padding-bottom:4vh}.filter-controls .filter-wrapper{padding-top:1vw}.filter-controls .filter-wrapper label{font-weight:400;letter-spacing:.05rem;font-size:17px}.filter-controls .filter-wrapper select{border-radius:9999px;padding:.375rem .75rem;margin-left:1vw;color:var(--white);background-color:var(--darkgreen);font-size:17px;line-height:1.2;border:1px solid transparent;-moz-appearance:none;appearance:none;-webkit-appearance:none;transition:background-color .2s ease,color .2s ease,border-color .2s ease;box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:background-color .2s ease,color .2s ease;cursor:pointer}.filter-controls .filter-wrapper select:focus-visible{outline:2px solid var(--lightgreen);outline-offset:2px}.filter-controls .filter-wrapper select:hover{background-color:var(--lightgreen);color:var(--black)}@media (max-width: 1024px){.filter-controls{padding-right:5vh;padding-left:5vh}}@media (max-width: 320px){.hide-xs{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}}.header{padding-top:5vh;display:flex;align-items:center;justify-content:center;transition:all .2s ease-in-out}.header .logo{margin:0 auto;object-fit:contain;max-height:100%;height:450px;width:100%}@media (max-width: 480px){.header .logo{height:auto;padding-right:3vh;padding-left:3vh}}.header:hover{transform:scale(1.03)}.product-card{--shadow: 0 6px 18px rgba(0, 0, 0, .08);--shadow-hover: 0 14px 28px rgba(0, 0, 0, .12);--muted: #6b7280;--accent: #0ea5e9;--card-h: 360px;--media-h: 160px;position:relative;display:flex;flex-direction:column;height:var(--card-h);background:var(--white);border-radius:18px;box-shadow:var(--shadow);overflow:hidden;transition:transform .18s ease,box-shadow .18s ease;will-change:transform}@media (hover: hover){.product-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover)}}.product-card:before{content:"";position:absolute;right:0;top:0;bottom:0;width:3px;background:var(--accent);opacity:.5;z-index:1;pointer-events:none}.product-card[data-store=Hemköp]{--accent: #ef4444}.product-card[data-store=CityGross]{--accent: #2563eb}.product-card .stretched-link{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5}.product-card .stretched-link:focus-visible{outline:3px solid #93c5fd;outline-offset:3px}.product-card .media{position:relative;height:var(--media-h);display:grid;place-items:center}.product-card .product-image{width:100%;max-height:180px;object-fit:contain;padding-bottom:2vh;padding-top:2vh;display:block}.product-card .store-pill{position:absolute;left:10px;top:10px;padding:4px 10px;font-size:.75rem;font-weight:600;background:#f1f5f9;color:#0f172a;border:1px solid #e2e8f0;border-radius:999px;z-index:2}.product-card .product-information{flex:1 1 auto;display:flex;flex-direction:column;padding:20px 14px 14px;justify-content:center}@media (max-width: 768px){.product-card .product-information{padding:12px}}.product-card .product-name{color:var(--darkgreen);margin:0 0 6px;font-size:1.05rem;line-height:1.25;font-weight:700;text-align:left;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.5em}.product-card .price-row{display:flex;align-items:center;justify-content:flex-start;gap:10px;margin-bottom:8px}.product-card .price{display:flex;align-items:baseline;gap:4px;color:var(--darkgreen)}.product-card .price.price--na{color:var(--muted)}.product-card .badge{flex-shrink:0;font-size:.8rem;font-weight:400;padding:4px 8px;border-radius:8px;background:var(--lightgreen);border:1px solid var(--lightgreen);color:var(--white)}.product-card .price-compare-and-volume{color:var(--darkgreen);font-size:.88rem;text-align:left;display:flex;flex-direction:column;gap:4px}.product-card .price-compare-and-volume .product-volume{margin:0}.product-card .price-compare-and-volume .compare{font-size:.82rem}@media (max-width: 768px){.product-card{--card-h: 340px;--media-h: 150px}}@media (prefers-reduced-motion: reduce){.product-card{transition:none}}.button--sort{display:inline-flex;align-items:center;gap:.5rem;border-radius:15px;padding:1rem;white-space:nowrap;box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;color:var(--white);background-color:var(--darkgreen);font-weight:400;transition:background-color .2s ease,color .2s ease;cursor:pointer}.button--sort:focus-visible{outline:2px solid var(--lightgreen);outline-offset:2px}.button--sort .sort-icon{width:1em;height:1em;vertical-align:middle;transform-origin:50% 50%;transition:transform .2s ease,opacity .2s ease;opacity:.6;color:currentColor}.button--sort .sort-icon path{fill:currentColor}.button--sort.active,.button--sort:hover{background-color:var(--lightgreen);color:var(--black)}.button--sort.active .sort-icon,.button--sort:hover .sort-icon{opacity:1}.button--sort:before,.button--sort:after{content:none;display:none}@media (max-width: 480px){.button--sort{padding:.75rem}.button--sort span{display:none}}.button--sort .sort-icon{transform:rotate(0)}.button--sort[data-order=none] .sort-icon{opacity:.6}.button--sort[data-order=lowToHigh] .sort-icon{opacity:1}.button--sort[data-order=highToLow] .sort-icon{transform:rotate(180deg);opacity:1}@media (prefers-reduced-motion: reduce){.button--sort,.button--sort .sort-icon{transition:none}}:root{--white: #ffffff;--lightgreen: #7d9e96;--darkgreen: #48514d;--main-color: #655f59;--black: #000000}*{font-family:Roboto Condensed,sans-serif;font-optical-sizing:auto;font-style:normal;box-sizing:border-box}html,body{background-image:linear-gradient(to left top,#7d9e96,#738f87,#698079,#5f716b,#55635e,#535e59,#515a54,#4f554f,#555851,#5a5a53,#605d56,#655f59);color:var(--white);margin:0;padding:0;width:100%;height:100%;overflow-x:hidden;-webkit-text-size-adjust:100%;word-break:break-word;overflow-wrap:anywhere}
