/* Malmö Elektriker CSS - Nordisk Design */
:root{--vit:#ffffff;--gul:#FDB813;--orange:#FF8C00;--beige:#F5E6D3;--bla:#0066CC;--mork:#2C3E50;--ljusgraa:#f8f9fa}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;color:#333;background:#fff}
.container{max-width:1200px;margin:0 auto;padding:0 20px}

/* Malmö-specifika klasser */
.dockgatan-header{background:linear-gradient(135deg,var(--vit) 0%,var(--beige) 100%);border-bottom:3px solid var(--gul);padding:15px 0;position:sticky;top:0;z-index:1000}
.malmo-logo{display:inline-block;width:50px;height:50px;background:var(--gul);border-radius:50%;position:relative;margin-right:15px;vertical-align:middle}
.malmo-logo:before{content:'⚡';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:28px;color:var(--vit)}
.skane-nav{display:flex;justify-content:space-between;align-items:center}
.skane-nav ul{list-style:none;display:flex;gap:25px}
.skane-nav a{color:var(--mork);text-decoration:none;font-weight:500;transition:color 0.3s}
.skane-nav a:hover{color:var(--orange)}

/* CTA-knappar */
.cta-bla{background:var(--bla);color:white;padding:12px 28px;border:none;border-radius:5px;font-size:16px;font-weight:bold;cursor:pointer;text-decoration:none;display:inline-block;transition:all 0.3s;margin:10px 5px}
.cta-bla:hover{background:#0052A3;transform:translateY(-2px);box-shadow:0 5px 15px rgba(0,102,204,0.3)}
.cta-orange{background:var(--orange);color:white;padding:15px 35px;border:none;border-radius:8px;font-size:18px;font-weight:bold;cursor:pointer;text-decoration:none;display:inline-block;transition:all 0.3s}
.cta-orange:hover{background:#E67E00;transform:scale(1.05)}

/* Mobil meny */
.mobil-meny{display:none;background:var(--bla);color:white;border:none;padding:10px;font-size:24px;cursor:pointer}
.mobil-nav{display:none;position:absolute;top:100%;left:0;right:0;background:white;box-shadow:0 5px 20px rgba(0,0,0,0.1);max-height:0;overflow:hidden;transition:max-height 0.3s}
.mobil-nav.aktiv{max-height:400px}
.mobil-nav ul{list-style:none;padding:20px}
.mobil-nav li{border-bottom:1px solid #eee;padding:10px 0}

/* Inforutor och kort */
.elarbeten-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:25px;margin:40px 0}
.malmo-kort{background:white;border:1px solid #e0e0e0;border-radius:10px;padding:25px;transition:all 0.3s;position:relative;overflow:hidden}
.malmo-kort:hover{box-shadow:0 10px 30px rgba(0,0,0,0.1);transform:translateY(-5px)}
.malmo-kort:before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--gul),var(--orange))}
.kort-rubrik{font-size:20px;margin-bottom:15px;color:var(--mork)}
.kort-text{color:#666;line-height:1.8}

/* Säsongsspecifikt område */
.sason-dec{background:linear-gradient(135deg,#1e3c72,#2a5298);color:white;padding:40px;border-radius:15px;margin:40px 0;position:relative;overflow:hidden}
.sason-dec:before{content:'❄';position:absolute;font-size:150px;opacity:0.1;right:-20px;top:-30px}
.sason-rubrik{font-size:28px;margin-bottom:20px}
.sason-text{font-size:18px;line-height:1.8}

/* Tabeller */
.tjanst-tabell{width:100%;border-collapse:collapse;margin:30px 0;background:white;box-shadow:0 2px 10px rgba(0,0,0,0.05)}
.tjanst-tabell th{background:var(--beige);padding:15px;text-align:left;font-weight:600;color:var(--mork)}
.tjanst-tabell td{padding:15px;border-bottom:1px solid #eee}
.tjanst-tabell tr:hover{background:#fafafa}

/* Citatrutor */
.citat-ruta{background:var(--ljusgraa);border-left:5px solid var(--orange);padding:25px;margin:30px 0;font-style:italic;position:relative}
.citat-ruta:before{content:'"';font-size:60px;color:var(--orange);opacity:0.3;position:absolute;top:-10px;left:15px}

/* Formulär */
.offert-formular{background:white;border:2px solid var(--beige);border-radius:10px;padding:30px;max-width:600px;margin:0 auto}
.form-grupp{margin-bottom:20px}
.form-grupp label{display:block;margin-bottom:8px;font-weight:600;color:var(--mork)}
.form-grupp input,.form-grupp textarea{width:100%;padding:12px;border:1px solid #ddd;border-radius:5px;font-size:16px;transition:border 0.3s}
.form-grupp input:focus,.form-grupp textarea:focus{border-color:var(--bla);outline:none}
.spam-skydd{background:#f0f0f0;padding:15px;border-radius:5px;margin:20px 0}
.spam-fraga{font-weight:600;margin-bottom:10px}

/* Footer */
.rosengard-footer{background:var(--mork);color:white;padding:40px 0;margin-top:60px}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px;margin-bottom:30px}
.footer-sektion h3{color:var(--gul);margin-bottom:15px}
.footer-sektion ul{list-style:none}
.footer-sektion a{color:#ccc;text-decoration:none;transition:color 0.3s}
.footer-sektion a:hover{color:var(--orange)}

/* Responsiv design */
@media(max-width:768px){
.mobil-meny{display:block}
.skane-nav ul{display:none}
.elarbeten-grid{grid-template-columns:1fr}
.cta-orange{width:100%;text-align:center}
.tjanst-tabell{font-size:14px}
.sason-dec{padding:25px}
.footer-grid{grid-template-columns:1fr}
}

/* CSS-ikoner för rubriker */
.el-ikon{display:inline-block;width:40px;height:40px;margin-right:10px;vertical-align:middle}
.ikon-nyinstallation{background:linear-gradient(45deg,var(--gul),var(--orange));-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 3L4 14h7l-2 7 9-11h-7l2-7z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 3L4 14h7l-2 7 9-11h-7l2-7z'/%3E%3C/svg%3E") center/contain no-repeat}
.ikon-felsok{background:linear-gradient(45deg,var(--bla),#4080FF);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E") center/contain no-repeat}
.ikon-renovering{background:linear-gradient(45deg,#28a745,#20c997);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 13h8V3H3v10zm0 8h8v-6H3v6zm10 0h8V11h-8v10zm0-18v6h8V3h-8z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 13h8V3H3v10zm0 8h8v-6H3v6zm10 0h8V11h-8v10zm0-18v6h8V3h-8z'/%3E%3C/svg%3E") center/contain no-repeat}

/* Dropdown och detaljer */
details{background:white;border:1px solid #e0e0e0;border-radius:8px;margin:15px 0;overflow:hidden}
summary{background:var(--ljusgraa);padding:15px;cursor:pointer;font-weight:600;transition:background 0.3s}
summary:hover{background:var(--beige)}
details[open] summary{background:var(--beige);border-bottom:1px solid #e0e0e0}
details p{padding:20px}

/* Artiklar och sektioner */
article{background:white;padding:30px;margin:30px 0;border-radius:10px;box-shadow:0 2px 10px rgba(0,0,0,0.05)}
aside{background:var(--ljusgraa);padding:25px;border-radius:10px;margin:20px 0}
blockquote{border-left:4px solid var(--gul);padding-left:20px;margin:20px 0;font-style:italic;color:#555}

/* Animationer */
@keyframes puls{0%{transform:scale(1)}50%{transform:scale(1.05)}100%{transform:scale(1)}}
.puls-animation{animation:puls 2s infinite}

/* Cache och komprimering headers via .htaccess */