/* ============================================================
   Behandlingsnett Commerce – ptc-v13.css

   Bestillingsskjema (.ptc-v2) og kvittering (.ptc-receipt). Mobil-først, mot bnett-tokens med
   trygge fallbacks.

   Merk om filnavn: fra v7.0 blir ikke denne filen omdøpt ved hver
   endring. Cachen brytes av ?ver= fra plugin-versjonen. Den gamle
   vanen etterlot elleve foreldreløse filer (v8–v12 css, v2–v7 js)
   som ingenting lenger pekte på – de er fjernet.

   Kontaktskjemaet på behandlerprofilene har sin egen, lille fil
   (ptc-kontakt.css), slik at en profilside slipper å laste hele
   bestillingsskjemaets CSS for én knapp.
   ============================================================ */

.ptc-v2,
.ptc-v2 *{ box-sizing:border-box; }
/* hidden-attributtet skal alltid vinne over display-regler under */
.ptc-v2 [hidden]{ display:none !important; }

/* ------------------------------------------------------------
   Skjerming mot temaets globale knappestil (v5.1.1)
   ------------------------------------------------------------
   Elementor Kit setter `.elementor-kit-XXXX button { background-color;
   color; padding; border-radius; font-* }`. Den selektoren har
   spesifisitet 0-1-1 og slår derfor enkle klasseselektorer (0-1-0).
   Uten skjerming ble hele skjemaet – kategorivelger, planvalg og CTA –
   marineblått, og den valgte kategorien fikk hvit tekst på lys bakgrunn.

   To grep, som må stå sammen:
   1) Nullstillingen under fanger alle knapper i skjemaet, også dem vi
      ikke har gitt en egen klasse.
   2) Alle .ptc-v2__* og .ptc-receipt__*-regler er prefikset
      med sin egen rot (0-2-0). Den vinner alltid over temaets 0-1-1,
      uansett hvilken rekkefølge stilarkene lastes i – så dette holder
      også hvis cache-plugin eller Elementor endrer lasterekkefølgen.
   ------------------------------------------------------------ */
