/* Klikbare arbejdsprincipper i hero */
.hero-principles { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); }
.principle-link { position:relative; display:grid; grid-template-columns:28px 1fr 18px; gap:12px; min-height:84px; align-content:center; align-items:center; padding:0 24px; border-right:1px solid var(--line); outline:0; transition:background .22s ease,color .22s ease,transform .18s ease,box-shadow .22s ease; }
.principle-link:first-child { padding-left:0; }
.principle-link:last-child { border-right:0; }
.principle-number { color:var(--blue); font-size:10px; transition:transform .22s ease; }
.principle-link strong { font-size:12px; font-weight:600; }
.principle-arrow { color:var(--blue); font-size:15px; opacity:0; transform:translate(-5px,-5px); transition:opacity .22s ease,transform .22s ease; }
.principle-link:hover { z-index:1; background:rgba(255,255,255,.72); color:var(--blue); box-shadow:inset 0 -2px 0 var(--blue); }
.principle-link:hover .principle-number { transform:translateX(2px); }
.principle-link:hover .principle-arrow { opacity:1; transform:translate(0,0); }
.principle-link:focus-visible { z-index:2; background:#fff; box-shadow:inset 0 0 0 2px var(--blue); }
.principle-link:active { transform:translateY(2px); background:var(--blue-soft); box-shadow:inset 0 -1px 0 var(--blue); }
@media (max-width:760px) { .hero-principles{grid-template-columns:1fr 1fr}.principle-link,.principle-link:first-child{padding:0 14px;min-height:70px;border-bottom:1px solid var(--line)}.principle-link:nth-child(2){border-right:0}.principle-link:nth-child(3),.principle-link:nth-child(4){border-bottom:0}.principle-link strong{font-size:11px} }
