/* SAITECH hjemmeside. Bygger på den godkendte Signal-variant (ultimativ.html + base.css). */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
:root{--forest:#173F2C;--green:#1B6B43;--ink:#0F2740;--paper:#EEF4FA;--line:#C6D7E8;--soft:#D6E8DC;--focus:#B4460C;--weak:#A8261B;
  --map-floor:#fff;--map-wall:#0F2740;--map-ink:#0F2740;--map-signal:#2E9A5E;--map-weak:#A8261B;--map-device:#173F2C;--map-ground:#E2ECF5;--map-yard:#D2DEEA}
body{margin:0;font-family:Seravek,"Gill Sans Nova","Gill Sans",Calibri,"Segoe UI",sans-serif;font-size:1.25rem;line-height:1.55;color:var(--ink);background:var(--paper);overflow-wrap:break-word}
h1,h2,h3,h4{font-family:Charter,"Bitstream Charter","Sitka Text",Cambria,Georgia,serif;font-weight:700;letter-spacing:-.005em}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure{margin:0}
svg{max-width:100%}
a{color:inherit;text-underline-offset:.18em}
button{font:inherit;color:inherit;min-height:56px;cursor:pointer}
a,button{touch-action:manipulation}
:focus-visible{outline:4px solid var(--focus);outline-offset:4px}
[hidden]{display:none!important}
.fine{font-size:1rem;line-height:1.5}
.skip{position:absolute;left:12px;top:-100px;z-index:9;background:#fff;color:var(--ink);padding:14px 20px;border-radius:10px;font-weight:700}
.skip:focus{top:12px}

/* ---- Sidebar ---- */
.layout{display:grid;grid-template-columns:336px minmax(0,1fr);min-height:100vh}
aside{--focus:#FFD24A;background:var(--forest);color:#fff}
.rail{display:flex;flex-direction:column;gap:22px;padding:28px 24px}
.toprow{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px}
.brand{display:inline-flex;align-items:center;gap:12px;min-height:56px;text-decoration:none;line-height:1.1}
.brand svg{flex:none;width:44px;height:44px}
.brand b{display:block;font-size:1.3rem;letter-spacing:.04em}
.brand span{display:block;font-size:1rem;color:var(--soft)}
.lang{padding:0 18px;border:2px solid #6FA88A;border-radius:12px;background:transparent;color:#fff;font-weight:700}
.lang:hover{border-color:#fff}
.topcall{display:none;min-height:56px;align-items:center;font-weight:700;color:#fff}
aside h1{font-size:1.6rem;line-height:1.25}
.intro{color:var(--soft);margin-top:6px}

.menu{list-style:none;padding:0;display:grid;gap:12px}
.choice{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start;padding:14px 16px;min-height:56px;border:2px solid #6FA88A;border-radius:16px;color:#fff;text-decoration:none}
.choice:hover{border-color:#fff}
.choice:focus-visible{outline-offset:-8px}
.choice svg{width:44px;height:44px;padding:6px;border-radius:12px;background:rgba(255,255,255,.1)}
.txt{display:grid;gap:2px}
.txt b{font-size:1.25rem;line-height:1.25}
.sub{font-size:1rem;line-height:1.4;color:var(--soft)}
.chosen{display:none;font-weight:700;color:var(--green);margin-top:2px}
[aria-current="page"] .chosen,[aria-pressed="true"] .chosen{display:inline-flex}
.choice[aria-current="page"]{--focus:#B4460C;background:var(--paper);border-color:var(--paper);color:var(--ink)}
.choice[aria-current="page"] .sub{color:var(--ink)}
.choice[aria-current="page"] svg{background:#fff;color:var(--green)}

.help{margin-top:auto;border-top:2px solid #3F7A5B;padding-top:20px;display:grid;gap:12px}
.tel{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 20px;border-radius:12px;background:#fff;color:var(--forest);font-weight:700;text-decoration:none}

/* ---- Hovedflade ---- */
main{padding:40px clamp(20px,4vw,64px) 32px;outline:none}
.inner{max-width:960px;display:grid;gap:28px}
.view{display:grid;gap:28px}
.view-title{font-size:clamp(1.85rem,1.4rem + 1.3vw,2.6rem);line-height:1.15;outline:none}
.lead{max-width:36em;margin-top:10px}
.group{display:grid;gap:12px}
.group h3,.talk h3,.side h3{font-size:1.45rem;line-height:1.25}
.caveat{max-width:44em;border-left:5px solid var(--ink);padding:4px 0 4px 16px}

/* Knapper og links med samme størrelse som i det godkendte design */
.btn,.btn-line{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 24px;border-radius:12px;font-weight:700;text-decoration:none;text-align:center;border:0}
.btn{background:var(--green);color:#fff}
.btn-line{background:#fff;color:var(--green);box-shadow:inset 0 0 0 3px var(--green)}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:14px}

/* Ydelser: én hvid liste pr. gruppe, adskilt af linjer */
.ledger{list-style:none;padding:0;background:#fff;border:2px solid var(--line);border-radius:20px}
.svc{display:grid;gap:6px;padding:18px 22px}
.svc+.svc{border-top:2px solid var(--line)}
.svc-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:2px 20px}
.svc h4{font-size:1.3rem;line-height:1.3}
.svc-price{font-weight:700;color:var(--green);white-space:nowrap}
.svc-desc{max-width:40em}
.group>.fine{max-width:44em}

/* To indgange til privat hjælp */
.doors{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}
.door{display:grid;align-content:start;gap:8px;padding:22px;border-radius:20px;background:var(--soft);border:2px solid #B5D3BF}
.door h4{font-size:1.5rem;line-height:1.2}
.door .svc-price{font-size:1.6rem}

/* ---- WiFi ---- */
.modes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:12px}
.mode{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:start;text-align:left;padding:14px 16px;border:2px solid var(--line);border-radius:16px;background:#fff}
.mode:hover{border-color:var(--green)}
.mode svg{width:44px;height:44px;padding:5px;border-radius:12px;background:var(--paper);color:var(--green)}
.mode .sub{color:var(--ink)}
.mode[aria-pressed="true"]{background:var(--green);border-color:var(--green);color:#fff}
.mode[aria-pressed="true"] .sub,.mode[aria-pressed="true"] .chosen{color:#fff}
.mode[aria-pressed="true"] svg{background:#fff}

.pick{display:grid;gap:10px}
.pick-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 24px}
.pick-head h3{font-size:clamp(1.6rem,1.3rem + .9vw,2.1rem);line-height:1.2}
.price{font-size:clamp(1.5rem,1.3rem + .6vw,1.9rem);font-weight:700;color:var(--green);white-space:nowrap}
.pick p{max-width:40em}

.plan{display:grid;gap:14px;background:#fff;border:2px solid var(--line);border-radius:20px;padding:20px}
.plan-top{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
.stage{display:inline-flex;align-items:center;min-height:44px;padding:4px 16px;border-radius:999px;font-weight:700;font-size:1.15rem;border:2px solid var(--ink)}
.stage[data-stage="before"]{color:var(--weak);border-color:var(--weak);background:#FBECEA}
.stage[data-stage="after"]{color:#fff;border-color:var(--green);background:var(--green)}
.plan-top .btn,.plan-top .btn-line{margin-left:auto}
.explain{border-left:5px solid var(--green);padding:2px 0 2px 16px;max-width:44em}
.map{border-radius:12px;overflow:hidden}
.plan figcaption{display:grid;gap:8px}

/* Plantegning (fra base.css) */
.map svg{display:block;width:100%;height:auto;animation:map-in .3s ease-out}
@keyframes map-in{from{opacity:.35}to{opacity:1}}
.map text{font-family:inherit}
.m-ground{fill:var(--map-ground)}
.m-edge{fill:none;stroke:var(--map-ink);stroke-width:2.5;stroke-dasharray:2 8;stroke-linecap:round}
.m-floor{fill:var(--map-floor)}
.m-wall{fill:none;stroke:var(--map-wall);stroke-width:6;stroke-linejoin:round}
.m-yard{fill:var(--map-yard)}
.m-stripe{stroke:var(--map-floor);stroke-width:4}
.m-cover{fill:var(--map-signal);opacity:.3}
.m-weak{fill:var(--map-weak);opacity:.13}
.m-tag rect{fill:var(--map-weak)}
.m-tag text{fill:#fff;font-size:18px;font-weight:700}
.m-label{fill:var(--map-ink);font-size:22px;font-weight:700}
.m-dlabel{fill:var(--map-ink);font-size:18px;font-weight:700;paint-order:stroke;stroke:var(--map-floor);stroke-width:6px;stroke-linejoin:round}
.m-note{fill:var(--map-ink);font-size:18px;font-style:italic}
.m-dev{fill:var(--map-device);stroke:var(--map-floor);stroke-width:3}
.m-dot{fill:var(--map-floor)}
.m-ring{fill:none;stroke:var(--map-floor);stroke-width:3}
.m-ant{stroke:var(--map-device);stroke-width:5;stroke-linecap:round}
.m-hop{fill:none;stroke:var(--map-device);stroke-width:5;stroke-dasharray:1 12;stroke-linecap:round}
.m-cable{fill:none;stroke:var(--map-device);stroke-width:5;stroke-linejoin:round}
.m-out{fill:none;stroke:var(--map-ink);stroke-width:3;stroke-dasharray:10 8}
.map-small .m-label{font-size:26px}
.map-small .m-note{font-size:25px;font-style:normal}
.map-small .m-dlabel{font-size:25px}

.legend{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;font-size:1rem}
.legend li{display:flex;align-items:center;gap:.55rem}
.sw{flex:none;width:1.5rem;height:1rem;border-radius:4px}
.sw-dev{width:1rem;border-radius:50%;background:var(--map-device)}
.sw-cover{background:var(--map-signal);opacity:.45}
.sw-weak{background:var(--map-weak);opacity:.35;outline:2px solid var(--map-weak)}
.sw-cable{height:5px;background:var(--map-device)}
.sw-out{border:3px dashed var(--map-ink)}

.side{display:grid;gap:10px;padding:22px;border:2px solid var(--line);border-radius:20px;background:#fff}
.side p{max-width:40em}

/* ---- Priser ---- */
.table-wrap{background:#fff;border:2px solid var(--line);border-radius:20px;overflow:hidden}
.prices{width:100%;border-collapse:collapse}
.prices th,.prices td{text-align:left;vertical-align:top;padding:16px 22px}
.prices thead th{font-size:1rem;background:#F6F9FC}
.prices tbody tr{border-top:2px solid var(--line)}
.prices tbody th{font-weight:400}
.prices tbody th b{display:block;font-family:Charter,"Bitstream Charter","Sitka Text",Cambria,Georgia,serif;font-size:1.2rem;line-height:1.3;margin-bottom:4px}
.prices .p{text-align:right;font-weight:700;color:var(--green);width:1%;white-space:nowrap}
.terms{display:grid;gap:10px;padding-left:1.2em;max-width:44em}

/* ---- Kontakt og downloads ---- */
.talk{display:grid;gap:6px;background:#fff;border:2px solid var(--line);border-radius:20px;padding:22px}
.reach{display:grid;gap:14px}
.reach div{display:grid;gap:2px}
.reach dt{font-size:1rem}
.reach dd{font-size:1.45rem;font-weight:700}
.reach a{display:inline-flex;align-items:center;min-height:48px}
.files{list-style:none;padding:0;display:grid;gap:10px;max-width:36em}
.file{display:flex;align-items:center;gap:14px;min-height:56px;padding:10px 18px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 2px var(--line);text-decoration:none;font-weight:700}
.file:hover{box-shadow:inset 0 0 0 3px var(--green)}
.file svg{flex:none;width:28px;height:28px;color:var(--green)}
.file span{display:grid}
.file small{font-size:1rem;font-weight:400}
.other{display:grid;gap:6px}
.other ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:0 24px}
.other a{display:inline-flex;align-items:center;min-height:48px}

.foot{display:grid;gap:6px;border-top:2px solid var(--line);padding-top:18px;margin-top:8px}
.error{font-size:1.25rem;font-weight:700}

@media (min-width:901px){
  .choice[aria-current="page"]{margin-right:-24px;border-radius:16px 0 0 16px}
}
@media (min-width:901px) and (min-height:900px){
  .rail{position:sticky;top:0;height:100vh;overflow-y:auto}
}
@media (max-width:900px){
  .layout{grid-template-columns:1fr;min-height:0}
  .help{display:none}
  .topcall{display:inline-flex}
  .rail{padding:16px 16px 22px;gap:16px}
  .menu{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .menu li:last-child:nth-child(odd){grid-column:1/-1}
  .choice{grid-template-columns:36px 1fr;gap:10px;padding:12px;align-items:center}
  .choice svg{width:36px;height:36px;padding:4px}
  .choice .sub{display:none}
  .txt b{font-size:1.1rem}
  main{padding:28px 16px 28px}
}
@media (max-width:600px){
  aside h1{font-size:1.4rem}
  .inner,.view{gap:22px}
  .plan{padding:12px;border-radius:16px}
  .plan-top .btn,.plan-top .btn-line{width:100%;margin-left:0}
  .svc{padding:16px}
  .door,.side,.talk{padding:18px}
  .actions a{flex:1 1 100%}
  .prices th,.prices td{padding:14px 12px}
  .prices .p{white-space:normal;min-width:6.5em}
}
@media (max-width:380px){
  .menu{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
@media print{
  aside,.plan-top .btn,.plan-top .btn-line,.actions{display:none}
  .layout{display:block}
  .view[hidden]{display:grid!important}
}