:root{ --heroH: 40vh; } html,body{overflow-x:hidden} #map_wrap{scroll-margin-top:84px}
body {background-color: #efefefff;}
h1,h2,h3,h4,h5,h6,.display-1,.display-2,.display-3,.display-4,.display-5,.display-6{font-family:'Special Gothic Expanded One',sans-serif;font-weight:400}
/* Layout: sticky footer */
body{min-height:100vh;display:flex;flex-direction:column}
.page-main{flex:1 0 auto}
html, body { touch-action: manipulation; }
.navbar-brand img{height:60px;width:auto;display:block;}
.map{height:380px}.navbar-brand{font-size:1.8rem;}
.reticle{position:absolute;top:50%;left:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border:3px solid #FFC107;border-radius:50%;box-shadow:0 0 12px rgba(251, 206, 4, 0.6);pointer-events:none;z-index:1000}
.reticle:before,.reticle:after{content:"";position:absolute;left:50%;top:50%;width:30px;height:1px;background: #FFC107;transform:translate(-50%,-50%)}
.reticle:after{transform:translate(-50%,-50%) rotate(90deg)}
.card-rounded{border-radius:1rem}.nav-shadow{box-shadow:0 2px 8px rgba(0,0,0,.06)}
/* --- Säck-badge på produktkort --- */
.badge-corner{
  position:absolute; top:8px; right:8px;
  background:#0d6efd; color:#fff;
  font-weight:700; border-radius:999px;
  padding:.25rem .6rem; font-size:.8rem;
  box-shadow:0 2px 6px rgba(0,0,0,.15);
}
.card.product-card{ position:relative; } /* så att badge placeras inne i kortet */

.product-card{transition:.15s transform ease,.15s box-shadow ease}
.product-card:hover{transform:translateY(-2px);box-shadow:0 .5rem 1rem rgba(0,0,0,.08)}
.product-thumb{width:100%;height:160px;object-fit:cover;display:block}
@media (min-width:768px){.product-thumb{height:180px}}
@media (min-width:1200px){.product-thumb{height:200px}}
.product-title{font-size:1rem;line-height:1.25rem;margin:0}
.product-desc{font-size:.9rem;color:#6c757d;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:3.45em}
.hero{position:relative;height:var(--heroH);border-radius:1rem;overflow:hidden;background:var(--hero-bg, url('../../img/masso-grus-jord-sand-online.png')) center/cover no-repeat}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.22))}
.hero-inner{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1rem;color:#fff;text-align:center;padding:1.5rem;text-shadow:0 2px 10px rgba(0,0,0,.25)}
@media (max-width:576px){
.hero .addr-wrap .input-group-lg .form-control{font-size:14px;padding:.55rem .75rem}
.hero .addr-wrap .input-group-lg .btn{font-size:14px;padding:.55rem .9rem}
.hero .addr-wrap .form-control::placeholder{font-size:13px}
.hero h1{font-size:1.6rem}
}
.hero h1{font-weight:800;letter-spacing:.2px}.fattext{font-weight:800;letter-spacing:.2px}
.hero .addr-wrap{width:min(780px,96%)} .hero .addr-wrap .form-control{background:rgba(255,255,255,.98);color:#111;border:1px solid rgba(0,0,0,.2)}
.hero .addr-wrap .form-control:focus{background:#fff;color:#111} .hero .addr-wrap .btn{position:relative;z-index:1}
.price-note{font-size:.9rem;color:#6c757d;} footer.home-footer{margin-top:2rem;text-align:center;color:#6c757d;}
footer.home-footer a{color:#6c757d;text-decoration:none;margin:0 .5rem;} footer.home-footer a:hover{text-decoration:underline;}
/* --- Global footer --- */
.site-footer{background:#fff;border-top:1px solid rgba(0,0,0,.08);margin-top:auto}
.site-footer .social-link{color:#111;text-decoration:none}
.site-footer .social-link:hover{text-decoration:underline}
.site-footer .footer-brand img{height:34px;width:auto;display:block}
.site-footer .footer-links a{color:#111;text-decoration:none}
.site-footer .footer-links a:hover{text-decoration:underline}
.spinner{display:none;gap:.4rem;align-items:center;} .loading-cover{position:fixed;inset:0;background:rgba(255,255,255,.9);display:none;align-items:center;justify-content:center;z-index:2000}
#cat_filters .btn{border-radius:999px;} #cat_filters .btn.active{pointer-events:none;}
#map_wrap{scroll-margin-top:80px}
@keyframes bd-shake{0%{transform:translateX(0)}20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}100%{transform:translateX(0)}}
.shake{animation:bd-shake 500ms ease}
.mg-chip{border:1px solid rgba(0,0,0,.15);background:#fff;border-radius:999px;padding:.4rem .75rem;font-size:.95rem;cursor:pointer}
.mg-chip.active{background:#0d6efd;color:#fff;border-color:#0d6efd}
#mg_filter_banner small{opacity:.8}
.modal-confirm .modal-header{background:#d1e7dd}
#cookie-banner{position:fixed;bottom:0;left:0;right:0;background:#fff;box-shadow:0 -2px 10px rgba(0,0,0,.15);z-index:9999;display:none}
#cookie-banner.show{display:block}
#cookie-banner .cookie-content{max-width:1200px;margin:0 auto;padding:1.25rem}
#cookie-banner .cookie-actions{display:flex;gap:.75rem;flex-wrap:wrap}
@media(max-width:768px){#cookie-banner .cookie-actions{flex-direction:column}}
.partner-powered-by{font-size:.65rem;line-height:1.2;margin-top:.15rem;font-weight:400;letter-spacing:normal;font-family:system-ui,-apple-system,sans-serif;color:#6c757d}
.navbar .navbar-partner-stack{flex:0 0 auto;max-width:min(55%,70vw)}

/* Home page */
.hero-slider{position:relative;overflow:hidden;border-radius:12px;margin-bottom:2rem}
.hero-slide{position:relative;height:60vh;min-height:400px;background-size:cover;background-position:center;display:none}
.hero-slide.active{display:block}
.hero-slide-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.3),rgba(0,0,0,.6));display:flex;align-items:center;justify-content:center}
.hero-slide-content{text-align:center;color:#fff;padding:2rem}
.hero-slide-content h2{font-size:3rem;font-weight:700;text-shadow:2px 2px 4px rgba(0,0,0,.5);margin-bottom:1rem}
.hero-slide-content p{font-size:1.5rem;text-shadow:1px 1px 2px rgba(0,0,0,.5)}
.slider-nav{position:absolute;bottom:1.5rem;left:50%;transform:translateX(-50%);display:flex;gap:.5rem;z-index:10}
.slider-dot{width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,.5);border:none;cursor:pointer;transition:background .3s}
.slider-dot.active{background:#fff}
.category-card{position:relative;overflow:hidden;border:1px solid #ddd;border-radius:12px;transition:transform .2s,box-shadow .2s;text-decoration:none;color:#fff;display:block;height:280px}
.category-card:hover{transform:translateY(-4px);box-shadow:0 4px 12px rgba(0,0,0,.15);text-decoration:none}
.category-card-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.category-card-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.2),rgba(0,0,0,.6));display:flex;align-items:flex-end;padding:1.5rem}
.category-card-content{width:100%}
.category-card h3{color:#fff;margin-bottom:.25rem;text-shadow:1px 1px 3px rgba(0,0,0,.5)}
.category-card p{color:rgba(255,255,255,.9);text-shadow:1px 1px 2px rgba(0,0,0,.5)}
.info-box{background:#f8f9fa;border-left:4px solid #FFC107;padding:1.5rem;border-radius:8px}
.provider-card{height:100%;background:#fff;border:1px solid #e9ecef;border-radius:12px;padding:1.25rem;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.provider-card-logo{width:100%;max-width:200px;max-height:110px;object-fit:contain}
.coverage-map{height:420px;min-height:320px;border-radius:12px;overflow:hidden;border:1px solid #e9ecef;background:#eef2f7}
.coverage-list{display:flex;flex-wrap:wrap;gap:.5rem}
.coverage-list span{display:inline-flex;align-items:center;border:1px solid rgba(0,0,0,.12);border-radius:999px;padding:.35rem .7rem;background:#fff;font-size:.9rem}
.packaging-card{text-align:center;padding:1.5rem;border:2px solid #e9ecef;border-radius:12px;background:#fff;height:100%}
.packaging-card img{max-width:120px;height:120px;object-fit:contain;margin:0 auto 1rem}
.packaging-card h4{font-size:1.1rem;margin-bottom:.5rem}
@media(max-width:768px){
  .hero-slide{height:50vh;min-height:300px}
  .hero-slide-content h2{font-size:2rem}
  .hero-slide-content p{font-size:1.2rem}
}