/* FAKTIVE kravkortene 2026 (viden/krav/index.html og de 28 kort).
   Bygges af .arbejde/undersider/byg-krav.py; bygger oven på assets/regelsaet-2026.css (farver, skrift, toppen,
   faktabåndet, overlinjer) og hører sammen med assets/krav-2026.js.

   Kortene er opslagssider, så de er rolige og uden fotos. Fladerne skifter som på regelsætssiderne:
     toppen (creme) med navnet, linjen og kontrolpanelet · indholdet (lys) · spørgsmål (creme) · kontakt (aubergine)
   Alt står på hårlinjer; ingen kort-i-kort. Det eneste panel er kontrolpanelet, fordi det viser et stykke af
   produktet. Prikkerne er de samme som på Viden-siden: fyldt kobber = måles automatisk, tynd ring = dokumenteres. */

/* ---------- toppen ---------- */
.kc-top .rg-top-tekst > p{max-width:640px}
.kc-top .rg-sti{color:var(--rg-daemp) !important}
.kc-top .rg-sti a:hover{color:var(--rg-aub)}
section.hero.kc-top h1{white-space:normal;font-size:clamp(46px,6vw,96px) !important;line-height:1 !important;hyphens:auto;-webkit-hyphens:auto}
section.hero.kc-top-kort h1{font-size:clamp(40px,4.8vw,76px) !important}
.kc-id{margin:0 0 16px;font-family:var(--font-text);font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--rg-kobber-tekst)}
.kc-top-in{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:clamp(40px,6vw,96px);align-items:end}
.kc-top-in .rg-top-tekst > p{max-width:34em}
.rg-js .kc-id{opacity:0;transform:translateY(16px);transition:opacity .9s ease .1s,transform 1.1s var(--rg-ud) .1s}
.rg-klar .kc-id{opacity:1;transform:none}

/* ---------- kontrolpanelet: ét roligt panel, et stykke af produktet ---------- */
.kc-panel{position:relative;margin:0 0 6px;padding:24px 26px 20px;border-radius:18px;background:var(--rg-lys);
  border:1px solid rgba(60,42,68,.08);box-shadow:0 30px 60px -42px rgba(42,27,48,.45)}
.kc-panel p{margin:0}
.kc-panel-lab{font-family:var(--font-text);font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--rg-daemp)}
.kc-panel-tal{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-top:18px !important}
.kc-tal{font-family:var(--font-display);font-stretch:125%;font-weight:400;font-size:clamp(40px,3.6vw,54px);line-height:1;letter-spacing:-.02em;
  color:var(--rg-aub);font-variant-numeric:proportional-nums}
.kc-tal-lab{font-size:14.5px;line-height:1.35;color:var(--rg-tekst)}
.kc-maaler{position:relative;display:block;height:4px;margin:18px 0;border-radius:4px;background:rgba(60,42,68,.1);overflow:hidden}
.kc-maaler i{position:absolute;inset:0;border-radius:4px;background:var(--rg-kobber);transform-origin:left center;transform:scaleX(var(--andel,1))}
.kc-punkter{list-style:none;margin:0;padding:0}
.kc-punkter li{position:relative;padding:7px 0 7px 20px;font-size:14.5px;line-height:1.4;color:var(--rg-blaek)}
.kc-punkter li::before{content:"";position:absolute;left:1px;top:calc(7px + .7em - 3.5px);width:7px;height:7px;border-radius:50%;background:var(--rg-kobber)}
.kc-punkter li.kc-afventer{color:var(--rg-daemp)}
.kc-punkter li.kc-afventer::before{background:none;box-shadow:inset 0 0 0 1px rgba(60,42,68,.4)}
.kc-panel-fod{margin-top:14px !important;padding-top:14px;border-top:1px solid var(--rg-streg);font-family:var(--font-text);font-weight:600;font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--rg-kobber-tekst)}
/* panelet kommer frem med toppen; måleren fyldes, og punkterne står frem ét ad gangen */
.rg-js .kc-panel{opacity:0;transform:translateY(18px);transition:opacity .9s ease .35s,transform 1.1s var(--rg-ud) .35s}
.rg-klar .kc-panel{opacity:1;transform:none}
.rg-js .kc-maaler i{transform:scaleX(0);transition:transform 1.4s var(--rg-ud) .9s}
.rg-klar .kc-maaler i{transform:scaleX(var(--andel,1))}
.rg-js .kc-punkter li{opacity:0;transform:translateY(6px);transition:opacity .6s ease,transform .7s var(--rg-ud)}
.rg-klar .kc-punkter li{opacity:1;transform:none}
.rg-klar .kc-punkter li:nth-child(1){transition-delay:1.1s}
.rg-klar .kc-punkter li:nth-child(2){transition-delay:1.22s}
.rg-klar .kc-punkter li:nth-child(3){transition-delay:1.34s}
.rg-klar .kc-punkter li:nth-child(4){transition-delay:1.46s}

