/* Bransjesidene (regnskap-*.html og bransjer.html). Lages av tools/bransjesider.py.
   Fast rytme: toppen med bilde, fire kort, ett bilde med tekst, eksempel, spørsmål, avslutning. Samme bredde og avstand overalt. */
*{box-sizing:border-box}
html,body{margin:0;background:#F4F1EA;color:#0B2545;font-family:'Schibsted Grotesk',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:#0B2545}
main{overflow-x:clip}
.bredde{max-width:1200px;margin:0 auto;padding:0 clamp(16px,4vw,48px)}
.blokk{padding-top:clamp(64px,8vw,104px)}
.sti{display:flex;flex-wrap:wrap;gap:6px;font-size:14px;color:#586174;margin-bottom:18px}
.sti a{color:#586174}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#1F7D52}
h1{font-size:clamp(30px,3.6vw,48px);line-height:1.06;letter-spacing:-.035em;font-weight:600;margin:12px 0 0;text-wrap:balance}
h2{font-size:clamp(28px,3.2vw,40px);line-height:1.1;letter-spacing:-.025em;font-weight:600;margin:0;text-wrap:balance}
.lead{font-size:clamp(17.5px,1.6vw,20px);line-height:1.6;color:#3D4759;margin:18px 0 0;max-width:600px;text-wrap:pretty}
.ingress{font-size:17.5px;line-height:1.6;color:#3D4759;margin:12px 0 0;max-width:640px}
.knapper{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.knapp{height:52px;padding:0 24px;border-radius:99px;display:inline-flex;align-items:center;font-size:16.5px;font-weight:600;text-decoration:none;white-space:nowrap}
.knapp.mork{background:#0B2545;color:#fff}.knapp.mork:hover{background:#16345E}
.knapp.lys{background:#fff;border:1px solid #D9D3C6;color:#0B2545}.knapp.lys:hover{border-color:#0B2545}
.under{font-size:14px;color:#586174;margin:12px 0 0}

/* Toppen: tekst til venstre, skjermbilde til høyre. */
.topp{padding-top:clamp(28px,4vw,48px);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(32px,4vw,56px);align-items:center}

/* Nettleservindu rundt skjermbildene, som på forsiden. */
.vindu{margin:0;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px #DCD6C9,0 26px 60px rgba(11,37,69,.18)}
.vindu-topp{height:34px;display:flex;align-items:center;gap:7px;padding:0 14px;background:#F7F5F0;border-bottom:1px solid #E7E2D7}
.vindu-topp i{width:10px;height:10px;border-radius:99px;background:#DDD7CB;flex:none}
.vindu-topp span{margin:0 auto;transform:translateX(-22px);height:22px;padding:0 12px;border-radius:7px;background:#EDE9E0;display:flex;align-items:center;font-size:12px;color:#586174;font-weight:500;white-space:nowrap}
.vindu img{display:block;width:100%;height:auto}
.bildetekst{font-size:14.5px;line-height:1.5;color:#586174;margin:14px 2px 0}

/* iPhone-rammen, lik den på forsiden. */
.ip{position:relative;container-type:inline-size;aspect-ratio:1000/2069;flex:none;isolation:isolate}
.ip-kropp{position:absolute;inset:0;border-radius:17.6cqw;padding:1.15cqw;background:linear-gradient(140deg,#e4e1da 0%,#a19e97 14%,#6c6a66 38%,#5a5855 55%,#8d8a84 80%,#d8d5ce 100%);box-shadow:0 0 0 .22cqw #2f2e2c,0 2.5cqw 5cqw rgba(11,37,69,.18),0 10cqw 22cqw rgba(11,37,69,.22)}
.ip-ramme{position:relative;height:100%;border-radius:16.5cqw;padding:3.1cqw;background:#050506;box-shadow:inset 0 0 0 .35cqw #1d1d20,inset 0 0 0 .7cqw #000}
.ip-skjerm{position:relative;height:100%;border-radius:13.3cqw;overflow:hidden;background:var(--sb,#fff);container-type:inline-size;isolation:isolate}
.ip-status{position:absolute;left:0;right:0;top:0;height:13.74cqw;display:flex;align-items:center;justify-content:space-between;z-index:2;background:var(--sb,#fff);color:#000;font:600 4.35cqw/1 -apple-system,BlinkMacSystemFont,'SF Pro Text','Helvetica Neue','Schibsted Grotesk',system-ui,sans-serif;letter-spacing:-.01em}
.ip.mork .ip-status{background:transparent;color:#fff}
.ip-tid{width:34cqw;text-align:center;padding-left:4.2cqw;padding-top:.6cqw}
.ip-ikoner{width:34cqw;display:flex;align-items:center;justify-content:center;gap:1.45cqw;padding-right:4.2cqw;padding-top:.4cqw}
.ip-ikoner svg{display:block;fill:currentColor}
.ip-oy{position:absolute;top:2.8cqw;left:50%;width:32cqw;height:9.4cqw;margin-left:-16cqw;border-radius:99px;z-index:3;background:radial-gradient(circle at 80% 50%,#26324f 0 .9cqw,#0d1220 1.3cqw,#000 1.6cqw)}
.ip-innhold{position:absolute;left:0;right:0;top:13.74cqw;bottom:0;overflow:hidden}
.ip-innhold>img{display:block;width:100%;height:auto}
.ip-hjem{position:absolute;bottom:2.1cqw;left:50%;width:34cqw;height:1.3cqw;margin-left:-17cqw;border-radius:99px;background:rgba(0,0,0,.82);z-index:3}
.ip.mork .ip-hjem{background:rgba(255,255,255,.82)}
.ip-k{position:absolute;width:.95cqw;border-radius:.5cqw;background:linear-gradient(90deg,#5d5b57,#b9b6af 45%,#6f6d69);z-index:-1}
.ip-k.v{left:-.7cqw}.ip-k.h{right:-.7cqw}

/* Utsnitt fra systemet og vaktplanen med telefon. */
.flate{margin:0;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px #DCD6C9,0 22px 50px -20px rgba(11,37,69,.25)}
.flate img{display:block;width:100%;height:auto}
.topp-tlf{display:flex;flex-direction:column;align-items:center}
.topp-tlf .ip{width:clamp(220px,22vw,280px)}
.flate.uke{margin-top:28px}
.uke-rull{overflow-x:auto;-webkit-overflow-scrolling:touch}
.sveip{display:none;font-size:14px;color:#586174;margin:10px 2px 0}
.eks{display:flex;flex-direction:column;gap:clamp(56px,7vw,88px);margin-top:40px}
.eks-rad{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;max-width:900px}
.eks-rad.med-tlf{grid-template-columns:minmax(0,1fr) clamp(170px,17vw,230px);max-width:none}
.eks-tekst{max-width:640px}
.eks-tekst .nr{width:32px;height:32px;border-radius:99px;background:#FBF0B8;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;margin-bottom:14px}
.eks-tekst h3{margin:0 0 10px;font-size:22px;line-height:1.25;font-weight:600;letter-spacing:-.015em}
.eks-tekst p{margin:0;font-size:16.5px;line-height:1.65;color:#3D4759}
.eks-rad .flate{margin-top:24px}
.eks-tlf .ip{width:100%}

/* Fire kort. */
.kort{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:32px}
.kort article{background:#fff;border:1px solid #E4DFD4;border-radius:20px;padding:26px 26px 24px}
.kort .nr{width:32px;height:32px;border-radius:99px;background:#FBF0B8;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;margin-bottom:16px}
.kort h3{margin:0 0 8px;font-size:19px;line-height:1.3;font-weight:600;letter-spacing:-.01em}
.kort p{margin:0;font-size:16px;line-height:1.6;color:#3D4759}

/* Bilde med tekst ved siden av. */
.rad{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,4vw,56px);align-items:center}
.rad h2{font-size:clamp(26px,2.6vw,34px)}
.liste{list-style:none;padding:0;margin:24px 0 0;display:flex;flex-direction:column;gap:10px}
.liste li{display:flex;gap:12px;font-size:16.5px;line-height:1.5}
.liste li::before{content:"";flex:none;width:22px;height:22px;margin-top:1px;border-radius:50%;background:#E2F1E8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231F7D52' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12l4 4 8-8'/%3E%3C/svg%3E") center/12px no-repeat}
.mer{margin:22px 0 0;font-size:15.5px;color:#586174}
.mer a{color:#0B2545;font-weight:600}

/* Eksempel: tekst til venstre, utregning til høyre. */
.regne{background:#fff;border:1px solid #E4DFD4;border-radius:24px;padding:clamp(24px,4vw,44px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}
.regne h2{font-size:clamp(24px,2.4vw,30px)}
.regne p{margin:12px 0 0;font-size:16.5px;line-height:1.6;color:#3D4759}
.regne .merk{font-size:14px;color:#586174;margin-top:16px}
.regne table{width:100%;border-collapse:collapse;font-size:16px;background:#FAF8F3;border-radius:16px;overflow:hidden}
.regne td{padding:14px 18px;border-top:1px solid #EFEBE2}
.regne tr:first-child td{border-top:0}
.regne td:last-child{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.regne tr.sum td{border-top:2px solid #0B2545;font-weight:700;background:#fff}

/* Spørsmål: samme som på forsiden. */
.faq{max-width:820px;margin:0 auto}
.faq h2{text-align:center;margin-bottom:28px}
.sp{background:#fff;border:1px solid #E4DFD4;border-radius:16px;margin-bottom:10px;transition:border-color .3s ease,box-shadow .3s ease}
.sp.apen{border-color:#D9D3C6;box-shadow:0 12px 30px rgba(11,37,69,.08)}
.sp button{all:unset;box-sizing:border-box;width:100%;min-height:64px;padding:12px 20px;display:flex;align-items:center;gap:14px;cursor:pointer;font-size:17px;font-weight:600;line-height:1.35;color:#0B2545}
.sp button:focus-visible{outline:2px solid #0B2545;outline-offset:2px;border-radius:16px}
.sp button span{flex:1}
.sp button i{flex:none;width:32px;height:32px;border-radius:99px;background:#F4F1EA;display:flex;align-items:center;justify-content:center;transition:transform .38s cubic-bezier(.2,.7,.2,1),background .3s ease}
.sp.apen button i{transform:rotate(45deg);background:#F6DF6E}
.sp .svar{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .45s cubic-bezier(.2,.7,.2,1),opacity .35s ease}
.sp.apen .svar{grid-template-rows:1fr;opacity:1}
.sp .svar>div{overflow:hidden;min-height:0}
.sp .svar p{margin:0;padding:0 20px 20px;font-size:16px;line-height:1.6;color:#3E4A5E;max-width:660px;transform:translateY(-8px);transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.sp.apen .svar p{transform:none}

/* Avslutning og lenker til de andre bransjene. */
.cta{background:#0B2545;color:#fff;border-radius:28px;padding:clamp(28px,5vw,56px);display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.cta h2{color:#fff}
.cta p{margin:10px 0 0;color:#C9D3E2;font-size:17px;line-height:1.5;max-width:560px}
.cta .knapp.lys{border:0}
.andre{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.andre a{padding:9px 16px;border-radius:99px;background:#fff;border:1px solid #E4DFD4;text-decoration:none;font-size:15px;font-weight:500}
.andre a:hover{border-color:#0B2545}
.andre-t{font-size:15px;font-weight:600;color:#586174}

/* Oversikten (bransjer.html). */
.oversikt{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:40px}
.oversikt a{display:flex;flex-direction:column;gap:10px;background:#fff;border:1px solid #E4DFD4;border-radius:20px;padding:24px;text-decoration:none;min-height:176px;transition:border-color .2s,box-shadow .2s}
.oversikt a:hover{border-color:#0B2545;box-shadow:0 14px 30px -18px rgba(11,37,69,.35)}
.oversikt .ik{width:44px;height:44px;border-radius:12px;background:#FBF0B8;display:flex;align-items:center;justify-content:center}
.oversikt b{font-size:20px;font-weight:600;letter-spacing:-.01em}
.oversikt span{font-size:15.5px;line-height:1.55;color:#3D4759}
.oversikt em{margin-top:auto;font-style:normal;font-size:15px;font-weight:600;color:#1F7D52}
.oversikt-t{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#586174;margin:48px 0 0}
.oversikt-t+.oversikt{margin-top:16px}

footer{margin-top:clamp(64px,8vw,104px);border-top:1px solid #E4DFD4;padding:26px 16px;text-align:center;font-size:14px;color:#586174}
footer a{color:#586174;margin:0 8px}

@media (max-width:1000px){.topp,.rad{grid-template-columns:1fr}.oversikt{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.regne{grid-template-columns:1fr}}
@media (max-width:640px){.uke-rull img{width:760px;max-width:none}.sveip{display:block}.eks-rad.med-tlf{grid-template-columns:1fr}.eks-tlf .ip{width:min(220px,62vw);margin:0 auto}.kort,.oversikt{grid-template-columns:1fr}.vindu{border-radius:10px}.vindu-topp{height:26px}.vindu-topp span{display:none}.sp button{font-size:16px;padding:12px 16px}}
