/* Snickare Trelleborg - Stilmall */
:root{--trelleborg-turkos:#3d9a8b;--trelleborg-turkos-ljus:#5fb8a8;--trelleborg-beige:#f5f1e8;--trelleborg-gul:#fff8dc;--trelleborg-vit:#ffffff;--trelleborg-mork:#2c3e50;--trelleborg-gra:#6b7c8a;--trelleborg-gradient:linear-gradient(135deg,#3d9a8b 0%,#2d7a6b 100%);--skugga:0 4px 20px rgba(0,0,0,0.08);--skugga-hover:0 8px 30px rgba(0,0,0,0.12);--rundning:12px;--rundning-stor:20px}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;line-height:1.7;color:var(--trelleborg-mork);background:var(--trelleborg-vit)}
/* Typografi */
h1{font-size:clamp(1.8rem,4vw,2.8rem);font-weight:700;line-height:1.2;margin-bottom:1rem;color:var(--trelleborg-mork)}
h2{font-size:clamp(1.5rem,3vw,2.2rem);font-weight:600;margin-bottom:0.8rem;color:var(--trelleborg-mork)}
h3{font-size:clamp(1.2rem,2.5vw,1.6rem);font-weight:600;margin-bottom:0.6rem}
h4{font-size:1.1rem;font-weight:600;margin-bottom:0.5rem}
p{margin-bottom:1rem;color:var(--trelleborg-gra)}
a{color:var(--trelleborg-turkos);text-decoration:none;transition:color 0.3s}
a:hover{color:var(--trelleborg-turkos-ljus)}
/* Header */
.trelleborg-header{background:var(--trelleborg-vit);box-shadow:var(--skugga);position:sticky;top:0;z-index:1000}
.trelleborg-header-inner{max-width:1200px;margin:0 auto;padding:1rem 1.5rem;display:flex;justify-content:space-between;align-items:center}
.trelleborg-logo{display:flex;align-items:center;gap:0.8rem;text-decoration:none}
.trelleborg-logo-ikon{width:48px;height:48px;background:var(--trelleborg-gradient);border-radius:var(--rundning);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.trelleborg-logo-ikon::before{content:'';position:absolute;width:24px;height:4px;background:var(--trelleborg-vit);transform:rotate(-45deg);top:50%;left:50%;margin-left:-12px;margin-top:-2px;border-radius:2px}
.trelleborg-logo-ikon::after{content:'';position:absolute;width:16px;height:16px;border:3px solid var(--trelleborg-vit);border-radius:2px;bottom:8px;right:8px}
.trelleborg-logo-text{font-size:1.3rem;font-weight:700;color:var(--trelleborg-mork)}
.trelleborg-logo-text span{color:var(--trelleborg-turkos)}
/* Navigation desktop */
.trelleborg-nav{display:none}
.trelleborg-nav ul{list-style:none;display:flex;gap:2rem}
.trelleborg-nav a{color:var(--trelleborg-mork);font-weight:500;padding:0.5rem 0;position:relative}
.trelleborg-nav a::after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background:var(--trelleborg-turkos);transition:width 0.3s}
.trelleborg-nav a:hover::after,.trelleborg-nav a.aktiv::after{width:100%}
/* CTA knapp header */
.trelleborg-header-cta{background:var(--trelleborg-gradient);color:var(--trelleborg-vit);padding:0.7rem 1.5rem;border-radius:50px;font-weight:600;text-decoration:none;transition:transform 0.3s,box-shadow 0.3s;white-space:nowrap}
.trelleborg-header-cta:hover{transform:translateY(-2px);box-shadow:var(--skugga-hover);color:var(--trelleborg-vit)}
/* Mobilmeny */
.trelleborg-meny-knapp{display:flex;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:0.5rem}
.trelleborg-meny-knapp span{width:28px;height:3px;background:var(--trelleborg-mork);border-radius:2px;transition:0.3s}
.trelleborg-mobilmeny{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:var(--trelleborg-vit);z-index:999;padding:5rem 1.5rem 2rem}
.trelleborg-mobilmeny.oppen{display:block}
.trelleborg-mobilmeny ul{list-style:none}
.trelleborg-mobilmeny li{border-bottom:1px solid var(--trelleborg-beige)}
.trelleborg-mobilmeny a{display:block;padding:1rem 0;color:var(--trelleborg-mork);font-size:1.1rem;font-weight:500}
.trelleborg-mobilmeny-stang{position:absolute;top:1rem;right:1.5rem;background:none;border:none;font-size:2rem;cursor:pointer;color:var(--trelleborg-mork)}
/* Hero sektion */
.trelleborg-hero{background:linear-gradient(135deg,var(--trelleborg-beige) 0%,var(--trelleborg-gul) 100%);padding:3rem 1.5rem 4rem;position:relative;overflow:hidden}
.trelleborg-hero::before{content:'';position:absolute;top:-50%;right:-20%;width:60%;height:200%;background:radial-gradient(circle,rgba(61,154,139,0.1) 0%,transparent 70%);pointer-events:none}
.trelleborg-hero-inner{max-width:1200px;margin:0 auto;position:relative;z-index:1}
.trelleborg-hero h1{max-width:700px}
.trelleborg-hero-undertitel{font-size:1.2rem;color:var(--trelleborg-gra);max-width:600px;margin-bottom:2rem}
.trelleborg-hero-knappar{display:flex;flex-wrap:wrap;gap:1rem}
/* CTA knappar */
.trelleborg-cta{display:inline-flex;align-items:center;gap:0.5rem;background:var(--trelleborg-gradient);color:var(--trelleborg-vit);padding:1rem 2rem;border-radius:50px;font-weight:600;text-decoration:none;transition:transform 0.3s,box-shadow 0.3s;border:none;cursor:pointer;font-size:1rem}
.trelleborg-cta:hover{transform:translateY(-3px);box-shadow:var(--skugga-hover);color:var(--trelleborg-vit)}
.trelleborg-cta-sekundar{background:var(--trelleborg-vit);color:var(--trelleborg-turkos);border:2px solid var(--trelleborg-turkos)}
.trelleborg-cta-sekundar:hover{background:var(--trelleborg-turkos);color:var(--trelleborg-vit)}
/* Sektioner */
.trelleborg-sektion{padding:4rem 1.5rem}
.trelleborg-sektion-inner{max-width:1200px;margin:0 auto}
.trelleborg-sektion-beige{background:var(--trelleborg-beige)}
.trelleborg-sektion-gul{background:var(--trelleborg-gul)}
.trelleborg-sektion-rubrik{text-align:center;margin-bottom:3rem}
.trelleborg-sektion-rubrik p{max-width:700px;margin:0 auto}
/* Informationsrutor */
.trelleborg-rutor{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem}
.trelleborg-ruta{background:var(--trelleborg-vit);border-radius:var(--rundning-stor);padding:2rem;box-shadow:var(--skugga);transition:transform 0.3s,box-shadow 0.3s}
.trelleborg-ruta:hover{transform:translateY(-5px);box-shadow:var(--skugga-hover)}
.trelleborg-ruta-ikon{width:60px;height:60px;background:var(--trelleborg-beige);border-radius:var(--rundning);display:flex;align-items:center;justify-content:center;margin-bottom:1.5rem;font-size:1.5rem}
.trelleborg-ruta h3{color:var(--trelleborg-mork)}
/* CSS-bilder/ikoner */
.ikon-hammare{position:relative;width:30px;height:30px}
.ikon-hammare::before{content:'';position:absolute;width:8px;height:20px;background:var(--trelleborg-turkos);bottom:0;left:50%;transform:translateX(-50%);border-radius:2px}
.ikon-hammare::after{content:'';position:absolute;width:20px;height:8px;background:var(--trelleborg-turkos);top:2px;left:50%;transform:translateX(-50%);border-radius:2px}
.ikon-hus{position:relative;width:30px;height:30px}
.ikon-hus::before{content:'';position:absolute;width:0;height:0;border-left:15px solid transparent;border-right:15px solid transparent;border-bottom:12px solid var(--trelleborg-turkos);top:0;left:0}
.ikon-hus::after{content:'';position:absolute;width:22px;height:14px;background:var(--trelleborg-turkos);bottom:0;left:4px;border-radius:2px 2px 0 0}
.ikon-kok{position:relative;width:30px;height:30px}
.ikon-kok::before{content:'';position:absolute;width:26px;height:18px;border:3px solid var(--trelleborg-turkos);bottom:0;left:2px;border-radius:3px}
.ikon-kok::after{content:'';position:absolute;width:18px;height:3px;background:var(--trelleborg-turkos);top:4px;left:6px;border-radius:2px}
.ikon-badrum{position:relative;width:30px;height:30px}
.ikon-badrum::before{content:'';position:absolute;width:24px;height:12px;border:3px solid var(--trelleborg-turkos);border-top:none;bottom:4px;left:3px;border-radius:0 0 12px 12px}
.ikon-badrum::after{content:'';position:absolute;width:6px;height:10px;background:var(--trelleborg-turkos);top:0;right:6px;border-radius:3px}
.ikon-renovering{position:relative;width:30px;height:30px}
.ikon-renovering::before{content:'';position:absolute;width:20px;height:20px;border:3px solid var(--trelleborg-turkos);border-radius:50%;top:2px;left:2px}
.ikon-renovering::after{content:'';position:absolute;width:10px;height:3px;background:var(--trelleborg-turkos);bottom:2px;right:0;transform:rotate(45deg)}
.ikon-bygg{position:relative;width:30px;height:30px}
.ikon-bygg::before{content:'';position:absolute;width:24px;height:16px;background:var(--trelleborg-turkos);bottom:0;left:3px;border-radius:3px 3px 0 0}
.ikon-bygg::after{content:'';position:absolute;width:6px;height:6px;background:var(--trelleborg-vit);bottom:5px;left:50%;transform:translateX(-50%)}
.ikon-check{position:relative;width:30px;height:30px}
.ikon-check::before{content:'';position:absolute;width:20px;height:20px;border:3px solid var(--trelleborg-turkos);border-radius:50%;top:5px;left:5px}
.ikon-check::after{content:'';position:absolute;width:6px;height:12px;border-right:3px solid var(--trelleborg-turkos);border-bottom:3px solid var(--trelleborg-turkos);top:7px;left:12px;transform:rotate(45deg)}
.ikon-tid{position:relative;width:30px;height:30px}
.ikon-tid::before{content:'';position:absolute;width:24px;height:24px;border:3px solid var(--trelleborg-turkos);border-radius:50%;top:3px;left:3px}
.ikon-tid::after{content:'';position:absolute;width:8px;height:3px;background:var(--trelleborg-turkos);top:13px;left:13px;transform-origin:left center;transform:rotate(-45deg)}
/* Tabeller */
.trelleborg-tabell{width:100%;border-collapse:collapse;margin:1.5rem 0;background:var(--trelleborg-vit);border-radius:var(--rundning);overflow:hidden;box-shadow:var(--skugga)}
.trelleborg-tabell th{background:var(--trelleborg-turkos);color:var(--trelleborg-vit);padding:1rem;text-align:left;font-weight:600}
.trelleborg-tabell td{padding:1rem;border-bottom:1px solid var(--trelleborg-beige)}
.trelleborg-tabell tr:last-child td{border-bottom:none}
.trelleborg-tabell tr:hover td{background:var(--trelleborg-beige)}
.trelleborg-tabell-responsiv{overflow-x:auto}
/* Citat/highlight rutor */
.trelleborg-citat{background:linear-gradient(135deg,var(--trelleborg-turkos) 0%,var(--trelleborg-turkos-ljus) 100%);color:var(--trelleborg-vit);padding:2rem;border-radius:var(--rundning-stor);margin:2rem 0;position:relative}
.trelleborg-citat::before{content:'"';font-size:4rem;position:absolute;top:0.5rem;left:1rem;opacity:0.3;font-family:Georgia,serif}
.trelleborg-citat p{color:var(--trelleborg-vit);font-size:1.1rem;font-style:italic;margin:0}
/* Tips-rutor */
.trelleborg-tips{background:var(--trelleborg-gul);border-left:4px solid var(--trelleborg-turkos);padding:1.5rem;border-radius:0 var(--rundning) var(--rundning) 0;margin:1.5rem 0}
.trelleborg-tips-titel{font-weight:700;color:var(--trelleborg-turkos);margin-bottom:0.5rem}
/* Tänk på-rutor */
.trelleborg-tankpa{background:var(--trelleborg-beige);padding:1.5rem;border-radius:var(--rundning);margin:1.5rem 0;border:2px dashed var(--trelleborg-turkos)}
.trelleborg-tankpa-titel{font-weight:700;color:var(--trelleborg-mork);margin-bottom:0.5rem;display:flex;align-items:center;gap:0.5rem}
/* Kundrecension-stil */
.trelleborg-kunder{background:linear-gradient(135deg,var(--trelleborg-beige) 0%,var(--trelleborg-vit) 100%);padding:2rem;border-radius:var(--rundning-stor);margin:2rem 0;border:1px solid rgba(61,154,139,0.2)}
.trelleborg-kunder-titel{font-weight:700;color:var(--trelleborg-turkos);margin-bottom:1rem}
/* Tidsberoende meddelande */
.trelleborg-tidsmeddelande{background:var(--trelleborg-gradient);color:var(--trelleborg-vit);padding:2rem;border-radius:var(--rundning-stor);text-align:center;margin:2rem 0;animation:pulsera 2s ease-in-out infinite}
.trelleborg-tidsmeddelande h3{color:var(--trelleborg-vit);margin-bottom:0.5rem}
.trelleborg-tidsmeddelande p{color:rgba(255,255,255,0.9);margin:0}
@keyframes pulsera{0%,100%{transform:scale(1);box-shadow:0 4px 20px rgba(61,154,139,0.3)}50%{transform:scale(1.02);box-shadow:0 8px 30px rgba(61,154,139,0.5)}}
/* Säsongsektion */
.trelleborg-sasong{background:var(--trelleborg-gul);padding:2rem;border-radius:var(--rundning-stor);margin:2rem 0}
.trelleborg-sasong h3{color:var(--trelleborg-mork)}
/* FAQ/Foldouts */
.trelleborg-faq{margin:2rem 0}
.trelleborg-faq-item{border:1px solid var(--trelleborg-beige);border-radius:var(--rundning);margin-bottom:0.5rem;overflow:hidden}
.trelleborg-faq-fraga{width:100%;padding:1.2rem;background:var(--trelleborg-vit);border:none;text-align:left;cursor:pointer;display:flex;justify-content:space-between;align-items:center;font-size:1rem;font-weight:600;color:var(--trelleborg-mork);transition:background 0.3s}
.trelleborg-faq-fraga:hover{background:var(--trelleborg-beige)}
.trelleborg-faq-fraga::after{content:'+';font-size:1.5rem;color:var(--trelleborg-turkos);transition:transform 0.3s}
.trelleborg-faq-item.oppen .trelleborg-faq-fraga::after{transform:rotate(45deg)}
.trelleborg-faq-svar{max-height:0;overflow:hidden;transition:max-height 0.3s ease-out}
.trelleborg-faq-item.oppen .trelleborg-faq-svar{max-height:500px}
.trelleborg-faq-svar-inner{padding:1.2rem;background:var(--trelleborg-beige)}
/* Formulär */
.trelleborg-formular{background:var(--trelleborg-vit);padding:2rem;border-radius:var(--rundning-stor);box-shadow:var(--skugga)}
.trelleborg-formular-grupp{margin-bottom:1.5rem}
.trelleborg-formular label{display:block;margin-bottom:0.5rem;font-weight:600;color:var(--trelleborg-mork)}
.trelleborg-formular input,.trelleborg-formular textarea,.trelleborg-formular select{width:100%;padding:1rem;border:2px solid var(--trelleborg-beige);border-radius:var(--rundning);font-size:1rem;transition:border-color 0.3s;font-family:inherit}
.trelleborg-formular input:focus,.trelleborg-formular textarea:focus{outline:none;border-color:var(--trelleborg-turkos)}
.trelleborg-formular textarea{min-height:150px;resize:vertical}
.trelleborg-formular-spam{margin-bottom:1.5rem;padding:1rem;background:var(--trelleborg-beige);border-radius:var(--rundning)}
.trelleborg-formular-spam label{font-weight:normal;margin-bottom:0.5rem}
.trelleborg-formular-info{font-size:0.9rem;color:var(--trelleborg-gra);margin-top:1rem}
.trelleborg-formular-success{background:var(--trelleborg-turkos);color:var(--trelleborg-vit);padding:1.5rem;border-radius:var(--rundning);text-align:center;margin-bottom:1.5rem}
.trelleborg-formular-error{background:#e74c3c;color:var(--trelleborg-vit);padding:1.5rem;border-radius:var(--rundning);text-align:center;margin-bottom:1.5rem}
/* Servicelista pre-footer */
.trelleborg-tjanster-lista{background:var(--trelleborg-beige);padding:3rem 1.5rem}
.trelleborg-tjanster-lista-inner{max-width:1200px;margin:0 auto}
.trelleborg-tjanster-lista h3{margin-bottom:1.5rem;text-align:center}
.trelleborg-tjanster-lankar{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem}
.trelleborg-tjanster-lankar a{background:var(--trelleborg-vit);padding:0.8rem 1.5rem;border-radius:50px;color:var(--trelleborg-mork);font-weight:500;transition:background 0.3s,color 0.3s}
.trelleborg-tjanster-lankar a:hover{background:var(--trelleborg-turkos);color:var(--trelleborg-vit)}
/* Footer */
.trelleborg-footer{background:var(--trelleborg-mork);color:var(--trelleborg-vit);padding:3rem 1.5rem 1.5rem}
.trelleborg-footer-inner{max-width:1200px;margin:0 auto}
.trelleborg-footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem;margin-bottom:2rem}
.trelleborg-footer h4{color:var(--trelleborg-vit);margin-bottom:1rem}
.trelleborg-footer p{color:rgba(255,255,255,0.7);margin-bottom:0.5rem}
.trelleborg-footer a{color:rgba(255,255,255,0.7);transition:color 0.3s}
.trelleborg-footer a:hover{color:var(--trelleborg-turkos-ljus)}
.trelleborg-footer ul{list-style:none}
.trelleborg-footer li{margin-bottom:0.5rem}
.trelleborg-footer-botten{border-top:1px solid rgba(255,255,255,0.1);padding-top:1.5rem;text-align:center;color:rgba(255,255,255,0.5);font-size:0.9rem}
/* Artikelinnehåll */
.trelleborg-artikel{max-width:800px;margin:0 auto}
.trelleborg-artikel h2{margin-top:2.5rem}
.trelleborg-artikel h3{margin-top:2rem}
.trelleborg-artikel ul,.trelleborg-artikel ol{margin:1rem 0 1rem 1.5rem;color:var(--trelleborg-gra)}
.trelleborg-artikel li{margin-bottom:0.5rem}
.trelleborg-artikel strong{color:var(--trelleborg-mork)}
.trelleborg-artikel em{color:var(--trelleborg-turkos)}
.trelleborg-artikel u{text-decoration-color:var(--trelleborg-turkos)}
/* Breadcrumbs */
.trelleborg-breadcrumbs{padding:1rem 1.5rem;background:var(--trelleborg-beige)}
.trelleborg-breadcrumbs-inner{max-width:1200px;margin:0 auto;font-size:0.9rem}
.trelleborg-breadcrumbs a{color:var(--trelleborg-gra)}
.trelleborg-breadcrumbs span{color:var(--trelleborg-mork)}
/* Extern länk-stil */
.trelleborg-extern{color:var(--trelleborg-turkos);text-decoration:underline;text-decoration-style:dotted}
.trelleborg-extern:hover{text-decoration-style:solid}
/* Responsiv design */
@media(min-width:768px){.trelleborg-nav{display:block}.trelleborg-meny-knapp{display:none}.trelleborg-hero{padding:5rem 1.5rem 6rem}.trelleborg-sektion{padding:5rem 1.5rem}}
@media(min-width:1024px){.trelleborg-hero-inner{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}}
/* Print */
@media print{.trelleborg-header,.trelleborg-footer,.trelleborg-cta,.trelleborg-meny-knapp{display:none}.trelleborg-sektion{padding:1rem 0}}