/* Gemensam stil för tjänstesidorna och integritetspolicyn. Samma grund som projekt.html. */
body{margin:0;background:#FFFFFF;font-family:'Familjen Grotesk','Helvetica Neue',Helvetica,sans-serif;color:#171717;font-size:18px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:#171717}
h1,h2,h3{margin:0;font-weight:700;letter-spacing:-0.02em;text-wrap:balance}
p{margin:0;text-wrap:pretty}
ul,ol,figure{margin:0;padding:0;list-style:none}
.i{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
:focus-visible{outline:3px solid #171717;outline-offset:3px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;box-sizing:border-box;padding:0 28px;border:2px solid transparent;border-radius:4px;font-size:18px;font-weight:700;line-height:1.2;text-decoration:none;cursor:pointer;transition:background-color .15s,color .15s,border-color .15s}
.btn-p{background:#E35214;border-color:#E35214;color:#171717}
.btn-p:hover{background:#171717;border-color:#171717;color:#FFFFFF}
.btn-ink{background:#171717;border-color:#171717;color:#FFFFFF}
.btn-ink:hover{background:#FFFFFF;color:#171717}
.lnk{font-weight:700;text-decoration:underline;text-decoration-color:#E35214;text-decoration-thickness:2px;text-underline-offset:6px}
.lnk:hover{text-decoration-color:currentColor}
.nav a{display:flex;align-items:center;min-height:44px;font-size:17px;font-weight:500;text-decoration:none}
.nav a:hover,.nav a[aria-current]{text-decoration:underline;text-decoration-color:#E35214;text-decoration-thickness:2px;text-underline-offset:6px}
.skip{position:absolute;left:16px;top:-80px;z-index:10;padding:12px 16px;background:#171717;color:#FFFFFF;font-weight:700;text-decoration:none}
.skip:focus{top:16px;color:#FFFFFF}
@media (prefers-reduced-motion: reduce){*{transition:none !important}}

.wrap{padding-left:max(20px,calc(50% - 608px));padding-right:max(20px,calc(50% - 608px))}
header{height:72px;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid #D6D9D6}
header .logo img{height:30px;width:auto;display:block}
.head-r{display:flex;align-items:center;gap:32px}
.nav{display:none;align-items:center;gap:32px}
.tel{display:none;align-items:center;gap:8px;min-height:44px;font-size:17px;text-decoration:none;color:#3D403E}
.head-r .btn{min-height:48px;padding:0 20px;font-size:17px}

.intro{padding-top:32px;padding-bottom:32px;display:flex;flex-direction:column;gap:16px}
.intro h1{font-size:40px;line-height:1.05}
.tillbaka{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;min-height:44px;font-size:17px;font-weight:500;text-decoration:none;color:#3D403E}
.tillbaka:hover{text-decoration:underline;text-decoration-color:#E35214;text-decoration-thickness:2px;text-underline-offset:6px}
.ingress{max-width:680px;font-size:20px;line-height:1.55;color:#3D403E}

.tjanst{padding-bottom:64px;display:grid;grid-template-columns:1fr;gap:40px;align-items:start}
.bild img{width:100%;height:auto;display:block;border-radius:4px;background:#CDD1CD}
.bild figcaption{padding-top:10px;font-size:16px;line-height:1.5;color:#595D5A}
.text{display:flex;flex-direction:column;gap:14px;max-width:640px}
.text h2{font-size:26px;line-height:1.2;padding-top:16px}
.text h2:first-child{padding-top:0}
.text p{color:#3D403E}
.text ul{border-top:1px solid #D6D9D6}
.text li{padding:12px 0;border-bottom:1px solid #D6D9D6}
.lankar{display:flex;flex-wrap:wrap;gap:0 28px;padding-top:8px}
.lankar a{display:flex;align-items:center;min-height:44px}

.band{padding-top:56px;padding-bottom:56px;background:#E35214;display:flex;flex-direction:column;gap:16px}
.band h2{font-size:32px;line-height:1.1}
.band p{font-size:19px;line-height:1.5}
.band .btn{align-self:flex-start}
.band-text{display:flex;flex-direction:column;gap:8px}
footer{padding-top:32px;padding-bottom:32px;display:flex;flex-direction:column;gap:8px;font-size:16px;line-height:1.5;color:#595D5A}
footer a{color:#595D5A;display:inline-flex;align-items:center;min-height:44px}

@media (min-width:600px){
  .intro h1{font-size:52px}
}
@media (min-width:1024px){
  header{height:88px}
  header .logo img{height:40px}
  .nav,.tel{display:flex}
  .head-r .btn{padding:0 22px}
  .intro{padding-top:56px;padding-bottom:48px}
  .intro h1{font-size:64px}
  .ingress{font-size:22px}
  .tjanst{grid-template-columns:7fr 5fr;gap:72px;padding-bottom:104px}
  .tjanst.utan-bild{grid-template-columns:1fr}
  .band{flex-direction:row;align-items:center;justify-content:space-between;padding-top:72px;padding-bottom:72px}
  .band h2{font-size:44px}
  .band .btn{align-self:center;flex-shrink:0}
  footer{flex-direction:row;justify-content:space-between}
}
