/* Spindelsanering Malmö - Stilmall */
/* Starrvägen Arlöv Design System */

:root{--arlov-white:#fff;--arlov-red:#e74c3c;--arlov-beige:#f5e6d3;--arlov-pink:#ff1493;--arlov-dark:#2c3e50;--arlov-gray:#7f8c8d;--font-inter:'Inter',sans-serif}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-inter);line-height:1.6;color:var(--arlov-dark);background:var(--arlov-white)}h1{font-size:2.5rem;margin-bottom:1rem;color:var(--arlov-dark)}h2{font-size:2rem;margin:1.5rem 0 1rem;color:var(--arlov-red)}h3{font-size:1.5rem;margin:1rem 0;color:var(--arlov-dark)}p{margin-bottom:1rem}.container{max-width:1200px;margin:0 auto;padding:0 20px}header{background:var(--arlov-white);box-shadow:0 2px 5px rgba(0,0,0,0.1);position:sticky;top:0;z-index:1000}.header-content{display:flex;justify-content:space-between;align-items:center;padding:1rem 0}.logo{display:inline-flex;align-items:center;text-decoration:none;color:var(--arlov-dark);font-weight:700;font-size:1.5rem}.logo-icon{width:40px;height:40px;margin-right:10px;background:var(--arlov-red);border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative}.logo-icon::before{content:'';width:20px;height:20px;background:var(--arlov-dark);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);position:absolute}nav ul{list-style:none;display:flex;gap:2rem}nav a{text-decoration:none;color:var(--arlov-dark);transition:color 0.3s}nav a:hover{color:var(--arlov-red)}.cta-button{background:var(--arlov-pink);color:white!important;padding:12px 24px;border-radius:5px;text-decoration:none;display:inline-block;font-weight:600;transition:transform 0.3s,box-shadow 0.3s;border:none;cursor:pointer}.cta-button:hover{transform:translateY(-2px);box-shadow:0 5px 15px rgba(255,20,147,0.3)}.hero{background:linear-gradient(135deg,var(--arlov-beige) 0%,var(--arlov-white) 100%);padding:4rem 0;text-align:center}.info-box{background:var(--arlov-white);border-left:4px solid var(--arlov-red);padding:1.5rem;margin:2rem 0;box-shadow:0 2px 10px rgba(0,0,0,0.05)}.season-box{background:var(--arlov-beige);border-radius:10px;padding:2rem;margin:3rem 0}.table-responsive{overflow-x:auto}.styled-table{width:100%;border-collapse:collapse;margin:2rem 0}.styled-table th{background:var(--arlov-red);color:white;padding:12px;text-align:left}.styled-table td{padding:12px;border-bottom:1px solid #ddd}.styled-table tr:nth-child(even){background:var(--arlov-beige)}blockquote{border-left:4px solid var(--arlov-pink);padding-left:1.5rem;margin:2rem 0;font-style:italic;background:var(--arlov-beige);padding:1.5rem}details{background:var(--arlov-white);border:1px solid #ddd;border-radius:5px;padding:1rem;margin:1rem 0}summary{cursor:pointer;font-weight:600;color:var(--arlov-red)}summary:hover{color:var(--arlov-pink)}.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;margin:2rem 0}.card{background:white;border-radius:10px;padding:1.5rem;box-shadow:0 3px 10px rgba(0,0,0,0.1);transition:transform 0.3s}.card:hover{transform:translateY(-5px)}.mobile-menu-toggle{display:none;background:none;border:none;font-size:1.5rem;cursor:pointer}footer{background:var(--arlov-dark);color:white;padding:3rem 0;margin-top:4rem}.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-bottom:2rem}footer a{color:var(--arlov-beige);text-decoration:none}footer a:hover{color:white}.form-group{margin-bottom:1.5rem}.form-group label{display:block;margin-bottom:0.5rem;font-weight:500}.form-group input,.form-group textarea{width:100%;padding:10px;border:1px solid #ddd;border-radius:5px;font-family:var(--font-inter)}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--arlov-pink)}.captcha{background:var(--arlov-beige);padding:1rem;border-radius:5px;margin:1rem 0}.spider-image{width:100%;max-width:400px;height:200px;margin:1rem auto;background:var(--arlov-beige);border-radius:10px;display:flex;align-items:center;justify-content:center;position:relative}.spider-image::before{content:attr(data-alt);color:var(--arlov-gray);font-size:0.9rem}@media(max-width:768px){h1{font-size:2rem}h2{font-size:1.5rem}nav{display:none;position:absolute;top:100%;left:0;right:0;background:white;box-shadow:0 5px 10px rgba(0,0,0,0.1)}nav.active{display:block}nav ul{flex-direction:column;padding:1rem}.mobile-menu-toggle{display:block}.grid-3{grid-template-columns:1fr}.hero{padding:2rem 0}}