/* Celenode Divi Header CTA – frontend + kartotek-preview.
   Variabler: --b hovedfarve · --t tekstfarve · --a accentfarve · --fs størrelse · --r radius · --py/--px padding
   --fw vægt · --ff font · --ls bogstavafstand · --tt transform · --dur tempo · --bw kantbredde · --g afstand */

@property --chc-ang { syntax: '<angle>'; inherits: false; initial-value: 0deg; }

/* ---------- Basis ---------- */
:is(#chc-top,body) .chc .chc-btn{
	--b: #4f5df5; --t: #ffffff; --a: #ff7ab6;
	--dk: color-mix(in srgb, var(--b) 62%, #000);
	--lt: color-mix(in srgb, var(--b) 18%, #fff);
	position: relative; display: inline-flex; align-items: center; justify-content: center; gap: .55em;
	box-sizing: border-box; margin: 0;
	padding: var(--py, 14px) var(--px, 28px);
	font-family: var(--ff, inherit); font-size: var(--fs, 16px); font-weight: var(--fw, 600);
	letter-spacing: var(--ls, 0); text-transform: var(--tt, none); line-height: 1.2; text-align: center;
	text-decoration: none !important; cursor: pointer;
	color: var(--t) !important; background: var(--b);
	border: var(--bw, 2px) solid transparent; border-radius: var(--r, 8px);
	isolation: isolate; -webkit-tap-highlight-color: transparent;
	transition: background-color var(--dur, .3s) ease, color var(--dur, .3s) ease, border-color var(--dur, .3s) ease,
		box-shadow var(--dur, .3s) ease, transform var(--dur, .3s) ease, filter var(--dur, .3s) ease,
		background-position var(--dur, .3s) ease, outline-offset var(--dur, .3s) ease, text-shadow var(--dur, .3s) ease;
}
:is(#chc-top,body) .chc .chc-btn:active{ transform: translateY(1px) scale(.985); }
:is(#chc-top,body) .chc .chc-btn:focus-visible{ outline: 3px solid var(--a); outline-offset: 3px; }
:is(#chc-top,body) .chc .chc-l{ display: inline-block; }
:is(#chc-top,body) .chc .chc-lt{ display: inline-block; }
:is(#chc-top,body) .chc .chc-ic{ display: inline-flex; flex: none; transition: transform var(--dur, .3s) ease, opacity var(--dur, .3s) ease, width var(--dur, .3s) ease, margin var(--dur, .3s) ease; }
:is(#chc-top,body) .chc .chc-ic svg{ width: 1.15em; height: 1.15em; fill: none; stroke: var(--ic, currentColor); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
:is(#chc-top,body) .chc .chc-btn:hover .chc-ic.is-move{ transform: translateX(.25em); }

/* ===================== SIMPLE ===================== */
:is(#chc-top,body) .chc .s-solid:hover{ transform: translateY(-2px); box-shadow: 0 8px 20px -6px var(--b); filter: brightness(1.08); }

:is(#chc-top,body) .chc .s-pill{ border-radius: 999px; }
:is(#chc-top,body) .chc .s-pill:hover{ transform: translateY(-2px); box-shadow: 0 8px 20px -6px var(--b); }

:is(#chc-top,body) .chc .s-square{ border-radius: 0; }
:is(#chc-top,body) .chc .s-square:hover{ background: var(--dk); }

:is(#chc-top,body) .chc .s-outline, :is(#chc-top,body) .chc .s-outline-pill{ background: transparent; color: var(--b) !important; border-color: var(--b); }
:is(#chc-top,body) .chc .s-outline:hover, :is(#chc-top,body) .chc .s-outline-pill:hover{ background: var(--b); color: var(--t) !important; }
:is(#chc-top,body) .chc .s-outline-pill{ border-radius: 999px; }

:is(#chc-top,body) .chc .s-ghost{ background: transparent; color: var(--b) !important; }
:is(#chc-top,body) .chc .s-ghost:hover{ background: color-mix(in srgb, var(--b) 14%, transparent); }

:is(#chc-top,body) .chc .s-soft{ background: color-mix(in srgb, var(--b) 14%, transparent); color: var(--b) !important; }
:is(#chc-top,body) .chc .s-soft:hover{ background: var(--b); color: var(--t) !important; }

:is(#chc-top,body) .chc .s-underline, :is(#chc-top,body) .chc .s-link-arrow{ background: transparent; color: var(--b) !important; border: 0; border-radius: 0; padding-left: 0; padding-right: 0; padding-bottom: calc(var(--py, 14px) * .5); }
:is(#chc-top,body) .chc .s-underline::after, :is(#chc-top,body) .chc .s-link-arrow::after{ content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: var(--bw, 2px); background: currentColor; transform: scaleX(.3); transform-origin: left; transition: transform .4s ease; }
:is(#chc-top,body) .chc .s-underline:hover::after, :is(#chc-top,body) .chc .s-link-arrow:hover::after{ transform: scaleX(1); }

/* ===================== FYLD-ANIMATIONER ===================== */
:is(#chc-top,body) .chc .s-fill-left, :is(#chc-top,body) .chc .s-fill-right, :is(#chc-top,body) .chc .s-fill-up, :is(#chc-top,body) .chc .s-fill-down, :is(#chc-top,body) .chc .s-fill-center, :is(#chc-top,body) .chc .s-fill-diagonal, :is(#chc-top,body) .chc .s-fill-circle, :is(#chc-top,body) .chc .s-fill-split{
	background: transparent; color: var(--b) !important; border-color: var(--b); overflow: hidden;
}
:is(#chc-top,body) .chc .s-fill-left:hover, :is(#chc-top,body) .chc .s-fill-right:hover, :is(#chc-top,body) .chc .s-fill-up:hover, :is(#chc-top,body) .chc .s-fill-down:hover, :is(#chc-top,body) .chc .s-fill-center:hover, :is(#chc-top,body) .chc .s-fill-diagonal:hover, :is(#chc-top,body) .chc .s-fill-circle:hover, :is(#chc-top,body) .chc .s-fill-split:hover{ color: var(--t) !important; }
:is(#chc-top,body) .chc .s-fill-left::before, :is(#chc-top,body) .chc .s-fill-right::before, :is(#chc-top,body) .chc .s-fill-up::before, :is(#chc-top,body) .chc .s-fill-down::before, :is(#chc-top,body) .chc .s-fill-center::before, :is(#chc-top,body) .chc .s-fill-diagonal::before, :is(#chc-top,body) .chc .s-fill-circle::before, :is(#chc-top,body) .chc .s-fill-split::before, :is(#chc-top,body) .chc .s-fill-split::after{
	content: ""; position: absolute; inset: 0; background: var(--b); z-index: -1; pointer-events: none;
	transition: transform var(--dur, .3s) ease;
}
:is(#chc-top,body) .chc .s-fill-left::before{ transform: translateX(-101%); }
:is(#chc-top,body) .chc .s-fill-right::before{ transform: translateX(101%); }
:is(#chc-top,body) .chc .s-fill-up::before{ transform: translateY(101%); }
:is(#chc-top,body) .chc .s-fill-down::before{ transform: translateY(-101%); }
:is(#chc-top,body) .chc .s-fill-center::before{ transform: scaleX(0); }
:is(#chc-top,body) .chc .s-fill-left:hover::before, :is(#chc-top,body) .chc .s-fill-right:hover::before, :is(#chc-top,body) .chc .s-fill-up:hover::before, :is(#chc-top,body) .chc .s-fill-down:hover::before, :is(#chc-top,body) .chc .s-fill-center:hover::before{ transform: none; }
:is(#chc-top,body) .chc .s-fill-diagonal::before{ inset: 0 -25%; transform: translateX(-110%) skewX(-25deg); }
:is(#chc-top,body) .chc .s-fill-diagonal:hover::before{ transform: translateX(0) skewX(-25deg); }
:is(#chc-top,body) .chc .s-fill-circle::before{ inset: auto; left: 50%; top: 50%; width: 200%; height: auto; aspect-ratio: 1; border-radius: 50%; transform: translate(-50%, -50%) scale(0); }
:is(#chc-top,body) .chc .s-fill-circle:hover::before{ transform: translate(-50%, -50%) scale(1); }
:is(#chc-top,body) .chc .s-fill-split::before{ inset: 0 50% 0 0; transform: scaleX(0); transform-origin: left; }
:is(#chc-top,body) .chc .s-fill-split::after{ inset: 0 0 0 50%; transform: scaleX(0); transform-origin: right; }
:is(#chc-top,body) .chc .s-fill-split:hover::before, :is(#chc-top,body) .chc .s-fill-split:hover::after{ transform: scaleX(1); }

/* ===================== GRADIENT ===================== */
:is(#chc-top,body) .chc .s-gradient, :is(#chc-top,body) .chc .s-gradient-pill{
	background: linear-gradient(135deg, var(--b), var(--a)); background-size: 200% 200%; background-position: 0 0;
}
:is(#chc-top,body) .chc .s-gradient:hover, :is(#chc-top,body) .chc .s-gradient-pill:hover{ background-position: 100% 100%; transform: translateY(-2px); box-shadow: 0 10px 24px -8px var(--a); }
:is(#chc-top,body) .chc .s-gradient-pill{ border-radius: 999px; }

:is(#chc-top,body) .chc .s-gradient-outline{ background: transparent; color: var(--b) !important; border-color: transparent; }
:is(#chc-top,body) .chc .s-gradient-outline::before{
	content: ""; position: absolute; inset: calc(var(--bw, 2px) * -1); border-radius: inherit; padding: var(--bw, 2px);
	background: linear-gradient(135deg, var(--b), var(--a)); pointer-events: none;
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
	mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}
:is(#chc-top,body) .chc .s-gradient-outline::after{
	content: ""; position: absolute; inset: calc(var(--bw, 2px) * -1); border-radius: inherit; z-index: -1; opacity: 0; pointer-events: none;
	background: linear-gradient(135deg, var(--b), var(--a)); transition: opacity var(--dur, .3s) ease;
}
:is(#chc-top,body) .chc .s-gradient-outline:hover{ color: var(--t) !important; }
:is(#chc-top,body) .chc .s-gradient-outline:hover::after{ opacity: 1; }

:is(#chc-top,body) .chc .s-gradient-flow{ background: linear-gradient(120deg, var(--b), var(--a), var(--b)); background-size: 300% 100%; animation: chc-flow 5s ease-in-out infinite; }
:is(#chc-top,body) .chc .s-gradient-flow:hover{ transform: translateY(-2px); box-shadow: 0 10px 24px -8px var(--a); }

:is(#chc-top,body) .chc .s-gradient-shine, :is(#chc-top,body) .chc .s-shine{ overflow: hidden; }
:is(#chc-top,body) .chc .s-gradient-shine{ background: linear-gradient(135deg, var(--b), var(--a)); }
:is(#chc-top,body) .chc .s-gradient-shine::after, :is(#chc-top,body) .chc .s-shine::after{
	content: ""; position: absolute; top: 0; left: -80%; width: 50%; height: 100%; pointer-events: none;
	background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .5), transparent); transform: skewX(-20deg); transition: left .7s ease;
}
:is(#chc-top,body) .chc .s-gradient-shine:hover::after, :is(#chc-top,body) .chc .s-shine:hover::after{ left: 130%; }

:is(#chc-top,body) .chc .s-aurora{
	background: radial-gradient(at 20% 20%, var(--a), transparent 55%), radial-gradient(at 85% 80%, color-mix(in srgb, var(--a) 50%, var(--b)), transparent 55%), var(--b);
	background-size: 170% 170%; animation: chc-aurora 6s ease-in-out infinite alternate;
}
:is(#chc-top,body) .chc .s-aurora:hover{ transform: translateY(-2px); box-shadow: 0 10px 28px -8px var(--a); }

/* ===================== GLOW / NEON ===================== */
:is(#chc-top,body) .chc .s-glow{ box-shadow: 0 0 18px -2px var(--b); }
:is(#chc-top,body) .chc .s-glow:hover{ box-shadow: 0 0 34px 2px var(--b); transform: translateY(-2px); }

:is(#chc-top,body) .chc .s-neon, :is(#chc-top,body) .chc .s-neon-pulse{
	background: #0b0b14; color: var(--b) !important; border-color: var(--b); text-shadow: 0 0 8px var(--b);
	box-shadow: 0 0 10px var(--b), inset 0 0 10px color-mix(in srgb, var(--b) 40%, transparent);
}
:is(#chc-top,body) .chc .s-neon:hover, :is(#chc-top,body) .chc .s-neon-pulse:hover{ background: var(--b); color: var(--t) !important; text-shadow: none; box-shadow: 0 0 28px var(--b), 0 0 60px var(--b); }
:is(#chc-top,body) .chc .s-neon-pulse{ animation: chc-neon 1.8s ease-in-out infinite alternate; }

:is(#chc-top,body) .chc .s-glow-under{ background: transparent; border-color: transparent; }
:is(#chc-top,body) .chc .s-glow-under::after{ content: ""; position: absolute; inset: calc(var(--bw, 2px) * -1); border-radius: inherit; background: linear-gradient(90deg, var(--b), var(--a)); z-index: -1; pointer-events: none; }
:is(#chc-top,body) .chc .s-glow-under::before{ content: ""; position: absolute; inset: 8px 6%; border-radius: inherit; background: linear-gradient(90deg, var(--b), var(--a)); filter: blur(16px); opacity: .65; z-index: -2; pointer-events: none; transition: all var(--dur, .3s) ease; }
:is(#chc-top,body) .chc .s-glow-under:hover::before{ inset: 0; opacity: 1; filter: blur(22px); }

:is(#chc-top,body) .chc .s-rainbow-border{ background: transparent; border-color: transparent; }
:is(#chc-top,body) .chc .s-rainbow-border::before{
	content: ""; position: absolute; inset: calc(var(--bw, 2px) * -1); border-radius: inherit; z-index: -2; pointer-events: none;
	background: conic-gradient(from var(--chc-ang), #ff3d81, #ffb800, #3dffb0, #3d8bff, #c13dff, #ff3d81); animation: chc-spin 3s linear infinite;
}
:is(#chc-top,body) .chc .s-rainbow-border::after{ content: ""; position: absolute; inset: 0; border-radius: inherit; background: #0f0f1a; z-index: -1; pointer-events: none; }

/* ===================== 3D / RETRO ===================== */
:is(#chc-top,body) .chc .s-press-3d{ box-shadow: 0 6px 0 var(--dk); }
:is(#chc-top,body) .chc .s-press-3d:hover{ transform: translateY(-2px); box-shadow: 0 8px 0 var(--dk); }
:is(#chc-top,body) .chc .s-press-3d:active{ transform: translateY(5px); box-shadow: 0 1px 0 var(--dk); }

:is(#chc-top,body) .chc .s-neo-brutal{ border: 3px solid #111; border-radius: 0; box-shadow: 5px 5px 0 #111; }
:is(#chc-top,body) .chc .s-neo-brutal:hover{ transform: translate(-3px, -3px); box-shadow: 8px 8px 0 #111; }
:is(#chc-top,body) .chc .s-neo-brutal:active{ transform: translate(3px, 3px); box-shadow: 2px 2px 0 #111; }

:is(#chc-top,body) .chc .s-retro-offset{ border-radius: 4px; box-shadow: 6px 6px 0 var(--a); }
:is(#chc-top,body) .chc .s-retro-offset:hover{ transform: translate(3px, 3px); box-shadow: 3px 3px 0 var(--a); }

:is(#chc-top,body) .chc .s-pixel{
	border: 0; border-radius: 0; font-family: "Courier New", monospace; text-transform: uppercase; letter-spacing: .06em;
	box-shadow: -4px 0 0 0 var(--dk), 4px 0 0 0 var(--dk), 0 -4px 0 0 var(--dk), 0 4px 0 0 var(--dk);
}
:is(#chc-top,body) .chc .s-pixel:hover{ background: var(--a); transform: translateY(-2px); }

:is(#chc-top,body) .chc .s-gel{
	background: linear-gradient(var(--lt), var(--b) 50%, var(--dk)); border-color: var(--dk);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .6), 0 3px 8px rgba(0, 0, 0, .25); text-shadow: 0 1px 1px rgba(0, 0, 0, .35);
}
:is(#chc-top,body) .chc .s-gel:hover{ filter: brightness(1.1); transform: translateY(-1px); }

:is(#chc-top,body) .chc .s-layered{ box-shadow: 4px 4px 0 var(--a), 8px 8px 0 color-mix(in srgb, var(--a) 45%, transparent); }
:is(#chc-top,body) .chc .s-layered:hover{ transform: translate(2px, 2px); box-shadow: 2px 2px 0 var(--a), 4px 4px 0 color-mix(in srgb, var(--a) 45%, transparent); }

:is(#chc-top,body) .chc .s-dashed{ background: transparent; color: var(--b) !important; border: var(--bw, 2px) dashed var(--b); }
:is(#chc-top,body) .chc .s-dashed:hover{ background: var(--b); color: var(--t) !important; border-style: solid; }

/* ===================== GLAS / BLØD ===================== */
:is(#chc-top,body) .chc .s-glass{
	background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .38);
	-webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 8px 32px rgba(0, 0, 0, .15);
}
:is(#chc-top,body) .chc .s-glass:hover{ background: rgba(255, 255, 255, .28); transform: translateY(-2px); }

:is(#chc-top,body) .chc .s-frosted{
	background: color-mix(in srgb, var(--b) 40%, transparent); border: 1px solid color-mix(in srgb, var(--b) 60%, #fff);
	-webkit-backdrop-filter: blur(14px) saturate(1.4); backdrop-filter: blur(14px) saturate(1.4);
}
:is(#chc-top,body) .chc .s-frosted:hover{ background: color-mix(in srgb, var(--b) 65%, transparent); transform: translateY(-2px); }

:is(#chc-top,body) .chc .s-soft-shadow{ box-shadow: 0 14px 30px -10px var(--b); }
:is(#chc-top,body) .chc .s-soft-shadow:hover{ transform: translateY(-4px); box-shadow: 0 22px 40px -12px var(--b); }

:is(#chc-top,body) .chc .s-neumorph{ background: #e6e9ef; color: var(--b) !important; border-color: transparent; box-shadow: 6px 6px 14px #c5c8ce, -6px -6px 14px #ffffff; }
:is(#chc-top,body) .chc .s-neumorph:hover{ box-shadow: 3px 3px 8px #c5c8ce, -3px -3px 8px #ffffff; }
:is(#chc-top,body) .chc .s-neumorph:active{ box-shadow: inset 4px 4px 8px #c5c8ce, inset -4px -4px 8px #ffffff; }

/* ===================== FORMER ===================== */
:is(#chc-top,body) .chc .s-cut-corner{ border: 0; border-radius: 0; clip-path: polygon(14px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%, 0 14px); }
:is(#chc-top,body) .chc .s-cut-corner:hover{ background: var(--a); }

:is(#chc-top,body) .chc .s-arrow-shape{ border: 0; border-radius: 0; padding-right: calc(var(--px, 28px) + 14px); clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 50%, calc(100% - 18px) 100%, 0 100%); }
:is(#chc-top,body) .chc .s-arrow-shape:hover{ background: var(--a); }

:is(#chc-top,body) .chc .s-skew{ border-radius: 0; transform: skewX(-12deg); }
:is(#chc-top,body) .chc .s-skew > *{ transform: skewX(12deg); }
:is(#chc-top,body) .chc .s-skew:hover{ background: var(--a); transform: skewX(-12deg) translateY(-2px); }

:is(#chc-top,body) .chc .s-bracket{ background: transparent; color: var(--b) !important; border: 0; border-radius: 0; padding-left: calc(var(--px, 28px) + .5em); padding-right: calc(var(--px, 28px) + .5em); }
:is(#chc-top,body) .chc .s-bracket::before, :is(#chc-top,body) .chc .s-bracket::after{ position: absolute; top: 50%; opacity: 0; font-size: 1.5em; line-height: 1; transition: transform var(--dur, .3s) ease, opacity var(--dur, .3s) ease; }
:is(#chc-top,body) .chc .s-bracket::before{ content: "["; left: .2em; transform: translate(-10px, -50%); }
:is(#chc-top,body) .chc .s-bracket::after{ content: "]"; right: .2em; transform: translate(10px, -50%); }
:is(#chc-top,body) .chc .s-bracket:hover::before, :is(#chc-top,body) .chc .s-bracket:hover::after{ opacity: 1; transform: translate(0, -50%); }

:is(#chc-top,body) .chc .s-double-border{ outline: var(--bw, 2px) solid var(--b); outline-offset: 4px; }
:is(#chc-top,body) .chc .s-double-border:hover{ outline-offset: 8px; }

/* ===================== BEVÆGELSE ===================== */
:is(#chc-top,body) .chc .s-shine:hover{ transform: translateY(-2px); box-shadow: 0 8px 20px -6px var(--b); }

:is(#chc-top,body) .chc .s-roll{ overflow: hidden; }
:is(#chc-top,body) .chc .s-roll .chc-l{ display: block; overflow: hidden; height: 1.2em; }
:is(#chc-top,body) .chc .s-roll .chc-lt{ display: block; position: relative; transition: transform .38s cubic-bezier(.7, 0, .2, 1); }
:is(#chc-top,body) .chc .s-roll .chc-lt::after{ content: attr(data-text); position: absolute; left: 0; top: 100%; white-space: nowrap; }
:is(#chc-top,body) .chc .s-roll:hover .chc-lt{ transform: translateY(-100%); }
:is(#chc-top,body) .chc .s-roll:hover{ background: var(--dk); }

:is(#chc-top,body) .chc .s-icon-slide .chc-ic{ width: 0; opacity: 0; margin-left: -.55em; overflow: hidden; }
:is(#chc-top,body) .chc .s-icon-slide:hover .chc-ic{ width: 1.15em; opacity: 1; margin-left: 0; }
:is(#chc-top,body) .chc .s-icon-slide:hover{ background: var(--dk); }

:is(#chc-top,body) .chc .s-bounce:hover{ animation: chc-bounce .6s ease; }
:is(#chc-top,body) .chc .s-wobble:hover{ animation: chc-wobble .7s ease; }
:is(#chc-top,body) .chc .s-shake:hover{ animation: chc-shake .5s ease; }
:is(#chc-top,body) .chc .s-float{ animation: chc-float 3s ease-in-out infinite; box-shadow: 0 10px 20px -10px var(--b); }
:is(#chc-top,body) .chc .s-float:hover{ animation-play-state: paused; }
:is(#chc-top,body) .chc .s-pulse::after{ content: ""; position: absolute; inset: calc(var(--bw, 2px) * -1); border-radius: inherit; z-index: -1; pointer-events: none; animation: chc-ring 1.8s ease-out infinite; }

/* ===================== NYE FORMER ===================== */
:is(#chc-top,body) .chc .s-hexagon{ border: 0; border-radius: 0; padding-left: calc(var(--px, 28px) + 10px); padding-right: calc(var(--px, 28px) + 10px); clip-path: polygon(16px 0, calc(100% - 16px) 0, 100% 50%, calc(100% - 16px) 100%, 16px 100%, 0 50%); }
:is(#chc-top,body) .chc .s-hexagon:hover{ background: var(--a); }

:is(#chc-top,body) .chc .s-parallelogram{ border: 0; border-radius: 0; padding-left: calc(var(--px, 28px) + 8px); padding-right: calc(var(--px, 28px) + 8px); clip-path: polygon(18px 0, 100% 0, calc(100% - 18px) 100%, 0 100%); }
:is(#chc-top,body) .chc .s-parallelogram:hover{ background: var(--a); }

:is(#chc-top,body) .chc .s-double-arrow{ border: 0; border-radius: 0; padding-left: calc(var(--px, 28px) + 12px); padding-right: calc(var(--px, 28px) + 12px); clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 50%, calc(100% - 16px) 100%, 0 100%, 16px 50%); }
:is(#chc-top,body) .chc .s-double-arrow:hover{ background: var(--a); }

:is(#chc-top,body) .chc .s-ticket, :is(#chc-top,body) .chc .s-badge{ border: 0; border-radius: 0; }
:is(#chc-top,body) .chc .s-ticket{
	-webkit-mask: radial-gradient(circle 8px at 0 50%, #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle 8px at 100% 50%, #0000 97%, #000) right / 51% 100% no-repeat;
	mask: radial-gradient(circle 8px at 0 50%, #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle 8px at 100% 50%, #0000 97%, #000) right / 51% 100% no-repeat;
}
:is(#chc-top,body) .chc .s-badge{
	-webkit-mask: radial-gradient(circle 8px at 0 0, #0000 97%, #000) top left / 51% 51% no-repeat, radial-gradient(circle 8px at 100% 0, #0000 97%, #000) top right / 51% 51% no-repeat,
		radial-gradient(circle 8px at 0 100%, #0000 97%, #000) bottom left / 51% 51% no-repeat, radial-gradient(circle 8px at 100% 100%, #0000 97%, #000) bottom right / 51% 51% no-repeat;
	mask: radial-gradient(circle 8px at 0 0, #0000 97%, #000) top left / 51% 51% no-repeat, radial-gradient(circle 8px at 100% 0, #0000 97%, #000) top right / 51% 51% no-repeat,
		radial-gradient(circle 8px at 0 100%, #0000 97%, #000) bottom left / 51% 51% no-repeat, radial-gradient(circle 8px at 100% 100%, #0000 97%, #000) bottom right / 51% 51% no-repeat;
}
:is(#chc-top,body) .chc .s-ticket:hover, :is(#chc-top,body) .chc .s-badge:hover{ background: var(--a); }

:is(#chc-top,body) .chc .s-blob{ border-radius: 58% 42% 55% 45% / 52% 58% 42% 48%; }
:is(#chc-top,body) .chc .s-blob:hover{ border-radius: 42% 58% 45% 55% / 58% 42% 58% 42%; transform: rotate(-1.5deg) scale(1.03); box-shadow: 0 10px 22px -8px var(--b); }

:is(#chc-top,body) .chc .s-sketch{ background: transparent; color: var(--b) !important; border: max(var(--bw, 2px), 2px) solid var(--b); border-radius: 255px 18px 225px 18px / 18px 225px 18px 255px; }
:is(#chc-top,body) .chc .s-sketch:hover{ background: var(--b); color: var(--t) !important; transform: rotate(-1deg); }

/* ===================== NYE BEVÆGELSER ===================== */
:is(#chc-top,body) .chc .s-border-draw{
	background: linear-gradient(var(--b), var(--b)) 0 0 / 0 var(--bw, 2px) no-repeat, linear-gradient(var(--b), var(--b)) 100% 0 / var(--bw, 2px) 0 no-repeat,
		linear-gradient(var(--b), var(--b)) 100% 100% / 0 var(--bw, 2px) no-repeat, linear-gradient(var(--b), var(--b)) 0 100% / var(--bw, 2px) 0 no-repeat;
	color: var(--b) !important; border-color: color-mix(in srgb, var(--b) 28%, transparent);
	transition: background-size .55s ease, color var(--dur, .3s) ease;
}
:is(#chc-top,body) .chc .s-border-draw:hover{ background-size: 100% var(--bw, 2px), var(--bw, 2px) 100%, 100% var(--bw, 2px), var(--bw, 2px) 100%; }

:is(#chc-top,body) .chc .s-stripes{
	background: repeating-linear-gradient(-45deg, var(--b) 0 12px, color-mix(in srgb, var(--b) 78%, #fff) 12px 24px); background-size: 34px 34px;
}
:is(#chc-top,body) .chc .s-stripes:hover{ animation: chc-stripes .8s linear infinite; }

:is(#chc-top,body) .chc .s-spotlight-edge{ border-color: transparent; }
:is(#chc-top,body) .chc .s-spotlight-edge::before{ content: ""; position: absolute; inset: calc(var(--bw, 2px) * -1); border-radius: inherit; z-index: -2; pointer-events: none; background: conic-gradient(from var(--chc-ang), transparent 0 55%, var(--a) 85%, transparent); animation: chc-spin 2.4s linear infinite; }
:is(#chc-top,body) .chc .s-spotlight-edge::after{ content: ""; position: absolute; inset: 0; border-radius: inherit; background: var(--b); z-index: -1; pointer-events: none; }
:is(#chc-top,body) .chc .s-spotlight-edge:hover{ box-shadow: 0 0 22px -4px var(--a); }

/* ===================== FYLDT / STREG (valg pr. knap i modulet) ===================== */
/* Streg: gælder stile, hvor en kant giver mening. Hover fylder knappen. */
:is(#chc-top,body) .chc .chc-btn.is-border:is(.s-solid, .s-pill, .s-square, .s-soft, .s-glow, .s-soft-shadow, .s-press-3d, .s-gradient, .s-gradient-pill, .s-gradient-flow, .s-aurora, .s-gel, .s-float, .s-bounce, .s-wobble, .s-shake, .s-pulse, .s-blob){
	background: transparent; background-image: none; animation: none; box-shadow: none; text-shadow: none;
	color: var(--t) !important; border-color: var(--b);
}
:is(#chc-top,body) .chc .chc-btn.is-border:is(.s-solid, .s-pill, .s-square, .s-soft, .s-glow, .s-soft-shadow, .s-press-3d, .s-gradient, .s-gradient-pill, .s-gradient-flow, .s-aurora, .s-gel, .s-float, .s-bounce, .s-wobble, .s-shake, .s-pulse, .s-blob):hover{
	background: var(--b); color: var(--h, #fff) !important; box-shadow: 0 8px 20px -6px var(--b);
}
/* Streg-stile, der allerede starter som streg: tekstfarven gælder, og ved hover bruges "tekstfarve ved hover". */
:is(#chc-top,body) .chc .chc-btn.is-border:is(.s-outline, .s-outline-pill, .s-dashed, .s-sketch){ color: var(--t) !important; }
:is(#chc-top,body) .chc .chc-btn.is-border:is(.s-outline, .s-outline-pill, .s-dashed, .s-sketch):hover{ color: var(--h, #fff) !important; }
/* Egen kantfarve (sat i backend/modul): vinder over stilens egen kantfarve. */
:is(#chc-top,body) .chc .chc-btn[style*="--bc:"]{ border-color: var(--bc) !important; }
/* Fyldt: omvendt for de stile, der starter som streg. */
:is(#chc-top,body) .chc .chc-btn.is-fill:is(.s-outline, .s-outline-pill, .s-dashed, .s-sketch){ background: var(--b); color: var(--t) !important; border-color: var(--b); }
:is(#chc-top,body) .chc .chc-btn.is-fill:is(.s-outline, .s-outline-pill, .s-dashed, .s-sketch):hover{ background: transparent; color: var(--b) !important; }

/* Ens hover: alle simple stile løfter sig let og får skygge, så to knapper med hver sin udfyldning reagerer ens. */
:is(#chc-top,body) .chc .s-outline:hover, :is(#chc-top,body) .chc .s-outline-pill:hover, :is(#chc-top,body) .chc .s-soft:hover, :is(#chc-top,body) .chc .s-square:hover, :is(#chc-top,body) .chc .s-dashed:hover, :is(#chc-top,body) .chc .chc-btn.is-fill:is(.s-outline, .s-outline-pill, .s-dashed):hover{ transform: translateY(-2px); box-shadow: 0 8px 20px -6px var(--b); }

/* ===================== IKON-BADGE (tekst + rund ikon-knap i enden) =====================
   --b hovedfarve (knappen) · --t tekst · --a badge-farve (cirklen) · --ic pilens farve (standard: hovedfarven) */
:is(#chc-top,body) .chc [class*="s-badge-"]{
	--pb: calc(var(--py, 14px) * .42);
	padding: var(--pb) var(--pb) var(--pb) var(--px, 28px);
	gap: calc(var(--px, 28px) * .55); border-radius: 999px;
}
:is(#chc-top,body) .chc [class*="s-badge-"] .chc-ic{
	position: relative; z-index: 1; width: 2.4em; height: 2.4em; border-radius: 50%; align-items: center; justify-content: center;
	background: var(--a); transition: background-color var(--dur, .3s) ease, box-shadow var(--dur, .3s) ease, transform var(--dur, .3s) ease;
}
:is(#chc-top,body) .chc [class*="s-badge-"] .chc-ic svg{ width: 1.1em; height: 1.1em; stroke: var(--ic, var(--b)); transition: transform var(--dur, .3s) cubic-bezier(.3, 1.5, .5, 1), stroke var(--dur, .3s) ease; }
:is(#chc-top,body) .chc [class*="s-badge-"]:hover .chc-ic svg{ transform: rotate(45deg); }
:is(#chc-top,body) .chc [class*="s-badge-"]:hover .chc-ic.is-move{ transform: none; }
:is(#chc-top,body) .chc [class*="s-badge-"]:hover .chc-ic.is-move svg{ transform: translateX(.18em); }

:is(#chc-top,body) .chc .s-badge-pill:hover, :is(#chc-top,body) .chc .s-badge-gradient:hover, :is(#chc-top,body) .chc .s-badge-light:hover{ transform: translateY(-2px); box-shadow: 0 8px 20px -8px var(--b); }

:is(#chc-top,body) .chc .s-badge-pill-left{ padding: var(--pb) var(--px, 28px) var(--pb) var(--pb); }
:is(#chc-top,body) .chc .s-badge-pill-left .chc-ic{ order: -1; }
:is(#chc-top,body) .chc .s-badge-pill-left:hover{ transform: translateY(-2px); box-shadow: 0 8px 20px -8px var(--b); }

/* Cirklen vokser og fylder hele knappen ved hover */
:is(#chc-top,body) .chc .s-badge-expand{ overflow: hidden; }
:is(#chc-top,body) .chc .s-badge-expand .chc-ic{ z-index: 0; }
:is(#chc-top,body) .chc .s-badge-expand .chc-l{ position: relative; z-index: 1; }
:is(#chc-top,body) .chc .s-badge-expand:hover .chc-ic{ box-shadow: 0 0 0 420px var(--a); }
:is(#chc-top,body) .chc .s-badge-expand:hover{ color: var(--b) !important; }

:is(#chc-top,body) .chc .s-badge-outline{ background: transparent; color: var(--b) !important; border-color: var(--b); }
:is(#chc-top,body) .chc .s-badge-outline .chc-ic{ background: var(--b); }
:is(#chc-top,body) .chc .s-badge-outline .chc-ic svg{ stroke: var(--ic, var(--t)); }
:is(#chc-top,body) .chc .s-badge-outline:hover{ background: var(--b); color: var(--t) !important; }
:is(#chc-top,body) .chc .s-badge-outline:hover .chc-ic{ background: var(--a); }
:is(#chc-top,body) .chc .s-badge-outline:hover .chc-ic svg{ stroke: var(--ic, var(--b)); }

:is(#chc-top,body) .chc .s-badge-light{ background: color-mix(in srgb, var(--b) 12%, #fff); color: var(--b) !important; border-color: transparent; }
:is(#chc-top,body) .chc .s-badge-light .chc-ic{ background: var(--b); }
:is(#chc-top,body) .chc .s-badge-light .chc-ic svg{ stroke: var(--ic, var(--t)); }

:is(#chc-top,body) .chc .s-badge-gradient{ background: linear-gradient(135deg, var(--b), var(--a)); background-origin: border-box; }
:is(#chc-top,body) .chc .s-badge-gradient .chc-ic{ background: #fff; }

:is(#chc-top,body) .chc .s-badge-square{ border-radius: var(--r, 8px); }
:is(#chc-top,body) .chc .s-badge-square .chc-ic{ border-radius: max(0px, calc(var(--r, 8px) - 4px)); }
:is(#chc-top,body) .chc .s-badge-square:hover{ transform: translateY(-2px); box-shadow: 0 8px 20px -8px var(--b); }

:is(#chc-top,body) .chc .s-badge-glass{ background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .38); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 8px 32px rgba(0, 0, 0, .15); }
:is(#chc-top,body) .chc .s-badge-glass .chc-ic{ background: rgba(255, 255, 255, .3); }
:is(#chc-top,body) .chc .s-badge-glass .chc-ic svg{ stroke: var(--ic, #fff); }
:is(#chc-top,body) .chc .s-badge-glass:hover{ background: rgba(255, 255, 255, .26); }

:is(#chc-top,body) .chc .s-badge-3d{ box-shadow: 0 6px 0 var(--dk); }
:is(#chc-top,body) .chc .s-badge-3d:hover{ transform: translateY(-2px); box-shadow: 0 8px 0 var(--dk); }
:is(#chc-top,body) .chc .s-badge-3d:active{ transform: translateY(5px); box-shadow: 0 1px 0 var(--dk); }

:is(#chc-top,body) .chc .s-badge-glow{ box-shadow: 0 0 22px -2px var(--b); }
:is(#chc-top,body) .chc .s-badge-glow .chc-ic{ box-shadow: 0 0 16px var(--a); }
:is(#chc-top,body) .chc .s-badge-glow:hover{ box-shadow: 0 0 38px 2px var(--b); transform: translateY(-2px); }

/* To adskilte dele: tekst-pille + rund badge. Mellemrummet lukker sig ved hover. */
:is(#chc-top,body) .chc .s-badge-split{ background: transparent; border: 0; padding: 0; gap: 5px; border-radius: 0; }
:is(#chc-top,body) .chc .s-badge-split .chc-l{ background: var(--b); color: var(--t); padding: var(--py, 14px) var(--px, 28px); border-radius: 999px; transition: background-color var(--dur, .3s) ease; }
:is(#chc-top,body) .chc .s-badge-split .chc-ic{ width: calc(1.2em + var(--py, 14px) * 2); height: calc(1.2em + var(--py, 14px) * 2); }
:is(#chc-top,body) .chc .s-badge-split .chc-ic svg{ width: 1.2em; height: 1.2em; }
:is(#chc-top,body) .chc .s-badge-split:hover{ gap: 2px; }
:is(#chc-top,body) .chc .s-badge-split:hover .chc-l{ background: var(--dk); }
:is(#chc-top,body) .chc .s-badge-split.s-badge-split:active{ transform: scale(.98); }

/* ---------- Keyframes ---------- */
@keyframes chc-stripes { to { background-position: 34px 0; } }
@keyframes chc-flow { 0%, 100% { background-position: 0 50%; } 50% { background-position: 100% 50%; } }
@keyframes chc-aurora { 0% { background-position: 0 0; } 100% { background-position: 100% 100%; } }
@keyframes chc-neon { from { box-shadow: 0 0 6px var(--b), inset 0 0 6px color-mix(in srgb, var(--b) 30%, transparent); } to { box-shadow: 0 0 22px var(--b), 0 0 40px color-mix(in srgb, var(--b) 60%, transparent), inset 0 0 14px color-mix(in srgb, var(--b) 50%, transparent); } }
@keyframes chc-spin { to { --chc-ang: 360deg; } }
@keyframes chc-bounce { 0%, 100% { transform: translateY(0); } 25% { transform: translateY(-9px); } 50% { transform: translateY(0); } 75% { transform: translateY(-4px); } }
@keyframes chc-wobble { 0%, 100% { transform: none; } 20% { transform: rotate(-4deg) scale(1.03); } 40% { transform: rotate(3deg); } 60% { transform: rotate(-2deg); } 80% { transform: rotate(1deg); } }
@keyframes chc-shake { 0%, 100% { transform: none; } 20%, 60% { transform: translateX(-5px); } 40%, 80% { transform: translateX(5px); } }
@keyframes chc-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes chc-ring { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--b) 60%, transparent); } 100% { box-shadow: 0 0 0 18px transparent; } }

@media (prefers-reduced-motion: reduce) {
	:is(#chc-top,body) .chc .chc-btn, :is(#chc-top,body) .chc .chc-btn::before, :is(#chc-top,body) .chc .chc-btn::after{ animation: none !important; transition-duration: .01s !important; }
}



/* ====================================================================
   HEADER-INDPAKNING: <li> i menuen + blok med telefon og knap
   ==================================================================== */
:is(#chc-top,body) .chc-item{ display: inline-flex; align-items: center; vertical-align: middle; float: none; padding: 0 0 0 var(--chc-ml, 14px); margin: 0; list-style: none; transform: translateY(calc(var(--chc-auto, 0px) + var(--chc-ny, 0px))); line-height: 1; }
:is(#chc-top,body) .chc-item::before, :is(#chc-top,body) .chc-item::after{ display: none; }
:is(#chc-top,body) .chc.chc-wrap{ display: flex; align-items: center; gap: var(--chc-gap, 14px); flex-wrap: nowrap; white-space: nowrap; box-sizing: border-box; }
:is(#chc-top,body) .chc .chc-bw{ position: relative; display: inline-flex; }
:is(#chc-top,body) .chc .chc-btn{ opacity: 1; white-space: nowrap; }

/* Tilbudsmærke på knappen */
:is(#chc-top,body) .chc .chc-bdg{ position: absolute; top: -9px; right: -7px; z-index: 3; background: var(--bdg, #ef4444); color: #fff; font: 700 10px/1.45 system-ui, sans-serif; letter-spacing: .03em; text-transform: uppercase; padding: 2px 7px; border-radius: 999px; box-shadow: 0 2px 6px rgba(0, 0, 0, .25); pointer-events: none; }

/* Knappen vises først efter scroll */
:is(#chc-top,body) .chc .chc-bw.chc-late{ opacity: 0; visibility: hidden; transform: translateY(-6px); pointer-events: none; transition: opacity .3s ease, transform .3s ease, visibility .3s; }
body.chc-show .chc .chc-bw.chc-late{ opacity: 1; visibility: visible; transform: none; pointer-events: auto; }

/* Efter scroll: to udgaver af knappen (normal / scrollet) og telefonen kan blive til ikon eller skjules */
:is(#chc-top,body) .chc .chc-st-s{ display: none; }
body.chc-scrolled .chc .chc-st-s{ display: inline-flex !important; }
body.chc-scrolled .chc .chc-st-n{ display: none !important; }
body.chc-scrolled .chc .chc-pgw.sc-hide{ display: none !important; }
body.chc-scrolled .chc .chc-pgw.sc-icon .chc-pt, body.chc-scrolled .chc .chc-pgw.sc-icon .chc-open{ display: none !important; }
:is(#chc-top,body) .chc .chc-pgw{ display: inline-flex; }

/* Farver efter scroll (samlet under hver funktion): normal = --xx0, efter scroll = --xx1. */
:is(#chc-top,body) .chc{ --ho: var(--ho0, #15803d); --hc: var(--hc0, #b91c1c); }
:is(#chc-top,body).chc-scrolled .chc{ --ho: var(--ho1, var(--ho0, #15803d)); --hc: var(--hc1, var(--hc0, #b91c1c)); }
:is(#chc-top,body).chc-scrolled .chc .chc-phone{ --pc: var(--pc1, var(--pc0, #4f5df5)); --pt: var(--pt1, var(--pt0)); --pa: var(--pa1, var(--pa0)); }

/* ====================================================================
   TELEFON (stilarter p-*)
   --pc hovedfarve · --pt tekstfarve · --pa ikon/accent · --pfs størrelse · --pfw vægt
   ==================================================================== */
:is(#chc-top,body) .chc .chc-phone{
	--pc: var(--pc0, #4f5df5); --pt: var(--pt0); --pa: var(--pa0);
	display: inline-flex; align-items: center; gap: .55em; position: relative; box-sizing: border-box; margin: 0; padding: 0;
	font-size: var(--pfs, 16px); font-weight: var(--pfw, 700); line-height: 1.15; white-space: nowrap;
	text-decoration: none !important; color: var(--pt, #111) !important; cursor: pointer;
	transition: color .25s ease, background-color .25s ease, border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
:is(#chc-top,body) .chc .chc-phone:hover{ opacity: 1; }
:is(#chc-top,body) .chc .chc-pi{ display: inline-flex; flex: none; align-items: center; justify-content: center; transition: transform .25s ease, background-color .25s ease; }
:is(#chc-top,body) .chc .chc-pi svg{ width: 1.15em; height: 1.15em; fill: none; stroke: var(--pa, var(--pc)); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
:is(#chc-top,body) .chc .chc-pt{ display: inline-flex; flex-direction: row; align-items: baseline; gap: .4em; }
:is(#chc-top,body) .chc .chc-pl{ font-size: .74em; font-weight: 500; opacity: .78; letter-spacing: .02em; }
:is(#chc-top,body) .chc .chc-pl.is-open, :is(#chc-top,body) .chc .chc-pl.is-closed{ display: inline-flex; align-items: center; gap: .4em; font-weight: 600; opacity: 1; }
:is(#chc-top,body) .chc .chc-pl.is-open{ color: var(--ho); }
:is(#chc-top,body) .chc .chc-pl.is-closed{ color: var(--hc); }
:is(#chc-top,body) .chc .chc-pl.is-open::before, :is(#chc-top,body) .chc .chc-pl.is-closed::before{ content: ""; width: .6em; height: .6em; border-radius: 50%; background: currentColor; }
:is(#chc-top,body) .chc .chc-pl.is-open::before{ animation: chc-ping 1.8s ease-out infinite; }

:is(#chc-top,body) .chc .p-plain:hover{ color: var(--pc) !important; }

:is(#chc-top,body) .chc .p-circle .chc-pi, :is(#chc-top,body) .chc .p-square .chc-pi{ width: 2.3em; height: 2.3em; background: var(--pc); }
:is(#chc-top,body) .chc .p-circle .chc-pi{ border-radius: 50%; }
:is(#chc-top,body) .chc .p-square .chc-pi{ border-radius: 10px; }
:is(#chc-top,body) .chc .p-circle .chc-pi svg, :is(#chc-top,body) .chc .p-square .chc-pi svg{ stroke: var(--pa, #fff); }
:is(#chc-top,body) .chc .p-circle:hover .chc-pi, :is(#chc-top,body) .chc .p-square:hover .chc-pi{ transform: scale(1.08) rotate(-8deg); }

:is(#chc-top,body) .chc .p-outline{ padding: .6em 1.15em; border: 2px solid var(--pc); border-radius: 999px; color: var(--pt, var(--pc)) !important; }
:is(#chc-top,body) .chc .p-outline:hover{ background: var(--pc); color: var(--pt, #fff) !important; }
:is(#chc-top,body) .chc .p-outline:hover .chc-pi svg{ stroke: var(--pa, #fff); }

:is(#chc-top,body) .chc .p-fill{ padding: .65em 1.2em; background: var(--pc); border-radius: 999px; color: var(--pt, #fff) !important; }
:is(#chc-top,body) .chc .p-fill .chc-pi svg{ stroke: var(--pa, currentColor); }
:is(#chc-top,body) .chc .p-fill:hover{ transform: translateY(-2px); box-shadow: 0 8px 18px -6px var(--pc); }

:is(#chc-top,body) .chc .p-stacked .chc-pt{ flex-direction: column; align-items: flex-start; gap: .1em; }
:is(#chc-top,body) .chc .p-stacked .chc-pl{ order: -1; }
:is(#chc-top,body) .chc .p-stacked .chc-pi{ width: 2.6em; height: 2.6em; border-radius: 50%; background: color-mix(in srgb, var(--pc) 14%, transparent); }
:is(#chc-top,body) .chc .p-stacked:hover .chc-pi{ background: var(--pc); }
:is(#chc-top,body) .chc .p-stacked:hover .chc-pi svg{ stroke: var(--pa, #fff); }

:is(#chc-top,body) .chc .p-underline{ padding-bottom: .2em; }
:is(#chc-top,body) .chc .p-underline::after{ content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--pc); transform: scaleX(.35); transform-origin: left; transition: transform .35s ease; }
:is(#chc-top,body) .chc .p-underline:hover::after{ transform: scaleX(1); }

:is(#chc-top,body) .chc .p-dot .chc-pi{ display: none; }
:is(#chc-top,body) .chc .p-dot::before{ content: ""; width: .62em; height: .62em; flex: none; border-radius: 50%; background: var(--pa, #22c55e); animation: chc-ping 1.8s ease-out infinite; }

:is(#chc-top,body) .chc .p-soft{ padding: .6em 1.15em; border-radius: 999px; background: color-mix(in srgb, var(--pc) 13%, transparent); color: var(--pt, var(--pc)) !important; }
:is(#chc-top,body) .chc .p-soft:hover{ background: var(--pc); color: var(--pt, #fff) !important; }
:is(#chc-top,body) .chc .p-soft:hover .chc-pi svg{ stroke: var(--pa, #fff); }

:is(#chc-top,body) .chc .p-glass{ padding: .6em 1.15em; border-radius: 999px; color: var(--pt, #fff) !important; background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .4); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
:is(#chc-top,body) .chc .p-glass .chc-pi svg{ stroke: var(--pa, currentColor); }
:is(#chc-top,body) .chc .p-glass:hover{ background: rgba(255, 255, 255, .3); }

:is(#chc-top,body) .chc .p-neon{ padding: .6em 1.15em; border-radius: 999px; background: #0b0b14; border: 2px solid var(--pc); color: var(--pt, var(--pc)) !important; text-shadow: 0 0 8px var(--pc); box-shadow: 0 0 10px var(--pc), inset 0 0 8px color-mix(in srgb, var(--pc) 35%, transparent); }
:is(#chc-top,body) .chc .p-neon:hover{ box-shadow: 0 0 22px var(--pc), 0 0 44px color-mix(in srgb, var(--pc) 60%, transparent); }

:is(#chc-top,body) .chc .p-ring .chc-pi{ width: 2.3em; height: 2.3em; border-radius: 50%; background: var(--pc); animation: chc-ringing 2.6s ease-in-out infinite; transform-origin: 50% 50%; }
:is(#chc-top,body) .chc .p-ring .chc-pi svg{ stroke: var(--pa, #fff); }

:is(#chc-top,body) .chc .p-box{ gap: 0; border: 2px solid var(--pc); border-radius: 10px; overflow: hidden; padding: 0 1em 0 0; }
:is(#chc-top,body) .chc .p-box .chc-pi{ align-self: stretch; padding: .55em .75em; margin-right: .75em; background: var(--pc); }
:is(#chc-top,body) .chc .p-box .chc-pi svg{ stroke: var(--pa, #fff); }
:is(#chc-top,body) .chc .p-box:hover{ box-shadow: 0 8px 18px -8px var(--pc); }

:is(#chc-top,body) .chc .p-divider .chc-pi{ display: none; }
:is(#chc-top,body) .chc .p-divider{ padding-left: .85em; border-left: 3px solid var(--pc); }
:is(#chc-top,body) .chc .p-divider .chc-pt{ flex-direction: column; align-items: flex-start; gap: .1em; }
:is(#chc-top,body) .chc .p-divider .chc-pl{ order: -1; }

/* Åbent / lukket-mærke ved telefonen */
:is(#chc-top,body) .chc .chc-open{ display: inline-flex; align-items: center; gap: .45em; font-size: calc(var(--pfs, 16px) * .74); font-weight: 600; line-height: 1; padding: .4em .8em; border-radius: 999px; background: color-mix(in srgb, var(--ho) 14%, #fff); color: var(--ho); white-space: nowrap; }
:is(#chc-top,body) .chc .chc-open.is-closed{ background: color-mix(in srgb, var(--hc) 14%, #fff); color: var(--hc); }
:is(#chc-top,body) .chc .chc-open::before{ content: ""; width: .6em; height: .6em; border-radius: 50%; background: currentColor; }
:is(#chc-top,body) .chc .chc-open.is-open::before{ animation: chc-ping 1.8s ease-out infinite; }

@keyframes chc-ping { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, currentColor 55%, transparent); } 100% { box-shadow: 0 0 0 .6em transparent; } }
@keyframes chc-ringing { 0%, 60%, 100% { transform: rotate(0); } 5%, 15%, 25% { transform: rotate(-14deg); } 10%, 20%, 30% { transform: rotate(14deg); } }

/* ====================================================================
   KUN COMPUTER: skjult på skærme op til 980 px (Divis mobil-/tablet-menu)
   ==================================================================== */
@media (max-width: 980px) {
	body:not(.chc-admin-page) .chc-item{ display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
	:is(#chc-top,body) .chc .chc-pl::before, :is(#chc-top,body) .chc .chc-open::before, :is(#chc-top,body) .chc .p-dot::before, :is(#chc-top,body) .chc .p-ring .chc-pi{ animation: none !important; }
}