/* ---------- faktabåndet: kontrollens plads i de fire regelsæt ---------- */
.kc-fakta{grid-template-columns:repeat(4,minmax(0,1fr))}
.kc-fakta-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.kc-fakta dd a{color:var(--rg-aub);text-decoration:none;background:linear-gradient(rgba(60,42,68,.3),rgba(60,42,68,.3)) 0 100%/100% 1px no-repeat}
.kc-fakta dd a:hover{background-image:linear-gradient(var(--rg-kobber),var(--rg-kobber))}
.kc-fakta dd em{font-style:normal}
.kc-fakta-5 dd{font-size:clamp(15px,1.15vw,17px) !important}
.rg-klar .kc-fakta > div:nth-child(4){transition-delay:.69s}
.rg-klar .kc-fakta > div:nth-child(5){transition-delay:.77s}

/* ---------- indholdet: kort fortalt og de tre afsnit ---------- */
.kc-indhold,.kc-register{background:var(--rg-lys)}
.kc-indhold{padding-top:clamp(56px,6vw,88px)}
.kc-kort-svar{max-width:840px;margin-bottom:clamp(48px,6vw,72px)}
.kc-svar{margin:0;font-size:clamp(20px,1.6vw,23px);line-height:1.55;font-weight:300;color:var(--rg-aub);text-wrap:pretty}
.kc-afsnit{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:12px clamp(32px,5vw,80px);padding:clamp(28px,3vw,40px) 0;
  border-top:1px solid var(--rg-streg)}
.kc-afsnit-hoved h2{margin:0;font-family:var(--font-display);font-stretch:125%;font-weight:400;font-size:clamp(24px,2.2vw,30px);line-height:1.12;
  letter-spacing:-.01em;color:var(--rg-aub)}
.kc-afsnit-hoved .rg-ref{margin-bottom:10px}
.kc-afsnit-tekst{margin:0;max-width:680px;font-size:18px;line-height:1.7;font-weight:300;color:var(--rg-tekst);text-wrap:pretty}

/* ---------- lister af kravkort: én række pr. kort på en hårlinje ---------- */
.kc-liste{list-style:none;margin:0;padding:0}
.kc-liste li{border-top:1px solid var(--rg-streg)}
.kc-liste li:last-child{border-bottom:1px solid var(--rg-streg)}
.kc-raekke{display:grid;grid-template-columns:78px minmax(0,.85fr) minmax(0,1.3fr) 20px;gap:6px clamp(20px,2.5vw,36px);align-items:baseline;
  padding:17px 0 18px;color:inherit;text-decoration:none}
.kc-raekke::after{content:"→";color:var(--rg-kobber);opacity:0;transform:translateX(-6px);transition:opacity .25s ease,transform .35s var(--rg-ud)}
.kc-raekke:hover::after,.kc-raekke:focus-visible::after{opacity:1;transform:none}
.kc-raekke:focus-visible{outline:2px solid var(--rg-kobber);outline-offset:4px;border-radius:4px}
.kc-nr{font-family:var(--font-display);font-stretch:125%;font-weight:500;font-size:14px;letter-spacing:.02em;color:var(--rg-daemp);font-variant-numeric:proportional-nums}
.kc-navn{display:flex;align-items:baseline;gap:10px;min-width:0}
.kc-navn b{min-width:0;hyphens:auto;-webkit-hyphens:auto;overflow-wrap:anywhere;font-weight:600;font-size:17px;line-height:1.35;color:var(--rg-aub);background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;
  transition:background-size .45s var(--rg-ud)}