.ptc-v2 button,
.ptc-receipt button{
  -webkit-appearance:none;
  appearance:none;
  background:transparent;
  background-image:none;
  color:inherit;
  border:0;
  margin:0;
  padding:0;
  border-radius:0;
  font:inherit;
  font-weight:inherit;
  letter-spacing:normal;
  text-transform:none;
  text-shadow:none;
  box-shadow:none;
  line-height:1.45;
  min-height:0;
  width:auto;
}
.ptc-v2 button:hover,
.ptc-v2 button:focus,
.ptc-receipt button:hover,
.ptc-receipt button:focus{
  background:transparent;
  background-image:none;
  color:inherit;
  box-shadow:none;
}
/* Synlig tastaturfokus – nullstillingen over fjerner temaets egen ring. */
.ptc-v2 button:focus-visible,
.ptc-receipt button:focus-visible{
  outline:2px solid var(--p2-green, #245044);
  outline-offset:2px;
}

/* Nullstillingen over er 0-1-1 og taper mot temaet hvis temaets stilark
   skulle bli lastet SIST (f.eks. hvis en cache-plugin slår sammen CSS i en
   annen rekkefølge). Denne listen er 0-2-0 og vinner alltid. Den står
   bevisst FØR komponentreglene, slik at hver knapp kan sette sin egen
   radius og padding etterpå. Alle knappene i skjemaet er med her. */
.ptc-v2 .ptc-v2__catSelected,
.ptc-v2 .ptc-v2__catOpt,
.ptc-v2 .ptc-v2__plan,
.ptc-v2 .ptc-v2__moreToggle,
.ptc-v2 .ptc-v2__discountToggle,
.ptc-v2 .ptc-v2__btnGhost,
.ptc-v2 .ptc-v2__cta{
  font-weight:inherit;
  letter-spacing:normal;
  word-spacing:normal;
  text-transform:none;
  text-shadow:none;
  line-height:1.45;
  border-radius:0;
  border:0;
  margin:0;
  min-height:0;
}

.ptc-v2{
  --p2-green:#245044;      /* knappegrønn: WCAG AA mot hvit (4.80:1) */
  --p2-green-dark:#245044;
  --p2-accent:#3e8e5a;     /* lysere aksent for kanter/ikoner */
  --p2-pine:#133731;
  --p2-ink:#18392f;
  --p2-muted:#5a6b62;
  --p2-soft:#f4f6f0;
  --p2-sage:#e8efe6;
  --p2-line:#e6ebe9;
  --p2-radius:5px;
  max-width:640px;
  margin:0 auto;
  color:var(--p2-ink);
  font-family:var(--bnett-font-body, "Inter", -apple-system, system-ui, sans-serif);
  line-height:1.45;
}
.ptc-v2 .ptc-v2__card{
  background:#fff;
  border:1px solid var(--p2-line);
  border-radius:6px;
  box-shadow:none;
  padding:26px 22px;
}
@media (min-width:640px){
  .ptc-v2 .ptc-v2__card{ padding:34px 34px; }
}

/* ---- Header + trust ---- */
.ptc-v2 .ptc-v2__head{ margin-bottom:20px; }
.ptc-v2 .ptc-v2__title{
  margin:0 0 10px;
  font-family:var(--bnett-font-head, inherit);
  font-size:clamp(1.45rem, 3.6vw, 1.85rem);
  line-height:1.15;
  letter-spacing:-.02em;
  color:var(--p2-pine);
}
.ptc-v2 .ptc-v2__trust{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:6px 16px;
}
.ptc-v2 .ptc-v2__trust li{
  position:relative;
  padding-left:20px;
  font-size:13.5px;
  color:var(--p2-muted);
}
.ptc-v2 .ptc-v2__trust li::before{
  content:"\2713";
  position:absolute;
  left:0;
  color:var(--p2-green);
  font-weight:700;
}

/* ---- Seksjoner ---- */
.ptc-v2 .ptc-v2__section{ margin:20px 0; }
.ptc-v2 .ptc-v2__label{
  font-weight:700;
  font-size:14px;
  margin-bottom:8px;
  color:var(--p2-pine);
}
.ptc-v2 .ptc-v2__section[data-section="plan"],
.ptc-v2 .ptc-v2__section[data-section="steder"],
.ptc-v2 .ptc-v2__section[data-section="contact"]{
  border-top:1px solid var(--p2-line);
  padding-top:26px;
  margin-top:30px;
}
.ptc-v2 .ptc-v2__section[data-section="category"]{ margin-top:12px; }
.ptc-v2 .ptc-v2__stepTitle{
  display:flex; align-items:center; gap:12px;
  margin:0 0 18px; font-size:18px; line-height:1.25;
}
.ptc-v2 .ptc-v2__stepNumber{
  display:grid; place-items:center; flex:0 0 36px; width:36px; height:36px;
  border-radius:50%; background:var(--p2-sage); border:1px solid #cbdccf;
  color:var(--p2-pine); font-size:16px; font-weight:800;
}

/* ---- Kategori ---- */
.ptc-v2 .ptc-v2__catPicker{ position:relative; }
.ptc-v2 .ptc-v2__catSelected{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  background:var(--p2-soft);
  border:1.5px solid var(--p2-sage);
  border-radius:var(--p2-radius);
  padding:14px 16px;
  font-size:16px;
  cursor:pointer;
  font-family:inherit;
  color:inherit;
  text-align:left;
}
.ptc-v2 .ptc-v2__catSelected strong{ font-weight:700; }
.ptc-v2 .ptc-v2__catChange{
  font-size:13px;
  color:var(--p2-green-dark);
  white-space:nowrap;
}
.ptc-v2 .ptc-v2__catList{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:8px;
  padding:2px;
  border:0;
  max-height:360px;
  overflow-y:auto;
  background:#fff;
  box-shadow:none;
  scrollbar-width:thin;
  scrollbar-color:var(--p2-sage) transparent;
}
.ptc-v2 .ptc-v2__catList::-webkit-scrollbar{ width:10px; }
.ptc-v2 .ptc-v2__catList::-webkit-scrollbar-track{ background:transparent; }
.ptc-v2 .ptc-v2__catList::-webkit-scrollbar-thumb{
  background:var(--p2-sage);
  border-radius:999px;
  border:3px solid #fff;
}
.ptc-v2 .ptc-v2__catList::-webkit-scrollbar-thumb:hover{ background:#cfe1c4; }
.ptc-v2 .ptc-v2__catOpt{
  width:100%;
  display:flex;
  align-items:center;
  gap:11px;
  min-height:56px;
  padding:12px 15px;
  background:#fff;
  border:1px solid var(--p2-line);
  border-radius:var(--p2-radius);
  cursor:pointer;
  font-family:inherit;
  font-size:15px;
  color:inherit;
  text-align:left;
}
.ptc-v2 .ptc-v2__catOpt:hover{ border-color:#b9c9c2; }
/* Valgt kategori: grønn markering i stedet for bare lys bakgrunn, slik at
   den leses tydelig også når raden er den eneste lyse i en lang liste. */
.ptc-v2 .ptc-v2__catOpt.is-selected{
  background:#f4f9f5;
  font-weight:600;
  color:var(--p2-green-dark);
  border-color:var(--p2-green);
  box-shadow:0 0 0 1px var(--p2-green);
}
.ptc-v2 .ptc-v2__catOpt strong{flex:1;min-width:0;font-size:16px;font-weight:650;color:var(--p2-pine)}
.ptc-v2 .ptc-v2__catOpt::after{
  content:""; display:grid; place-items:center; flex:0 0 20px;
  width:20px;height:20px;margin-left:auto;border:1.5px solid #c3cfc9;
  border-radius:50%;color:#fff;font-size:13px;font-weight:700;
}
.ptc-v2 .ptc-v2__catOpt.is-selected::after{content:"\2713";background:var(--p2-green);border-color:var(--p2-green)}
@media(max-width:520px){.ptc-v2 .ptc-v2__catList{grid-template-columns:1fr}}

/* ---- Planer ---- */
.ptc-v2 .ptc-v2__plans{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}
@media (min-width:560px){
  .ptc-v2 .ptc-v2__plans{ grid-template-columns:1fr 1fr; }
}
/* Tre pakker fra v8.0.

   Her maales spalten, ikke vinduet. Skjemaet staar som regel i en
   innholdsspalte som er langt smalere enn skjermen, og en vanlig
   mediesporring ga tre klemte kolonner i en 600px spalte paa en 1280px
   skjerm. Nettlesere uten container queries faller ned paa én kolonne –
   det er stablet og fullt lesbart, bare hoeyere. */
.ptc-v2 [data-section="plan"]{ container-type:inline-size; }

@container (min-width:720px){
  .ptc-v2 .ptc-v2__plans--tre{ grid-template-columns:repeat(3, 1fr); }
}
@container (min-width:440px) and (max-width:719px){
  .ptc-v2 .ptc-v2__plans--tre{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}
.ptc-v2 .ptc-v2__plan{
  position:relative;
  text-align:left;
  background:#fff;
  border:1.5px solid var(--p2-line);
  border-radius:var(--p2-radius);
  padding:16px;
  cursor:pointer;
  font-family:inherit;
  color:inherit;
  transition:border-color .12s ease, box-shadow .12s ease;
}
.ptc-v2 .ptc-v2__plan:hover{ border-color:var(--p2-green); }
.ptc-v2 .ptc-v2__plan.is-selected{
  border-color:var(--p2-green);
  box-shadow:0 0 0 3px rgba(62,142,90,.18);
  background:linear-gradient(135deg, #fff 60%, var(--p2-soft));
}
.ptc-v2 .ptc-v2__plan.is-selected::after{
  content:"\2713";
  position:absolute;
  top:12px;
  right:12px;
  width:22px;
  height:22px;
  border-radius:50%;
  background:var(--p2-green);
  color:#fff;
  font-size:13px;
  font-weight:700;
  display:flex;
  align-items:center;
  justify-content:center;
}
.ptc-v2 .ptc-v2__planHead{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  margin-bottom:6px;
  padding-right:26px;
}
/* Merkelappen faar alltid sin egen linje. Da blir hodet like hoeyt paa alle
   tre kortene, og prisene staar paa linje ved siden av hverandre. */
.ptc-v2 .ptc-v2__plans--tre .ptc-v2__planBadge{ flex-basis:100%; width:fit-content; }
.ptc-v2 .ptc-v2__planName{
  font-weight:800;
  font-size:15px;
  text-transform:uppercase;
  letter-spacing:.03em;
}
.ptc-v2 .ptc-v2__planBadge{
  /* 11px var for smaatt. Merkelappen er det eneste som skiller pakkene fra
     hverandre paa et blikk, og mange av behandlerne er over femti. */
  font-size:12.5px;
  font-weight:700;
  padding:3px 9px;
  border-radius:4px;
  background:var(--p2-sage);
  color:var(--p2-green-dark);
  white-space:nowrap;
}
.ptc-v2 .ptc-v2__planPrice{
  font-size:26px;
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--p2-pine);
  margin-bottom:0;
  text-align:center;
  line-height:1.15;
}
.ptc-v2 .ptc-v2__per{
  font-size:14px;
  font-weight:500;
  color:var(--p2-muted);
  letter-spacing:0;
}
.ptc-v2 .ptc-v2__planStart{
  font-size:12.5px;
  font-weight:600;
  color:var(--p2-green-dark);
  margin-top:-4px;
  margin-bottom:6px;
}
.ptc-v2 .ptc-v2__planSub{
  font-size:13px;
  color:var(--p2-muted);
  margin-bottom:9px;
}
.ptc-v2 .ptc-v2__planFoot{
  margin:10px 0 0;
  font-size:12.5px;
  color:var(--p2-muted);
}
.ptc-v2 .ptc-v2__planList{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.ptc-v2 .ptc-v2__planList li{
  position:relative;
  padding-left:18px;
  font-size:13.5px;
  color:var(--p2-muted);
}
.ptc-v2 .ptc-v2__planList li::before{
  content:"\2713";
  position:absolute;
  left:0;
  color:var(--p2-green);
  font-weight:700;
  font-size:12px;
}
/* Det som IKKE er med skal vaere lett aa se, men ikke skrike. En strek
   gjennom teksten leses som «utilgjengelig», ikke som «du mister noe».

   Fargen var #8d9b93 – 2.9:1 mot hvitt, godt under kravet paa 4.5. Det
   er teksten som forteller hva du IKKE faar for pengene; akkurat den
   skal ingen maatte myse for aa lese. #6b7a73 ligger paa 4.5:1 og er
   fortsatt tydelig lysere enn resten, saa forskjellen paa «med» og
   «uten» holder. Streken foran baerer uansett hovedbudskapet. */
.ptc-v2 .ptc-v2__planList li.ptc-v2__nei{ color:#6b7a73; }
.ptc-v2 .ptc-v2__planList li.ptc-v2__nei::before{
  content:"\2013";
  color:#7d8b84;
  font-size:14px;
  line-height:1.15;
}

/* ---- Steder ---- */
.ptc-v2 .ptc-v2__labelHint{
  font-weight:500;
  font-size:12.5px;
  color:var(--p2-muted);
  margin-left:6px;
}
.ptc-v2 .ptc-v2__stedSok{ position:relative; }
.ptc-v2 .ptc-v2__stedInput{
  width:100%;
  padding:11px 12px;
  border:1.5px solid var(--p2-line);
  border-radius:var(--p2-radius);
  background:#fff;
  font-family:inherit;
  font-size:15px;
  line-height:1.3;
  color:var(--p2-ink);
}
.ptc-v2 .ptc-v2__stedInput:focus{ outline:2px solid var(--p2-green); outline-offset:1px; }
.ptc-v2 .ptc-v2__stedInput:disabled{ background:var(--p2-soft); color:var(--p2-muted); }
.ptc-v2 .ptc-v2__stedTreff{
  position:absolute;
  z-index:5;
  left:0; right:0; top:calc(100% + 4px);
  background:#fff;
  border:1px solid var(--p2-line);
  border-radius:var(--p2-radius);
  box-shadow:0 8px 24px rgba(20,36,29,.12);
  overflow:hidden;
}
.ptc-v2 .ptc-v2__stedOpt{
  display:flex;
  width:100%;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  background:#fff;
  border:0;
  border-bottom:1px solid var(--p2-line);
  text-align:left;
  cursor:pointer;
  font-family:inherit;
  color:inherit;
}
.ptc-v2 .ptc-v2__stedOpt:last-child{ border-bottom:0; }
.ptc-v2 .ptc-v2__stedOpt:hover{ background:var(--p2-soft); }
.ptc-v2 .ptc-v2__stedOpt strong{ font-size:14.5px; font-weight:700; }
.ptc-v2 .ptc-v2__stedOpt span{ font-size:12.5px; color:var(--p2-muted); white-space:nowrap; }
.ptc-v2 .ptc-v2__stedValgt{
  list-style:none;
  margin:10px 0 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}
.ptc-v2 .ptc-v2__stedTag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 6px 5px 11px;
  background:var(--p2-sage);
  border:1px solid #d7e2d5;
  border-radius:999px;
  font-size:13.5px;
  font-weight:600;
  color:var(--p2-green-dark);
}
.ptc-v2 .ptc-v2__stedBort{
  width:20px; height:20px;
  display:flex; align-items:center; justify-content:center;
  border:0; border-radius:50%;
  background:rgba(22,53,43,.09);
  color:var(--p2-pine);
  font-size:14px; line-height:1;
  cursor:pointer;
  padding:0;
}
.ptc-v2 .ptc-v2__stedBort:hover{ background:rgba(22,53,43,.18); }

/* ---- Prioritert plassering ---- */
.ptc-v2 .ptc-v2__prio{
  margin-top:12px;
  padding:11px 13px;
  border:1px solid #d7e2d5;
  border-left:3px solid var(--p2-green);
  border-radius:var(--p2-radius);
  background:var(--p2-soft);
}
.ptc-v2 .ptc-v2__prio.is-full{
  border-color:#f0dcc2;
  border-left-color:#c8791f;
  background:#fdf7ef;
}
.ptc-v2 .ptc-v2__prio p{
  margin:0 0 6px;
  font-size:13.5px;
  line-height:1.45;
  color:var(--p2-ink);
}
.ptc-v2 .ptc-v2__prio p:last-child{ margin-bottom:0; }
.ptc-v2 .ptc-v2__prioFull{ color:#7a4a12; }

/* ---- Checkboksen for nettside ----
   Her laa ogsaa `.ptc-v2__trial`, den stiplede groenne boksen for
   proeveperioden. Proeveperioden er borte (8.9.0). */
.ptc-v2 .ptc-v2__website{
  border:1px solid var(--p2-line);
  background:#fafbf9;
  border-radius:5px;
  padding:13px 15px;
}
.ptc-v2 .ptc-v2__check{
  display:flex;
  align-items:flex-start;
  gap:11px;
  cursor:pointer;
  margin:0;
  font-size:14px;
  line-height:1.5;
}
.ptc-v2 .ptc-v2__check input{
  width:19px;
  height:19px;
  margin-top:2px;
  accent-color:#16a34a;
  cursor:pointer;
  flex:0 0 auto;
}
.ptc-v2 .ptc-v2__check strong{ color:var(--p2-pine); }

/* ---- Felter ---- */
.ptc-v2 .ptc-v2__fields{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}
@media (min-width:560px){
  .ptc-v2 .ptc-v2__fields{ grid-template-columns:1fr 1fr; }
}
.ptc-v2 .ptc-v2__field label{
  display:block;
  font-size:13px;
  font-weight:600;
  margin-bottom:5px;
  color:var(--p2-pine);
}
/*
 * Feltene.
 *
 * !important paa bakgrunn, ramme og radius: temaet setter de samme tre
 * egenskapene paa alle `input` med !important, og uten dette fikk hvert
 * felt i bestillingsskjemaet en lysegroenn bakgrunn og en groenn ramme.
 * De saa ut som om de alle var i en feiltilstand, og da betyr den ekte
 * feilmarkeringen (.is-missing) ingenting.
 *
 * Fargene er skrevet som tall der de maa vinne: en var() som ikke lar seg
 * loese gjoer hele erklaeringen ugyldig, og da er vi like langt.
 */
.ptc-v2 .ptc-v2__field input,
.ptc-v2 .ptc-v2__field textarea{
  width:100%;
  border:1.5px solid #dfe5e0 !important;
  /* 8px, ikke 4px: samme hjørne som felt ellers på nettstedet. Formen
     er definert i ruterens bnett-design.css, og denne regelen gjentar
     den her slik at skjemaet ser riktig ut også hvis designlaget skulle
     lastes etter commerce sitt stilark. */
  border-radius:6px !important;
  padding:12px 14px;
  font-size:16px; /* >=16px: hindrer zoom på iOS */
  font-family:inherit;
  color:inherit;
  background:#ffffff !important;
  box-shadow:none !important;
  transition:border-color .12s ease, box-shadow .12s ease;
}
/* Nettleserens egen autofyll-farging naas ikke av `background`. */
.ptc-v2 .ptc-v2__field input:-webkit-autofill,
.ptc-v2 .ptc-v2__field input:-webkit-autofill:hover,
.ptc-v2 .ptc-v2__field input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 60px #ffffff inset !important;
  box-shadow:0 0 0 60px #ffffff inset !important;
  -webkit-text-fill-color:#18392f !important;
}
.ptc-v2 .ptc-v2__field input:focus,
.ptc-v2 .ptc-v2__field textarea:focus{
  outline:none;
  border-color:#3e8e5a !important;
  box-shadow:0 0 0 3px rgba(62,142,90,.15) !important;
}
/* Den ekte feilmarkeringen maa vinne over alt annet. Et felt som er
   markert som manglende, er det eneste som skal ha farge. */
.ptc-v2 .ptc-v2__field input.is-missing,
.ptc-v2 .ptc-v2__field textarea.is-missing{
  border-color:#dc2626 !important;
  box-shadow:0 0 0 3px rgba(220,38,38,.12) !important;
}
.ptc-v2 .ptc-v2__moreToggle,
.ptc-v2 .ptc-v2__discountToggle{
  background:none;
  border:0;
  padding:0;
  margin-top:12px;
  font-size:13.5px;
  color:var(--p2-green-dark);
  cursor:pointer;
  font-family:inherit;
  text-decoration:underline;
  text-underline-offset:3px;
}
.ptc-v2 .ptc-v2__more{
  margin-top:12px;
  display:flex;
  flex-direction:column;
  gap:12px;
}

/* ---- Rabatt ---- */
.ptc-v2 .ptc-v2__discount{
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.ptc-v2 .ptc-v2__discountInput{
  flex:1 1 140px;
  border:1.5px solid var(--p2-line);
  border-radius:8px;
  padding:10px 13px;
  font-size:15px;
  font-family:inherit;
}
.ptc-v2 .ptc-v2__btnGhost{
  border:1.5px solid var(--p2-line);
  background:#fff;
  border-radius:4px;
  padding:10px 16px;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  font-family:inherit;
  color:var(--p2-pine);
}
.ptc-v2 .ptc-v2__discountHint{
  flex-basis:100%;
  font-size:13px;
  color:var(--p2-green-dark);
}

/* ---- CTA ---- */
.ptc-v2 .ptc-v2__ctaWrap{ margin-top:22px; }
.ptc-v2 .ptc-v2__cta{
  width:100%;
  border:0;
  border-radius:4px;
  background:var(--p2-green);
  color:#fff;
  padding:17px 24px;
  cursor:pointer;
  font-family:inherit;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:3px;
  box-shadow:0 14px 30px -12px rgba(47,112,72,.55);
  transition:transform .12s ease, background .12s ease;
}
.ptc-v2 button.ptc-v2__cta:hover,.ptc-v2 button.ptc-v2__cta:focus{ background:var(--p2-green-dark); color:#fff; transform:translateY(-1px); }
.ptc-v2 .ptc-v2__cta:disabled{ opacity:.65; cursor:wait; transform:none; }
/*
 * ============================================================
 * Knappen skal vaere én linje opp og én linje ned
 * ============================================================
 *
 * Paa telefon var den 98 piksler hoey: underteksten broet over to linjer, og
 * paa 320 piksler broet hovedteksten ogsaa, saa knappen ble 123 piksler. To
 * linjer gronn tekst paa gronn bunn ser ikke ut som en knapp – det ser ut som
 * en feil.
 *
 * Tekstene er kortet ned i JS-en (33, 26 og 34 tegn mot 44 og 60 foer). Her
 * holdes de paa linjen:
 *
 *   `white-space: nowrap` fanger den dagen noen skriver en lengre.
 *   `text-overflow` er med vilje IKKE satt – en avkuttet setning med tre
 *   prikker ser ut som en feil i teksten.
 *
 * Foerste forsoek krympet skriften til 11,5px under 400 piksler. Det slo ut
 * en test som alt sto der: «ingen tekst under 12px – mange behandlere er ikke
 * 25». Den har rett, og det var en bedre grense enn min. Med de kortere
 * tekstene er det heller ikke noedvendig: 34 tegn paa 12,5px er 193 piksler,
 * og knappen har 214 innvendig selv paa 320. Bare padding gir seg litt.
 */
.ptc-v2 .ptc-v2__ctaMain{
  font-size:17px;
  font-weight:800;
  letter-spacing:-.01em;
  white-space:nowrap;
}
.ptc-v2 .ptc-v2__ctaSub{
  font-size:12.5px;
  opacity:.9;
  font-weight:500;
  white-space:nowrap;
}
@media (max-width:400px){
  .ptc-v2 .ptc-v2__cta{ padding:15px 14px; }
}
.ptc-v2 .ptc-v2__afterNote{
  margin-top:10px;
  text-align:center;
  font-size:13px;
  color:#166534;
  background:#f0fdf4;
  border-radius:4px;
  padding:9px 12px;
}



/* ============================================================
   Månedlig / årlig
   ============================================================
   Bryteren står OVER pakkekortene fordi den styrer tallene i dem.
   Den gamle lenken sto under knappen, langt fra prisene den endret.
   ============================================================ */
.ptc-v2 .ptc-v2__periode{
  display:flex; align-items:center; flex-wrap:wrap; gap:14px;
  margin:0 0 14px;
}
.ptc-v2 .ptc-v2__bryter{
  display:inline-flex; background:var(--p2-soft,#f5f8f3);
  border:1px solid var(--p2-line,#e6ebe9); border-radius:6px; padding:3px;
}
.ptc-v2 button.ptc-v2__bryterValg{
  display:flex; align-items:center; gap:8px;
  padding:9px 17px; border:0; border-radius:6px; background:none;
  font-family:inherit; font-size:14.5px; font-weight:600; line-height:1.35;
  color:var(--p2-muted,#5a6b62); cursor:pointer;
  transition:background .15s ease, color .15s ease;
}
.ptc-v2 button.ptc-v2__bryterValg.is-on{ background:#133731; color:#fff; }
/*
 * 12px, ikke 10,5.
 *
 * Testen «ingen tekst under 12px – mange behandlere er ikke 25» tok denne,
 * og den har rett: rabattmerket er det eneste stedet prosenten står, og det
 * er nettopp tallet den eldre leseren skal få med seg.
 */
.ptc-v2 .ptc-v2__bryterRabatt{
  background:var(--p2-sage,#e4efdc); color:var(--p2-green-dark,#245044);
  border-radius:100px; font-size:12px; font-weight:700; letter-spacing:.03em;
  padding:3px 8px; white-space:nowrap;
}
.ptc-v2 button.ptc-v2__bryterValg.is-on .ptc-v2__bryterRabatt{
  background:rgba(255,255,255,.2); color:#fff;
}
.ptc-v2 .ptc-v2__periodeNote{ color:var(--p2-muted,#5a6b62); font-size:13.5px; }

/* Årsbeløpet og besparelsen i kortet. */
.ptc-v2 .ptc-v2__planAar{
  margin-top:2px; color:var(--p2-muted,#5a6b62); font-size:12.5px; line-height:1.4;text-align:center;
}
.ptc-v2 .ptc-v2__planSpart{
  display:inline-flex; align-items:center; justify-self:center; margin-top:4px;
  background:var(--p2-soft,#f2f7ee); border:1px solid var(--p2-sage,#e4efdc);
  color:var(--p2-green-dark,#245044); border-radius:6px;
  padding:4px 9px; font-size:12px; font-weight:600;
}
/*
 * Tomme, men ikke borte.
 *
 * Elementene maa bli staaende som rutenettbarn for at subgridet skal holde
 * loeftene paa linje – `display:none` ville tatt raden med seg. Men et tomt
 * merke med bakgrunn og ramme er en grå boks midt i Basis-kortet, og den
 * sier ingenting. `:empty` tar bort pynten og lar plassen staa.
 */
.ptc-v2 .ptc-v2__planAar:empty{ margin-top:0; }
.ptc-v2 .ptc-v2__planSpart:empty{
  margin-top:0; padding:0; background:none; border:0;
}

/*
 * ============================================================
 * Løftet: «Kom med i oversikten» · «Bli funnet» · «Bli sett først»
 * ============================================================
 *
 * De tre skal stå på SAMME LINJE i de tre kortene. Det gjør de ikke av seg
 * selv: over dem står pris, årsbeløp og en besparelse som Basis ikke har,
 * og punktlisten under er ulikt høy fordi én av linjene brekker.
 *
 * Første forsøk var `margin-top:auto` i en flex-kolonne. Det bunnjusterer
 * løftet, og siden listene under er ulikt høye, kom de tre i utakt igjen.
 * Testen målte 491, 491 og 760.
 *
 * `subgrid` løser det på den ene riktige måten: de tre kortene deler rader
 * med rutenettet de står i, så rad for rad er de like høye – pris mot pris,
 * løfte mot løfte. Hvert kort må da ha nøyaktig like mange barn, og det er
 * grunnen til at årslinjen og besparelsen står igjen som TOMME elementer
 * i stedet for å skjules.
 *
 * Reserven under (flex med `margin-top:auto`) er for nettlesere uten
 * subgrid. Der blir linjen omtrent riktig i stedet for nøyaktig riktig,
 * og det er godt nok.
 */
.ptc-v2 .ptc-v2__plan{ display:flex; flex-direction:column; }

@supports (grid-template-rows: subgrid){
  .ptc-v2 .ptc-v2__plans--tre{ display:grid; grid-auto-rows:min-content; }
  .ptc-v2 .ptc-v2__plans--tre > .ptc-v2__plan{
    display:grid;
    grid-row:span 6;              /* head · pris · årslinje · spart · løfte · punkter */
    grid-template-rows:subgrid;
    align-content:start;
    row-gap:0;
  }
}

.ptc-v2 .ptc-v2__planLovord{
  margin-top:auto; padding:9px 0 9px;
  border-bottom:1px solid var(--p2-line,#e6ebe9);
  color:var(--p2-green-dark,#245044);
  font-size:14px; font-weight:700; line-height:1.3;
}
.ptc-v2 .ptc-v2__planList{ margin-top:11px; }

/* ============================================================
   Steder: hovedoversikten er med uansett
   ============================================================ */
.ptc-v2 .ptc-v2__alltid{
  display:flex; align-items:flex-start; gap:11px;
  background:#f4faf1; border:1px solid var(--p2-mint,#c9e0bd);
  border-radius:6px; padding:13px 15px;
  font-size:14.5px; line-height:1.5;
}
.ptc-v2 .ptc-v2__alltid svg{ color:var(--p2-green,#3e8e5a); flex:none; margin-top:1px; }
.ptc-v2 .ptc-v2__alltid strong{ color:#133731; }
.ptc-v2 .ptc-v2__stedInnl{
  margin:14px 0 12px; color:var(--p2-muted,#5a6b62); font-size:14px; line-height:1.55;
}
.ptc-v2 .ptc-v2__hopp{
  display:flex; align-items:center; flex-wrap:wrap; gap:12px;
  margin-top:14px; padding-top:14px; border-top:1px solid var(--p2-line,#e6ebe9);
}
.ptc-v2 .ptc-v2__hopp[hidden]{ display:none; }
.ptc-v2 .ptc-v2__hoppNote{
  color:var(--p2-muted,#5a6b62); font-size:13.5px; line-height:1.45; flex:1 1 240px;
}

.ptc-v2 .ptc-v2__fineprint{
  margin-top:10px;
  text-align:center;
  font-size:12.5px;
  color:var(--p2-muted);
}
.ptc-v2 .ptc-v2__status{
  margin-top:10px;
  text-align:center;
  font-size:14px;
  min-height:1.4em;
  color:var(--p2-pine);
}
.ptc-v2 .ptc-v2__status.is-error{ color:#b91c1c; font-weight:600; }

/* Nettside-salgsboksen (.ptc-web) er fjernet i v7.1 sammen med det gamle
   790 kr/mnd-tilbudet. Raske Nettsider har sin egen fil, ptc-raske.css. */


/* ============================================================
   Kvittering (bygget om i v7.0)

   Den gamle var en ramme rundt tre lister. Kunden fikk ingen bekreftelse
   paa at e-posten var sendt, og ventetilstanden sa «et lite oeyeblikk»
   uten aa noen gang gaa videre. Her har hver tilstand en ferdig form.
   ============================================================ */
.ptc-receipt{max-width:760px;margin:0 auto;font-family:var(--bnett-font-body, "Inter", -apple-system, system-ui, sans-serif);color:#18392f}
.ptc-receipt .ptc-receipt__card{background:#fff;border:1px solid rgba(15,23,42,.10);border-radius:10px;box-shadow:0 16px 50px rgba(15,23,42,.06);padding:30px 28px}

/* --- topp --- */
.ptc-receipt .ptc-receipt__top{text-align:center;margin:0 0 20px}
.ptc-receipt .ptc-receipt__merke{width:58px;height:58px;margin:0 auto 14px;display:grid;place-items:center;border-radius:50%;background:#eaf4ec;color:#245044}
.ptc-receipt .ptc-receipt__title{margin:0 0 8px;font-size:27px;line-height:1.18;font-weight:700;letter-spacing:-.4px}
.ptc-receipt .ptc-receipt__ingress{margin:0 auto 12px;max-width:44ch;font-size:15.5px;line-height:1.55;color:#5a6b62}
.ptc-receipt .ptc-receipt__meta{display:inline-block;padding:5px 13px;border-radius:999px;background:#f2f7ee;font-size:13px;color:#5a6b62}
.ptc-receipt .ptc-receipt__meta strong{color:#18392f}

/* Spinneren gaar bare mens vi faktisk venter. */
.ptc-receipt .ptc-receipt__spinner{width:22px;height:22px;border-radius:50%;border:2.5px solid #cfe3d5;border-top-color:#245044;animation:ptcSnurr .9s linear infinite}
@keyframes ptcSnurr{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.ptc-receipt .ptc-receipt__spinner{animation-duration:3s}}
.ptc-receipt--treg .ptc-receipt__merke{display:none}

/* --- «sendt til …» --- */
.ptc-receipt .ptc-receipt__epost{display:flex;flex-direction:column;gap:3px;margin:0 0 18px;padding:13px 16px;border-radius:8px;background:#f2f7ee;border:1px solid #dfeadd;font-size:13.5px;line-height:1.5}
.ptc-receipt .ptc-receipt__epost strong{color:#18392f;font-size:14.5px}
.ptc-receipt .ptc-receipt__epost span{color:#5a6b62}
.ptc-receipt .ptc-receipt__epost a{color:#245044;text-decoration:underline}

/* --- to bokser --- */
.ptc-receipt .ptc-receipt__grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ptc-receipt .ptc-receipt__box{background:#fbfdfa;border:1px solid #e2e8e2;border-radius:9px;padding:17px 18px}
.ptc-receipt .ptc-receipt__box h3{margin:0 0 12px;font-size:14px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:#5a6b62}
.ptc-receipt .ptc-receipt__list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:9px}
.ptc-receipt .ptc-receipt__list li{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-size:14.5px}
.ptc-receipt .ptc-receipt__list li span{color:#5a6b62;flex:none}
.ptc-receipt .ptc-receipt__list li strong{text-align:right;font-weight:600}
.ptc-receipt .ptc-receipt__total{border-top:1px solid #e2e8e2;padding-top:11px;margin-top:3px}
.ptc-receipt .ptc-receipt__total strong{font-size:18px}
.ptc-receipt .ptc-receipt__note{margin-top:13px;padding-top:12px;border-top:1px solid #e9efe9;font-size:12.5px;line-height:1.55;color:#5a6b62}

/* --- hva skjer naa --- */
.ptc-receipt .ptc-receipt__next{margin-top:22px}
.ptc-receipt .ptc-receipt__next h3{margin:0 0 12px;font-size:16.5px;font-weight:700}
.ptc-receipt .ptc-receipt__steps{list-style:none;counter-reset:ptc;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.ptc-receipt .ptc-receipt__steps li{counter-increment:ptc;position:relative;padding-left:38px;font-size:14.5px;line-height:1.55;color:#5a6b62}
.ptc-receipt .ptc-receipt__steps li::before{content:counter(ptc);position:absolute;left:0;top:-1px;width:26px;height:26px;display:grid;place-items:center;border-radius:50%;background:#eaf4ec;color:#245044;font-size:13px;font-weight:700}
.ptc-receipt .ptc-receipt__steps li strong{display:block;color:#18392f;font-weight:600;margin-bottom:2px}

.ptc-receipt .ptc-receipt__send{margin-top:20px;text-align:center}
.ptc-receipt .ptc-receipt__cta{display:inline-block;padding:14px 28px;border-radius:999px;background:#245044;color:#fff;font-size:15px;font-weight:600;text-decoration:none;transition:background .15s ease}
.ptc-receipt .ptc-receipt__cta:hover{background:#245044;color:#fff}
.ptc-receipt .ptc-receipt__sendSub{display:block;margin-top:9px;font-size:12.5px;color:#5a6b62}

/* --- bunn --- */
.ptc-receipt .ptc-receipt__bunn{margin-top:22px;padding-top:16px;border-top:1px solid #e9efe9;text-align:center;font-size:13.5px}
.ptc-receipt .ptc-receipt__lenke{color:#245044;text-decoration:none}
.ptc-receipt .ptc-receipt__lenke:hover{text-decoration:underline}
.ptc-receipt .ptc-receipt__skille{margin:0 9px;color:#b9c6bd}

.ptc-receipt--tom .ptc-receipt__card{text-align:center}

@media (max-width:640px){
  .ptc-receipt .ptc-receipt__card{padding:24px 18px;border-radius:9px}
  .ptc-receipt .ptc-receipt__grid{grid-template-columns:1fr}
  .ptc-receipt .ptc-receipt__title{font-size:23px}
  .ptc-receipt .ptc-receipt__cta{display:block}
}

/* ============================================================
   Kampanjerabatten (v6.2) laa her
   ------------------------------------------------------------
   Baandet over skjemaet med prosent, tekst og nedtelling, pluss den
   overstrekede «foer»-prisen paa pakkekortene. Kampanjen er fjernet i
   8.9.0 – naa er det rabattkoder og ingenting annet.

   `.ptc-v2__planWas` staar igjen: elementet finnes fortsatt i markupen,
   alltid skjult, og en skjult boks skal ikke miste stilen sin hvis den
   tas i bruk igjen.
   ============================================================ */
.ptc-v2 .ptc-v2__planWas{
  margin-right:7px; color:#6a7a72; font-weight:500;
  text-decoration:line-through; text-decoration-thickness:1px;
}

/* ---- «Er dette deg?» ----
   Kom brukeren hit fra en oppfoering som alt finnes, skal skjemaet si hva
   det tror det vet. Ellers ser det bare ut til aa ha gjettet et navn.
   Fargene staar som tall i hver tilstand. */
.ptc-v2 .ptc-v2__overta{
  margin:0 0 18px;
  padding:14px 16px;
  border:1px solid #cddbd1;
  border-left:3px solid #245044;
  border-radius:var(--p2-radius);
  background:#f1f7f2;
}
.ptc-v2 .ptc-v2__overtaTekst{
  margin:0;
  color:#18392f;
  font-size:15px;
  line-height:1.5;
}
.ptc-v2 .ptc-v2__overtaTekst strong{ color:#18392f; font-weight:700; }
.ptc-v2 .ptc-v2__overtaNote{
  margin:8px 0 0;
  color:#5c6c62;
  font-size:13.5px;
  line-height:1.5;
}
.ptc-v2 .ptc-v2__overtaNote a{
  display:inline-block;
  padding:3px 0;
  color:#245044;
  font-weight:600;
  text-decoration:underline;
}
.ptc-v2 .ptc-v2__overtaNote a:hover,
.ptc-v2 .ptc-v2__overtaNote a:focus{ color:#18392f; }

/* ---- Sammenligningen under pakkekortene ----
   Kortene har tre korte linjer. Hele listen staar her, én gang, og
   aapnes uten JavaScript. Fargene staar som tall i hver tilstand. */
.ptc-v2 .ptc-v2__sammenlign{
  margin:12px 0 0;
  border:1px solid var(--p2-line);
  border-radius:var(--p2-radius);
  background:#fff;
}
.ptc-v2 .ptc-v2__sammenlign summary{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  min-height:46px;
  padding:11px 14px;
  color:#18392f;
  font-size:14.5px; font-weight:600;
  cursor:pointer;
  list-style:none;
}
.ptc-v2 .ptc-v2__sammenlign summary::-webkit-details-marker{ display:none; }
/* Pluss som blir minus, tegnet i CSS. Et tegn arver fonten og faller
   bort i en reserve som ikke har det. */
.ptc-v2 .ptc-v2__sammenlign summary::after{
  content:"";
  flex:none;
  width:12px; height:12px;
  background:
    linear-gradient(#5a6b62, #5a6b62) center/12px 2px no-repeat,
    linear-gradient(#5a6b62, #5a6b62) center/2px 12px no-repeat;
}
.ptc-v2 .ptc-v2__sammenlign[open] summary::after{
  background:linear-gradient(#5a6b62, #5a6b62) center/12px 2px no-repeat;
}
.ptc-v2 .ptc-v2__sammenlign summary:focus-visible{
  outline:2px solid var(--p2-green); outline-offset:-2px; border-radius:var(--p2-radius);
}
.ptc-v2 .ptc-v2__sammenlignInn{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
  padding:4px 14px 16px;
  border-top:1px solid var(--p2-line);
}
.ptc-v2 .ptc-v2__sammenlignKol h3{
  margin:12px 0 8px;
  font-size:14px; font-weight:700;
  color:#18392f;
}
.ptc-v2 .ptc-v2__punktKort{display:none}

/* =============================================================
   Enhet og antall profiler (v8.13.0)
   ============================================================= */

/* De to boksene i steg 0. Samme form som pakkekortene, men lavere –
   dette er et valg man tar paa to sekunder, ikke et man veier. */
.ptc-v2 .ptc-v2__enheter{
  display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:10px;
}
@media (max-width:620px){ .ptc-v2 .ptc-v2__enheter{ grid-template-columns:1fr; } }

.ptc-v2 .ptc-v2__enhet{
  display:grid;grid-template-columns:34px minmax(0,1fr) 20px;
  grid-template-rows:auto auto;column-gap:11px;row-gap:2px;
  align-items:center;width:100%;min-height:82px;text-align:left;cursor:pointer;
  background:#fff;border:1px solid var(--p2-line);border-radius:var(--p2-radius);
  padding:13px 15px;font:inherit;color:inherit;
}
.ptc-v2 .ptc-v2__enhet:hover{ border-color:#b9c9c2; }
.ptc-v2 .ptc-v2__enhet.is-valgt{ border-color:#245044; box-shadow:0 0 0 1px #245044;background:#f4f9f5; }
.ptc-v2 .ptc-v2__enhetIkon{ grid-column:1;grid-row:1/3;color:#133731;display:block;margin:0; }
.ptc-v2 .ptc-v2__enhet strong{
  grid-column:2;grid-row:1;display:block;font-size:16px;font-weight:700;color:#133731;margin:0;
}
.ptc-v2 .ptc-v2__enhet span{ grid-column:2;grid-row:2;display:block;font-size:13px;line-height:1.35;color:#5c6b67; }
.ptc-v2 .ptc-v2__enhet::after{content:"";display:grid;place-items:center;grid-column:3;grid-row:1/3;width:20px;height:20px;border:1.5px solid #c3cfc9;border-radius:50%;color:#fff;font-size:13px;font-weight:700}
.ptc-v2 .ptc-v2__enhet.is-valgt::after{content:"\2713";background:#245044;border-color:#245044}

.ptc-v2 .ptc-v2__enhetHint{ margin:10px 0 0; font-size:13.5px; color:#5c6b67; }

/* ------------------------------------------------------------
   Antallsvelgeren
   ------------------------------------------------------------ */
.ptc-v2 .ptc-v2__antallIngress{ margin:4px 0 14px; font-size:14.5px; color:#5c6b67; }

.ptc-v2 .ptc-v2__antallRad{ display:flex; align-items:center; gap:12px; margin-bottom:16px; }

.ptc-v2 .ptc-v2__teller{ display:flex; align-items:center; gap:8px; }
.ptc-v2 .ptc-v2__teller button{
  width:42px; height:42px; cursor:pointer;
  border:1px solid #d6dedb; background:#fff; border-radius:8px;
  font-size:20px; line-height:1; color:#133731;
}
.ptc-v2 .ptc-v2__teller button:hover{ border-color:#245044; color:#245044; }
/* 42px er ikke pynt: det er trygg trykkflate paa telefon, og disse to
   knappene er det eneste man trykker paa i dette steget. */
.ptc-v2 .ptc-v2__teller input{
  width:86px; height:42px; text-align:center;
  font-size:18px; font-weight:700; color:#133731;
  border:1px solid #d6dedb; border-radius:8px;
  font-variant-numeric:tabular-nums; font-family:inherit;
}
/* Pilene i number-feltet er for smaa til aa treffe, og vi har egne. */
.ptc-v2 .ptc-v2__teller input::-webkit-outer-spin-button, 
.ptc-v2 .ptc-v2__teller input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.ptc-v2 .ptc-v2__teller input[type=number]{ -moz-appearance:textfield; }

.ptc-v2 .ptc-v2__tellerTekst{ font-size:15px; color:#5c6b67; }

/* ------------------------------------------------------------
   Trinntabellen

   Staar synlig, ikke bak en lenke. Rabatten er hele salgsargumentet
   overfor en kjede, og et salgsargument man maa klikke for aa se,
   virker ikke.
   ------------------------------------------------------------ */
.ptc-v2 .ptc-v2__mengdesum{
  display:block; margin:-6px 0 14px; font-size:15px; font-weight:650;
  color:#133731; font-variant-numeric:tabular-nums;
}
.ptc-v2 .ptc-v2__trinn{
  width:100%; max-width:460px; border-collapse:collapse;
  font-size:14.5px; margin-bottom:16px;
  background:#fff; border:1px solid #e6ebe9; border-radius:10px; overflow:hidden;
}
.ptc-v2 .ptc-v2__trinn th, .ptc-v2 .ptc-v2__trinn td{
  padding:9px 13px; text-align:left; border-bottom:1px solid #e6ebe9;
}
.ptc-v2 .ptc-v2__trinn thead th{
  font-size:12px; text-transform:uppercase; letter-spacing:.04em;
  color:#5c6b67; background:#f7faf8; border-bottom:1px solid #d6dedb; font-weight:650;
}
.ptc-v2 .ptc-v2__trinn tbody tr:last-child td{ border-bottom:0; }
.ptc-v2 .ptc-v2__trinn td:last-child, .ptc-v2 .ptc-v2__trinn th:last-child{
  text-align:right; font-variant-numeric:tabular-nums;
}
.ptc-v2 .ptc-v2__trinn tr.er-her td{ background:#f0f6f2; font-weight:650; color:#133731; }

/* ------------------------------------------------------------
   Fagomraade som kort
   ------------------------------------------------------------

   Nedtrekkslisten var ett klikk for aa se hva som FANTES. Seks kort
   svarer paa det med en gang; resten staar bak «Vis alle fagomraader».

   Alle regler er dobbeltskopet (.ptc-v2 foran). Temaets Elementor Kit
   lastes etter oss og setter flate, ramme og luft paa `button` med
   spesifisitet (0,1,1) – se css-skop-test. */
.ptc-v2 .ptc-v2__catKort{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:10px;
}
@media (max-width:520px){
  .ptc-v2 .ptc-v2__catKort{ grid-template-columns:1fr; }
}

.ptc-v2 .ptc-v2__catKortValg{
  display:flex;
  align-items:center;
  gap:11px;
  width:100%;
  min-height:56px;
  padding:12px 15px;
  text-align:left;
  background:#fff;
  border:1px solid var(--p2-line, #d6dedb);
  border-radius:var(--p2-radius, 10px);
  font:inherit;
  color:inherit;
  cursor:pointer;
}
.ptc-v2 .ptc-v2__catKortValg:hover{ border-color:#b9c9c2; }
.ptc-v2 .ptc-v2__catKortValg.is-valgt{
  border-color:#245044;
  box-shadow:0 0 0 1px #245044;
  background:#f4f9f5;
}

/* Ringen er en ekte radioknapp aa se paa, uten aa vaere en input: valget
   ligger i knappen, og to kontroller for det samme er to ting som kan
   komme i utakt. */
.ptc-v2 .ptc-v2__catKortRing{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  width:20px; height:20px;
  border:1.5px solid #c3cfc9;
  border-radius:50%;
  color:#fff;
}
.ptc-v2 .ptc-v2__catKortValg.is-valgt .ptc-v2__catKortRing{
  background:#245044; border-color:#245044;
}
.ptc-v2 .ptc-v2__catKortNavn{
  display:block; min-width:0;
  font-size:16px; font-weight:650; color:#133731;
  overflow:hidden; text-overflow:ellipsis;
}

.ptc-v2 button.ptc-v2__catMer{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-top:12px;
  padding:0;
  min-height:44px;
  background:none;
  border:0;
  color:#245044;
  font:inherit;
  font-size:15.5px;
  font-weight:650;
  text-decoration:none;
  cursor:pointer;
}
.ptc-v2 button.ptc-v2__catMer [data-cat-mer-tekst]{text-decoration:underline;text-underline-offset:3px}
.ptc-v2 .ptc-v2__catMerPil{ transition:transform .15s ease; }
.ptc-v2 button.ptc-v2__catMer.er-apen .ptc-v2__catMerPil{ transform:rotate(180deg); }

.ptc-v2 .ptc-v2__catValgt{
  display:flex; align-items:baseline; gap:8px;
  margin-top:10px; font-size:15px;
}
.ptc-v2 .ptc-v2__catValgtEtikett{ color:#5c6b67; }
.ptc-v2 .ptc-v2__catValgt strong{ color:#133731; }

/* Korte og sammenligningskolonner bruker samme tre-spalters rutenett. */
.ptc-v2 .ptc-v2__plans--tre{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.ptc-v2 .ptc-v2__plans--tre > .ptc-v2__plan{min-width:0;width:100%}
.ptc-v2 .ptc-v2__sammenlignInn{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:8px 0 0}
.ptc-v2 .ptc-v2__sammenlignKol{min-width:0;padding:10px 12px 14px;border-right:1px solid var(--p2-line)}
.ptc-v2 .ptc-v2__sammenlignKol:last-child{border-right:0}
.ptc-v2 .ptc-v2__sammenlignKol h3{margin:0 0 10px}
.ptc-v2 .ptc-v2__sammenlignKol .ptc-v2__planList{margin-top:0}
.ptc-v2 .ptc-v2__stedEtter{margin:12px 0 0;color:#5a6b62;font-size:13px}
.ptc-v2 .ptc-v2__minsideNote{margin:18px 0 0;padding:14px 16px;border:1px solid #d6e5d4;border-radius:6px;background:#f3f8f0;color:#345449;font-size:14px;line-height:1.55}
.ptc-v2 .ptc-v2__minsideNote strong{color:#18392f}
@media(min-width:761px){
  .ptc-v2 .ptc-v2__planPrice{padding-block:15px 13px}
}
@media(max-width:760px){
  .ptc-v2 .ptc-v2__card{padding:20px 10px}
  .ptc-v2 .ptc-v2__plans--tre{gap:6px}
  .ptc-v2 .ptc-v2__plans--tre > .ptc-v2__plan{min-height:108px;padding:13px 5px 12px;align-items:center;text-align:center}
  .ptc-v2 .ptc-v2__planHead{justify-content:center;padding:0;margin:5px 0 10px}
  .ptc-v2 .ptc-v2__planName{font-size:11px;letter-spacing:0}
  .ptc-v2 .ptc-v2__planBadge,.ptc-v2 .ptc-v2__planLovord,
  .ptc-v2 .ptc-v2__plans--tre > .ptc-v2__plan .ptc-v2__planList{display:none}
  .ptc-v2 .ptc-v2__planPrice{font-size:20px;white-space:nowrap}
  .ptc-v2 .ptc-v2__per{display:block;font-size:11px}
  .ptc-v2 .ptc-v2__planAar,.ptc-v2 .ptc-v2__planSpart{font-size:10px;line-height:1.2}
  .ptc-v2 .ptc-v2__plan.is-selected::after{top:7px;left:7px;right:auto;width:18px;height:18px;font-size:11px}
  .ptc-v2 .ptc-v2__sammenlignInn{gap:6px}
  .ptc-v2 .ptc-v2__sammenlignKol{padding:9px 5px 12px}
  .ptc-v2 .ptc-v2__sammenlignKol h3{font-size:11px;letter-spacing:0;text-transform:uppercase}
  .ptc-v2 .ptc-v2__sammenlignKol .ptc-v2__planList{gap:7px}
  .ptc-v2 .ptc-v2__sammenlignKol .ptc-v2__planList li{padding-left:13px;font-size:11.5px;line-height:1.3;overflow-wrap:anywhere}
  .ptc-v2 .ptc-v2__sammenlignKol .ptc-v2__planList li::before{font-size:11px}
  .ptc-v2 .ptc-v2__punktFull{display:none}
  .ptc-v2 .ptc-v2__punktKort{display:inline}
  @supports (grid-template-rows:subgrid){
    .ptc-v2 .ptc-v2__plans--tre > .ptc-v2__plan{display:flex;grid-row:auto;grid-template-rows:none}
  }
}