/* Snickare Ystad - Stilmall */
*{margin:0;padding:0;box-sizing:border-box}
:root{--ystad-vit:#ffffff;--ystad-gul:#d4a017;--ystad-gul-ljus:#e8c547;--ystad-bla:#1e3a5f;--ystad-bla-ljus:#2d5a8a;--ystad-beige:#f5f0e6;--ystad-beige-mork:#e8dcc8;--ystad-lila:#4a2c6a;--ystad-lila-hover:#5d3a82;--ystad-gra:#666;--ystad-morkgra:#333;--skane-skugga:0 4px 15px rgba(0,0,0,0.1)}
html{scroll-behavior:smooth}
body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;line-height:1.7;color:var(--ystad-morkgra);background:var(--ystad-vit)}
/* Ystad Header */
.ystad-header{background:linear-gradient(135deg,var(--ystad-bla) 0%,var(--ystad-bla-ljus) 100%);padding:0;position:sticky;top:0;z-index:1000;box-shadow:var(--skane-skugga)}
.ystad-header-inner{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;padding:0.8rem 1.5rem}
.ystad-logo{display:flex;align-items:center;gap:0.8rem;text-decoration:none;color:var(--ystad-vit)}
.ystad-logo-ikon{width:45px;height:45px;background:var(--ystad-gul);border-radius:8px;display:flex;align-items:center;justify-content:center;position:relative;box-shadow:0 2px 8px rgba(0,0,0,0.2)}
.ystad-logo-ikon::before{content:'';position:absolute;width:20px;height:25px;border:3px solid var(--ystad-bla);border-top:none;top:8px}
.ystad-logo-ikon::after{content:'';position:absolute;width:8px;height:12px;background:var(--ystad-bla);top:18px;left:50%;transform:translateX(-50%)}
.ystad-logo-text{font-size:1.4rem;font-weight:700;letter-spacing:0.5px}
.ystad-logo-sub{font-size:0.75rem;opacity:0.85;display:block;margin-top:-3px}
/* Ystad Navigation */
.ystad-nav{display:none}
.ystad-nav.aktiv{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:var(--ystad-bla);padding:1rem;gap:0.5rem}
.ystad-nav a{color:var(--ystad-vit);text-decoration:none;padding:0.7rem 1rem;border-radius:5px;transition:all 0.3s;font-size:0.95rem}
.ystad-nav a:hover,.ystad-nav a.aktiv-sida{background:rgba(255,255,255,0.15)}
.ystad-meny-knapp{display:flex;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:10px}
.ystad-meny-knapp span{width:28px;height:3px;background:var(--ystad-vit);border-radius:2px;transition:all 0.3s}
.ystad-cta-header{background:var(--ystad-lila);color:var(--ystad-vit)!important;padding:0.8rem 1.5rem!important;border-radius:25px!important;font-weight:600;box-shadow:0 3px 10px rgba(74,44,106,0.3);white-space:nowrap}
.ystad-cta-header:hover{background:var(--ystad-lila-hover)!important;transform:translateY(-2px)}
/* Ystad Hero */
.ystad-hero{background:linear-gradient(135deg,var(--ystad-beige) 0%,var(--ystad-beige-mork) 100%);padding:3rem 1.5rem;text-align:center}
.ystad-hero-inner{max-width:900px;margin:0 auto}
.ystad-hero h1{font-size:2rem;color:var(--ystad-bla);margin-bottom:1rem;line-height:1.3}
.ystad-hero-intro{font-size:1.1rem;color:var(--ystad-gra);margin-bottom:2rem;max-width:700px;margin-left:auto;margin-right:auto}
.ystad-hero-knappar{display:flex;flex-direction:column;gap:1rem;align-items:center}
.ystad-knapp{display:inline-block;padding:1rem 2rem;border-radius:30px;text-decoration:none;font-weight:600;transition:all 0.3s;text-align:center}
.ystad-knapp-primar{background:var(--ystad-lila);color:var(--ystad-vit);box-shadow:0 4px 15px rgba(74,44,106,0.3)}
.ystad-knapp-primar:hover{background:var(--ystad-lila-hover);transform:translateY(-3px);box-shadow:0 6px 20px rgba(74,44,106,0.4)}
.ystad-knapp-sekundar{background:var(--ystad-vit);color:var(--ystad-bla);border:2px solid var(--ystad-bla)}
.ystad-knapp-sekundar:hover{background:var(--ystad-bla);color:var(--ystad-vit)}
/* Ystad Pulsing Text */
.ystad-puls-text{background:linear-gradient(90deg,var(--ystad-gul),var(--ystad-gul-ljus));padding:1.5rem;text-align:center;animation:ystadPuls 2s ease-in-out infinite}
@keyframes ystadPuls{0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(212,160,23,0.4)}50%{transform:scale(1.02);box-shadow:0 0 20px 5px rgba(212,160,23,0.2)}}
.ystad-puls-text p{font-size:1.1rem;font-weight:600;color:var(--ystad-bla);max-width:800px;margin:0 auto}
/* Ystad Innehall */
.ystad-innehall{max-width:1200px;margin:0 auto;padding:2rem 1.5rem}
.ystad-sektion{margin-bottom:3rem}
.ystad-sektion h2{font-size:1.6rem;color:var(--ystad-bla);margin-bottom:1.2rem;padding-bottom:0.5rem;border-bottom:3px solid var(--ystad-gul)}
.ystad-sektion h3{font-size:1.3rem;color:var(--ystad-bla-ljus);margin:1.5rem 0 0.8rem}
.ystad-sektion p{margin-bottom:1rem;text-align:justify}
/* Ystad Inforutor */
.ystad-inforutor{display:grid;gap:1.5rem;margin:2rem 0}
.ystad-inforuta{background:var(--ystad-vit);border-radius:12px;padding:1.5rem;box-shadow:var(--skane-skugga);border-left:4px solid var(--ystad-gul)}
.ystad-inforuta-bla{border-left-color:var(--ystad-bla)}
.ystad-inforuta-lila{border-left-color:var(--ystad-lila)}
.ystad-inforuta h4{color:var(--ystad-bla);font-size:1.15rem;margin-bottom:0.8rem;display:flex;align-items:center;gap:0.5rem}
.ystad-inforuta p{font-size:0.95rem;color:var(--ystad-gra)}
/* Ystad Tabeller */
.ystad-tabell-container{overflow-x:auto;margin:1.5rem 0;border-radius:10px;box-shadow:var(--skane-skugga)}
.ystad-tabell{width:100%;border-collapse:collapse;background:var(--ystad-vit)}
.ystad-tabell th{background:var(--ystad-bla);color:var(--ystad-vit);padding:1rem;text-align:left;font-weight:600}
.ystad-tabell td{padding:0.9rem 1rem;border-bottom:1px solid var(--ystad-beige)}
.ystad-tabell tr:nth-child(even){background:var(--ystad-beige)}
.ystad-tabell tr:hover{background:var(--ystad-beige-mork)}
.ystad-tabell-gul th{background:linear-gradient(135deg,var(--ystad-gul),var(--ystad-gul-ljus));color:var(--ystad-bla)}
/* Ystad Citat */
.ystad-citat{background:linear-gradient(135deg,var(--ystad-bla),var(--ystad-bla-ljus));color:var(--ystad-vit);padding:2rem;border-radius:12px;margin:2rem 0;position:relative}
.ystad-citat::before{content:'"';font-size:4rem;position:absolute;top:-10px;left:15px;opacity:0.3;font-family:Georgia,serif}
.ystad-citat p{font-size:1.1rem;font-style:italic;position:relative;z-index:1}
.ystad-citat cite{display:block;margin-top:1rem;font-style:normal;opacity:0.8;font-size:0.9rem}
/* Ystad Tips Rutor */
.ystad-tips-ruta{background:var(--ystad-beige);border-radius:10px;padding:1.5rem;margin:1.5rem 0;border:2px dashed var(--ystad-gul)}
.ystad-tips-ruta h5{color:var(--ystad-bla);margin-bottom:0.8rem;font-size:1.05rem}
.ystad-miss-inte{background:linear-gradient(135deg,rgba(212,160,23,0.15),rgba(212,160,23,0.05));border-color:var(--ystad-gul)}
.ystad-tank-pa{background:linear-gradient(135deg,rgba(30,58,95,0.1),rgba(30,58,95,0.03));border-color:var(--ystad-bla)}
/* Ystad FAQ Accordion */
.ystad-faq{margin:2rem 0}
.ystad-faq-item{background:var(--ystad-vit);border-radius:8px;margin-bottom:0.8rem;box-shadow:0 2px 8px rgba(0,0,0,0.08);overflow:hidden}
.ystad-faq-fraga{width:100%;background:none;border:none;padding:1.2rem 1.5rem;text-align:left;cursor:pointer;display:flex;justify-content:space-between;align-items:center;font-size:1rem;color:var(--ystad-bla);font-weight:600;transition:background 0.3s}
.ystad-faq-fraga:hover{background:var(--ystad-beige)}
.ystad-faq-fraga::after{content:'+';font-size:1.5rem;font-weight:300;transition:transform 0.3s}
.ystad-faq-item.oppen .ystad-faq-fraga::after{transform:rotate(45deg)}
.ystad-faq-svar{max-height:0;overflow:hidden;transition:max-height 0.4s ease,padding 0.4s ease}
.ystad-faq-item.oppen .ystad-faq-svar{max-height:500px;padding:0 1.5rem 1.5rem}
/* Ystad Tjanster Grid */
.ystad-tjanster-grid{display:grid;gap:1.5rem;margin:2rem 0}
.ystad-tjanst-kort{background:var(--ystad-vit);border-radius:12px;padding:1.8rem;box-shadow:var(--skane-skugga);transition:transform 0.3s,box-shadow 0.3s;text-decoration:none;color:inherit;display:block}
.ystad-tjanst-kort:hover{transform:translateY(-5px);box-shadow:0 8px 25px rgba(0,0,0,0.15)}
.ystad-tjanst-ikon{width:60px;height:60px;background:linear-gradient(135deg,var(--ystad-gul),var(--ystad-gul-ljus));border-radius:12px;margin-bottom:1rem;display:flex;align-items:center;justify-content:center}
.ystad-tjanst-kort h4{color:var(--ystad-bla);margin-bottom:0.5rem;font-size:1.15rem}
.ystad-tjanst-kort p{color:var(--ystad-gra);font-size:0.9rem}
/* Ystad CSS Bilder */
.ystad-css-bild{width:100%;height:180px;border-radius:10px;margin:1rem 0;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.ystad-bild-tra{background:linear-gradient(135deg,#8B4513 0%,#A0522D 25%,#8B4513 50%,#CD853F 75%,#8B4513 100%);background-size:50px 50px}
.ystad-bild-tra::before{content:'';position:absolute;width:100%;height:100%;background:repeating-linear-gradient(90deg,transparent,transparent 2px,rgba(0,0,0,0.1) 2px,rgba(0,0,0,0.1) 4px)}
.ystad-bild-tra::after{content:'🪵';font-size:3rem;z-index:1}
.ystad-bild-hus{background:linear-gradient(to bottom,#87CEEB 0%,#87CEEB 60%,#228B22 60%,#228B22 100%)}
.ystad-bild-hus::after{content:'🏠';font-size:4rem;z-index:1}
.ystad-bild-verktyg{background:linear-gradient(135deg,var(--ystad-beige),var(--ystad-beige-mork))}
.ystad-bild-verktyg::after{content:'🔨';font-size:3rem}
.ystad-bild-kok{background:linear-gradient(135deg,#f5f5f5,#e0e0e0)}
.ystad-bild-kok::after{content:'🍳';font-size:3rem}
.ystad-bild-badrum{background:linear-gradient(135deg,#e3f2fd,#bbdefb)}
.ystad-bild-badrum::after{content:'🚿';font-size:3rem}
.ystad-bild-altan{background:linear-gradient(135deg,#c8e6c9,#a5d6a7)}
.ystad-bild-altan::after{content:'🌿';font-size:3rem}
.ystad-bild-grund{background:linear-gradient(135deg,#9e9e9e,#757575)}
.ystad-bild-grund::after{content:'🧱';font-size:3rem}
.ystad-bild-attefall{background:linear-gradient(135deg,#ffe0b2,#ffcc80)}
.ystad-bild-attefall::after{content:'🏡';font-size:3rem}
/* Ystad Sasong */
.ystad-sasong{background:var(--ystad-beige);border-radius:12px;padding:2rem;margin:2rem 0;text-align:center}
.ystad-sasong h3{color:var(--ystad-bla);margin-bottom:1rem}
.ystad-sasong p{max-width:600px;margin:0 auto}
/* Ystad Formulär */
.ystad-formular{background:var(--ystad-vit);border-radius:15px;padding:2rem;box-shadow:0 5px 30px rgba(0,0,0,0.1);max-width:600px;margin:0 auto}
.ystad-formular-intro{background:linear-gradient(135deg,var(--ystad-bla),var(--ystad-bla-ljus));color:var(--ystad-vit);padding:1.5rem;border-radius:10px;margin-bottom:1.5rem;text-align:center}
.ystad-formular-intro h3{margin-bottom:0.5rem}
.ystad-formular-intro p{opacity:0.9;font-size:0.95rem}
.ystad-formular-grupp{margin-bottom:1.2rem}
.ystad-formular-grupp label{display:block;margin-bottom:0.4rem;color:var(--ystad-bla);font-weight:600;font-size:0.95rem}
.ystad-formular-grupp input,.ystad-formular-grupp textarea,.ystad-formular-grupp select{width:100%;padding:0.9rem 1rem;border:2px solid var(--ystad-beige);border-radius:8px;font-size:1rem;transition:border-color 0.3s,box-shadow 0.3s;font-family:inherit}
.ystad-formular-grupp input:focus,.ystad-formular-grupp textarea:focus,.ystad-formular-grupp select:focus{outline:none;border-color:var(--ystad-gul);box-shadow:0 0 0 3px rgba(212,160,23,0.2)}
.ystad-formular-grupp textarea{min-height:150px;resize:vertical}
.ystad-spam-skydd{background:var(--ystad-beige);padding:1rem;border-radius:8px;margin-bottom:1.5rem}
.ystad-spam-skydd label{margin-bottom:0.5rem!important}
.ystad-skicka-knapp{width:100%;background:var(--ystad-lila);color:var(--ystad-vit);border:none;padding:1.1rem;border-radius:30px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all 0.3s}
.ystad-skicka-knapp:hover{background:var(--ystad-lila-hover);transform:translateY(-2px);box-shadow:0 5px 20px rgba(74,44,106,0.3)}
.ystad-formular-info{background:var(--ystad-beige);padding:1.5rem;border-radius:10px;margin-top:1.5rem}
.ystad-formular-info h4{color:var(--ystad-bla);margin-bottom:0.8rem}
.ystad-formular-info p,.ystad-formular-info li{font-size:0.9rem;color:var(--ystad-gra)}
.ystad-formular-bekraftelse{text-align:center;padding:2rem;background:linear-gradient(135deg,rgba(76,175,80,0.1),rgba(76,175,80,0.05));border-radius:10px}
.ystad-formular-bekraftelse h3{color:#2e7d32;margin-bottom:1rem}
/* Ystad Tjanster Footer */
.ystad-tjanster-footer{background:var(--ystad-beige);padding:3rem 1.5rem;margin-top:3rem}
.ystad-tjanster-footer-inner{max-width:1200px;margin:0 auto}
.ystad-tjanster-footer h3{text-align:center;color:var(--ystad-bla);margin-bottom:2rem;font-size:1.4rem}
.ystad-tjanster-lista{display:grid;gap:0.8rem}
.ystad-tjanster-lista a{display:block;padding:0.8rem 1.2rem;background:var(--ystad-vit);border-radius:8px;text-decoration:none;color:var(--ystad-bla);transition:all 0.3s;font-weight:500}
.ystad-tjanster-lista a:hover{background:var(--ystad-gul);transform:translateX(5px)}
/* Ystad Footer */
.ystad-footer{background:var(--ystad-bla);color:var(--ystad-vit);padding:2rem 1.5rem;text-align:center}
.ystad-footer p{margin-bottom:0.5rem;opacity:0.9}
.ystad-footer a{color:var(--ystad-gul);text-decoration:none}
.ystad-footer a:hover{text-decoration:underline}
.ystad-footer-sitemap{margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,0.2)}
/* Ystad Breadcrumbs */
.ystad-breadcrumbs{background:var(--ystad-beige);padding:0.8rem 1.5rem}
.ystad-breadcrumbs-inner{max-width:1200px;margin:0 auto;font-size:0.9rem}
.ystad-breadcrumbs a{color:var(--ystad-bla);text-decoration:none}
.ystad-breadcrumbs a:hover{text-decoration:underline}
.ystad-breadcrumbs span{color:var(--ystad-gra)}
/* Ystad Framhavd text */
.ystad-fet{font-weight:700}
.ystad-understrykning{text-decoration:underline;text-decoration-color:var(--ystad-gul);text-underline-offset:3px}
.ystad-kursiv{font-style:italic}
/* Ystad Externa lankar */
.ystad-extern-lank{color:var(--ystad-bla-ljus);text-decoration:underline;text-decoration-style:dotted}
.ystad-extern-lank:hover{color:var(--ystad-bla);text-decoration-style:solid}
/* Ystad 404 */
.ystad-404{text-align:center;padding:4rem 1.5rem}
.ystad-404 h1{font-size:5rem;color:var(--ystad-gul);margin-bottom:1rem}
.ystad-404 h2{color:var(--ystad-bla);margin-bottom:1.5rem}
/* Desktop */
@media(min-width:768px){
.ystad-header-inner{padding:1rem 2rem}
.ystad-meny-knapp{display:none}
.ystad-nav{display:flex!important;position:static;background:none;padding:0;flex-direction:row;gap:0.3rem}
.ystad-nav a{padding:0.6rem 1rem}
.ystad-hero{padding:4rem 2rem}
.ystad-hero h1{font-size:2.8rem}
.ystad-hero-knappar{flex-direction:row}
.ystad-innehall{padding:3rem 2rem}
.ystad-inforutor{grid-template-columns:repeat(2,1fr)}
.ystad-tjanster-grid{grid-template-columns:repeat(2,1fr)}
.ystad-tjanster-lista{grid-template-columns:repeat(3,1fr)}
.ystad-formular{padding:2.5rem}
}
@media(min-width:1024px){
.ystad-hero h1{font-size:3.2rem}
.ystad-inforutor{grid-template-columns:repeat(4,1fr)}
.ystad-tjanster-grid{grid-template-columns:repeat(3,1fr)}
.ystad-tjanster-lista{grid-template-columns:repeat(4,1fr)}
}