.kc-raekke:hover .kc-navn b{background-size:100% 1px}
.kc-linje{font-size:15.5px;line-height:1.5;font-weight:300;color:var(--rg-tekst)}
.kc-prik{flex:none;display:inline-block;width:8px;height:8px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(60,42,68,.45);transform:translateY(-1px)}
.kc-prik-maalt{background:var(--rg-kobber);box-shadow:none}
.kc-noegle{display:flex;gap:24px;margin:0;font-size:13.5px;color:var(--rg-daemp)}
.kc-noegle span{display:inline-flex;align-items:center;gap:8px}

/* grupperne: navnet til venstre, kortene til højre */
.kc-gruppe{display:grid;grid-template-columns:minmax(0,280px) minmax(0,1fr);gap:16px clamp(32px,5vw,80px);padding:clamp(36px,4vw,52px) 0 0}
.kc-gruppe-hoved h2{margin:0;font-family:var(--font-display);font-stretch:125%;font-weight:400;font-size:clamp(24px,2.2vw,30px);line-height:1.12;
  letter-spacing:-.01em;color:var(--rg-aub)}
.kc-gruppe-hoved p{margin:8px 0 0;font-size:14px;color:var(--rg-daemp)}
.kc-gruppe-hoved .rg-ref{margin:0 0 10px}
.kc-register-hoved{display:flex;justify-content:flex-end;margin-bottom:-8px}
.kc-gruppe-kort{margin-top:clamp(40px,5vw,64px);padding-top:clamp(32px,3.5vw,44px);border-top:1px solid var(--rg-aub)}
.kc-gruppe-kort .kc-raekke{grid-template-columns:78px minmax(0,.9fr) minmax(0,1.25fr) 20px}
.kc-gruppe-kort .rg-mere{grid-column:2;margin-top:24px;justify-self:start}

/* grupper og rækker kommer frem, når de når skærmen (krav-2026.js sætter .is-inde); de målte prikker tænder */
.rg-js .kc-rv{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform 1s var(--rg-ud)}
.rg-js .kc-rv.is-inde{opacity:1;transform:none}
.rg-js .kc-rv .kc-prik-maalt{transform:translateY(-1px) scale(0);transition:transform .5s var(--rg-ud)}
.rg-js .kc-rv.is-inde .kc-prik-maalt{transform:translateY(-1px) scale(1)}
.rg-js .kc-rv.is-inde li:nth-child(1) .kc-prik-maalt{transition-delay:.35s}
.rg-js .kc-rv.is-inde li:nth-child(2) .kc-prik-maalt{transition-delay:.49s}
.rg-js .kc-rv.is-inde li:nth-child(3) .kc-prik-maalt{transition-delay:.63s}
.rg-js .kc-rv.is-inde li:nth-child(4) .kc-prik-maalt{transition-delay:.77s}

/* ---------- spørgsmål og svar (forsidens sektion 10, uden foto) ---------- */
#faq.kc-faq{background:var(--rg-creme)}
#faq.kc-faq .s10{max-width:760px;margin-left:0}

@media (max-width:1100px){
  .kc-fakta-5{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:6px}
  .kc-fakta-5 > div:nth-child(4){padding-left:0;border-left:0}
}
@media (max-width:900px){
  .kc-top-in{grid-template-columns:1fr;align-items:start;gap:36px}
  .kc-afsnit,.kc-gruppe{grid-template-columns:1fr}
  .kc-gruppe-kort .rg-mere{grid-column:1}
  .kc-raekke,.kc-gruppe-kort .kc-raekke{grid-template-columns:62px minmax(0,1fr);row-gap:4px}
  .kc-raekke::after{display:none}
  .kc-linje{grid-column:2}
  .kc-register-hoved{justify-content:flex-start;margin-bottom:8px}
}
@media (max-width:760px){
  .kc-fakta,.kc-fakta-5{grid-template-columns:1fr}
  .kc-fakta-5 > div:nth-child(4){border-top:1px solid var(--rg-streg)}
}
@media (prefers-reduced-motion:reduce){
  .rg-js .kc-id,.rg-js .kc-panel,.rg-js .kc-punkter li,.rg-js .kc-rv{opacity:1;transform:none;transition:none}
  .rg-js .kc-maaler i{transform:scaleX(var(--andel,1));transition:none}
  .rg-js .kc-rv .kc-prik-maalt{transform:translateY(-1px);transition:none}
}