/**
 * Glimts Nissedörr – formgivning
 * Placering: wp-content/themes/jultomten-child/assets/css/nissedorr.css
 */

.nd {
	--nd-natt: var(--jt-night, #061426);
	--nd-blaa: var(--jt-blue, #0d2e4c);
	--nd-guld: var(--jt-gold, #ffd976);
	--nd-guld-djup: var(--jt-gold-deep, #d8a52d);
	--nd-rod: var(--jt-red, #e52636);
	--nd-gron: var(--jt-green, #0c5a46);
	--nd-is: var(--jt-ice, #e8f7ff);
	--nd-cream: var(--jt-cream, #fff9e8);

	max-width: 62rem;
	margin: 0 auto;
	padding: 1rem;
	color: var(--nd-is);
}

/* ---------- Hero ---------- */

.nd-hero { text-align: center; padding: 1.5rem 0 0.5rem; }
.nd-kicker {
	letter-spacing: .18em; text-transform: uppercase;
	font-size: .8rem; color: var(--nd-guld); margin: 0 0 .4rem;
}
.nd-titel { margin: 0 0 .5rem; line-height: 1.15; color: var(--nd-cream); }
.nd-lock { margin: 0; font-style: italic; color: var(--nd-is); opacity: .85; }

.nd-testbanner {
	background: var(--nd-rod); color: #fff; border-radius: .6rem;
	padding: .6rem .9rem; font-size: .9rem; margin: 0 0 1rem;
}
.nd-testbanner code { background: rgba(0,0,0,.25); padding: .1rem .35rem; border-radius: .25rem; }

/* ---------- Stängt läge ---------- */

.nd-stangd {
	text-align: center; padding: 2.5rem 1rem;
	background: rgba(255,255,255,.05); border-radius: 1.2rem;
	border: 1px solid rgba(255,217,118,.25);
}
.nd-dorr-stangd {
	width: 88px; height: 132px; margin: 0 auto 1rem;
	border-radius: 44px 44px 8px 8px;
	background: linear-gradient(180deg, #8a3b2a, #5d2317);
	box-shadow: inset 0 0 0 6px rgba(255,217,118,.35);
}

/* ---------- Dagväljare ---------- */

.nd-dagar {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(2.3rem, 1fr));
	gap: .4rem; margin: 1rem 0 1.5rem;
}
.nd-dagknapp {
	aspect-ratio: 1; border-radius: .7rem; border: 1px solid rgba(255,217,118,.35);
	background: rgba(255,255,255,.06); color: var(--nd-cream);
	font-weight: 700; font-size: .95rem; line-height: 1; padding: 0; cursor: pointer;
	transition: transform .15s ease, background .15s ease;
}
.nd-dagknapp:hover:not(:disabled) { transform: translateY(-2px); background: rgba(255,217,118,.2); }
.nd-dagknapp.nd-aktiv { background: var(--nd-guld); color: var(--nd-natt); border-color: var(--nd-guld); }
.nd-dagknapp.nd-avklarad:not(.nd-aktiv) { border-color: var(--nd-gron); background: rgba(12,90,70,.45); }
.nd-dagknapp.nd-last { opacity: .3; cursor: not-allowed; }

/* ---------- Dagkort ---------- */

.nd-dagkort {
	background: rgba(13,46,76,.55); border: 1px solid rgba(255,217,118,.25);
	border-radius: 1.2rem; padding: 1.4rem; box-shadow: var(--jt-shadow, 0 24px 70px rgba(0,0,0,.34));
}
.nd-dagnr { margin: 0; font-size: .85rem; letter-spacing: .12em; text-transform: uppercase; color: var(--nd-guld); }
.nd-dagtitel { margin: .2rem 0 1rem; color: var(--nd-cream); }
.nd-scentext { line-height: 1.65; }
.nd-tidigare {
	background: rgba(12,90,70,.35); border-radius: .7rem;
	padding: .6rem .9rem; font-size: .95rem; margin: 1rem 0 0;
}

/* ---------- Nyckelstatus ---------- */

.nd-nyckelstatus {
	display: flex; align-items: center; gap: 1rem;
	background: rgba(0,0,0,.22); border-radius: 1rem; padding: .8rem 1rem; margin: 0 0 1rem;
}
.nd-nyckelbild { width: 72px; flex: 0 0 72px; }
.nd-nyckelrubrik { margin: 0; font-weight: 700; color: var(--nd-guld); }
.nd-nyckelrad { margin: .15rem 0 0; font-size: .95rem; }
.nd-nyckel-ny { animation: nd-puls 1.2s ease; }

@keyframes nd-puls {
	0% { box-shadow: 0 0 0 0 rgba(255,217,118,.6); }
	100% { box-shadow: 0 0 0 22px rgba(255,217,118,0); }
}

/* ---------- Nyckel-SVG ---------- */

.nd-svg-nyckel { width: 100%; height: auto; display: block; }
.nd-mass { fill: var(--nd-guld-djup); }
.nd-hal { fill: var(--nd-natt); }
.nd-stjarna { fill: var(--nd-guld); }
.nd-13 { fill: var(--nd-natt); font-size: 26px; font-weight: 700; font-family: inherit; }
.nd-tagg-pa { fill: var(--nd-guld); }
.nd-tagg-tom { fill: rgba(255,255,255,.22); }

/* ---------- Ljud ---------- */

.nd-ljudbox { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1.2rem 0 .6rem; }
.nd-knapp {
	border: 0; border-radius: 999px; padding: .7rem 1.3rem;
	background: var(--nd-rod); color: #fff; font-weight: 700; font-size: 1rem; cursor: pointer;
}
.nd-knapp:hover { filter: brightness(1.1); }
.nd-knapp-lugn { background: rgba(255,255,255,.14); color: var(--nd-cream); }
.nd-ljudtext {
	margin: 0 0 1rem; padding: .9rem 1.1rem; border-left: 4px solid var(--nd-guld);
	background: rgba(0,0,0,.2); border-radius: 0 .7rem .7rem 0; font-style: italic; line-height: 1.6;
}

/* ---------- Uppdrag ---------- */

.nd-uppdragsbox {
	margin-top: 1.4rem; padding-top: 1.2rem; border-top: 1px dashed rgba(255,217,118,.3);
}
.nd-uppdragsrubrik { margin: 0 0 .3rem; color: var(--nd-guld); }
.nd-instruktion { margin: 0 0 1rem; line-height: 1.6; }
.nd-raknare { margin: .8rem 0 0; font-weight: 700; }
.nd-hjalptext { margin: .2rem 0 0; opacity: .8; font-size: .95rem; }

/* Knacka */

.nd-knacka { text-align: center; }
.nd-dorrknapp {
	background: none; border: 0; cursor: pointer; width: 150px; padding: 0;
}
.nd-dorrknapp:disabled { cursor: default; opacity: .85; background: transparent; }
.nd-svg-dorr { width: 100%; height: auto; }
.nd-dorr-blad { fill: #8a3b2a; }
.nd-dorr-fyll { fill: #a4482f; }
.nd-dorr-vred { fill: var(--nd-guld); }
.nd-dorr-linje { fill: rgba(0,0,0,.25); }
.nd-skakar { animation: nd-skak .28s ease; }

@keyframes nd-skak {
	0%,100% { transform: translateX(0); }
	30% { transform: translateX(-4px); }
	60% { transform: translateX(4px); }
}

/* Hitta i bild */

.nd-scen { position: relative; max-width: 320px; margin: 0 auto; transition: transform .5s ease; }
.nd-scen.nd-vand { transform: rotateY(180deg); }
.nd-hotspots { position: absolute; inset: 0; }
.nd-hotspot {
	position: absolute; transform: translate(-50%, -50%);
	border-radius: 50%; border: 2px dashed rgba(255,217,118,.55);
	background: rgba(255,217,118,.08); cursor: pointer;
}
.nd-hotspot:hover { background: rgba(255,217,118,.25); }
.nd-hotspot.nd-hittad { border-style: solid; border-color: var(--nd-guld); background: rgba(255,217,118,.4); }
.nd-fyndlista { margin: .6rem 0 0; padding-left: 1.2rem; }
.nd-funnen { color: var(--nd-guld); }

/* Välj rätt */

.nd-fraga { font-weight: 700; margin: 0 0 .8rem; }
.nd-alternativ { display: grid; gap: .7rem; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); }
.nd-alt {
	display: flex; flex-direction: column; align-items: center; gap: .4rem;
	padding: 1rem .8rem; border-radius: 1rem; cursor: pointer;
	border: 2px solid rgba(255,217,118,.3); background: rgba(255,255,255,.06);
	color: var(--nd-cream); font-size: 1rem; text-align: center;
}
.nd-alt:hover { background: rgba(255,217,118,.16); }
.nd-alt.nd-spelar { border-color: var(--nd-guld); animation: nd-puls 1.6s ease; }
.nd-alt.nd-ratt { border-color: var(--nd-gron); background: rgba(12,90,70,.5); }
.nd-alt.nd-fel { border-color: var(--nd-rod); }
.nd-lyssna { font-size: .8rem; opacity: .75; }
.nd-ledtrad {
	margin: .9rem 0 0; padding: .7rem .9rem; border-radius: .7rem;
	background: rgba(255,217,118,.14); border: 1px solid rgba(255,217,118,.35);
}

/* Para ihop */

.nd-kallor, .nd-mal { display: grid; gap: .7rem; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); }
.nd-pil { text-align: center; font-size: 1.6rem; color: var(--nd-guld); margin: .7rem 0; }
.nd-kort, .nd-plats {
	display: flex; flex-direction: column; align-items: center; gap: .4rem;
	padding: .9rem .6rem; border-radius: 1rem; cursor: pointer;
	border: 2px solid rgba(255,217,118,.3); background: rgba(255,255,255,.06);
	color: var(--nd-cream); font-size: .95rem; text-align: center;
}
.nd-plats { border-style: dashed; }
.nd-kort:hover, .nd-plats:hover { background: rgba(255,217,118,.16); }
.nd-kort.nd-vald { border-color: var(--nd-guld); background: rgba(255,217,118,.3); }
.nd-kort.nd-placerad { opacity: .4; cursor: default; }
.nd-plats.nd-over { border-color: var(--nd-guld); }
.nd-plats.nd-fylld { border-style: solid; border-color: var(--nd-gron); background: rgba(12,90,70,.5); }
.nd-plats.nd-fel { border-color: var(--nd-rod); }

.nd-ikon { width: 40px; height: 40px; fill: var(--nd-guld); stroke: var(--nd-guld); }
.nd-ikon-hal { fill: var(--nd-natt); stroke: none; }

/* ---------- Resultat ---------- */

.nd-resultat:empty { display: none; }
.nd-resultat {
	margin-top: 1.2rem; padding: 1rem 1.2rem; border-radius: 1rem;
	background: rgba(12,90,70,.4); border: 1px solid rgba(255,217,118,.35);
}
.nd-klartext { margin: 0 0 .5rem; font-weight: 700; color: var(--nd-guld); }
.nd-belon { margin: 0 0 .5rem; }
.nd-stampel {
	display: inline-block; margin: .2rem 0 .8rem; padding: .35rem .9rem;
	border: 2px dashed var(--nd-guld); border-radius: 999px;
	color: var(--nd-guld); font-weight: 700; transform: rotate(-2deg);
}
.nd-imorgon { margin: .8rem 0; font-style: italic; opacity: .9; }

/* ---------- Övrigt ---------- */

.nd-ljudval {
	display: block; margin: 1.2rem auto 0; padding: .5rem 1rem;
	border-radius: 999px; border: 1px solid rgba(255,255,255,.3);
	background: none; color: var(--nd-is); font-size: .9rem; cursor: pointer;
}
.nd-laddar { text-align: center; opacity: .7; }
.nd-noscript { background: rgba(229,38,54,.2); padding: 1rem; border-radius: .8rem; }
.nd-vantar { text-align: center; padding: 2rem 1rem; }
.nd-foralder { margin-top: 2rem; text-align: center; font-size: .9rem; opacity: .75; }
.nd-foralder a { color: var(--nd-is); }

/* ---------- Tillgänglighet ---------- */

.nd button:focus-visible,
.nd a:focus-visible {
	outline: 3px solid var(--nd-guld);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.nd *, .nd *::before, .nd *::after {
		animation-duration: .001ms !important;
		transition-duration: .001ms !important;
	}
}

@media (max-width: 40rem) {
	.nd-dagkort { padding: 1rem; }
	.nd-nyckelstatus { flex-direction: column; text-align: center; }
	.nd-nyckelbild { width: 90px; flex-basis: auto; }
}

/* Överstyr temats knappstilar (GeneratePress) */
.nd .nd-dagknapp {
	padding: 0;
	font-size: .95rem;
	line-height: 1;
	min-height: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}
.nd .nd-dorrknapp,
.nd .nd-dorrknapp:disabled,
.nd .nd-dorrknapp:hover {
	background: transparent;
	padding: 0;
}
.nd .nd-hotspot { padding: 0; }
.nd .nd-alt, .nd .nd-kort, .nd .nd-plats { padding: 1rem .8rem; }

/* ============================================================
 * Etapp 2 – sekvens, spår, ringar, lager, skillnader
 * ========================================================== */

.nd-svg-scen { width: 100%; height: auto; display: block; border-radius: .9rem; }
.nd-scen-bred { max-width: 480px; }
.nd-vagg { fill: #123152; }
.nd-golv { fill: #0a1f36; }
.nd-karta { fill: #14304d; }
.nd-spar { fill: rgba(232,247,255,.72); }
.nd-trad-rod { stroke: var(--nd-rod); stroke-width: 5; stroke-linecap: round; }
.nd-trad-bla { stroke: #4f7fbf; stroke-width: 4; stroke-linecap: round; opacity: .8; }
.nd-trad-gron { stroke: #3f8f70; stroke-width: 4; stroke-linecap: round; opacity: .8; }
.nd-dorrpunkt { fill: var(--nd-guld); }
.nd-vaska { fill: #8a5a34; }
.nd-rem { fill: #5d3b20; }
.nd-ficka { fill: #2f7d5c; }
.nd-hjarta { fill: var(--nd-rod); }
.nd-mossa { fill: var(--nd-rod); }
.nd-brev { fill: var(--nd-cream); }

/* Sekvens */

.nd-prickar { display: flex; gap: .45rem; justify-content: center; margin: .9rem 0; }
.nd-prick {
	width: .85rem; height: .85rem; border-radius: 50%;
	border: 2px solid rgba(255,217,118,.5);
}
.nd-prick-fylld { background: var(--nd-guld); border-color: var(--nd-guld); }
.nd-tonknapp { transition: background-color .2s ease, transform .2s ease; }
.nd-blink { transform: scale(1.06); }
.nd-sekvens > .nd-knapp { display: block; margin: 0 auto; }

/* Spår */

.nd-nod {
	position: absolute; transform: translate(-50%, -50%);
	width: 2rem; height: 2rem; border-radius: 50%;
	border: 3px solid var(--nd-cream); background: rgba(6,20,38,.75);
	cursor: pointer; padding: 0;
}
.nd-nod:hover { background: rgba(255,217,118,.35); }
.nd-nod-klar { background: var(--nd-guld); border-color: var(--nd-guld); }
.nd-nod-fel { border-color: var(--nd-rod); }
.nd-nodnamn {
	position: absolute; left: 50%; top: 115%; transform: translateX(-50%);
	white-space: nowrap; font-size: .7rem; color: var(--nd-is);
	background: rgba(6,20,38,.85); padding: .1rem .4rem; border-radius: .3rem;
}
.nd-hotspot-fel { border-style: dotted; }

/* Ringar */

.nd-ringrad { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.nd-ring {
	width: 7rem; height: 7rem; border-radius: 50%;
	border: 4px solid rgba(6,20,38,.5); cursor: pointer;
	color: #061426; font-weight: 700; font-size: .8rem; padding: .4rem;
	display: flex; align-items: center; justify-content: center; text-align: center;
}
.nd-ring:disabled { cursor: default; }

/* Lager */

.nd-hog { display: flex; flex-direction: column; gap: .25rem; margin: 0 0 1rem; }
.nd-hog:empty { display: none; }
.nd-skiva {
	padding: .5rem .8rem; border-radius: .5rem; color: #061426;
	font-weight: 700; font-size: .9rem; text-align: center;
}

/* Skillnader */

.nd-bildpar { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); }
.nd-bild { margin: 0; }
.nd-bild figcaption { text-align: center; font-size: .85rem; opacity: .8; margin-top: .4rem; }
.nd-missyta {
	position: absolute; inset: 0; width: 100%; height: 100%;
	background: none; border: 0; cursor: pointer; z-index: -1; padding: 0;
}
.nd-skillnader .nd-hotspots { z-index: 1; }

/* ============================================================
 * Etapp 3 – balans, fritt val, mönster, provet, finalen
 * ========================================================== */

.nd-hjarta-fylld { fill: var(--nd-rod); }
.nd-hjarta-tom { fill: none; stroke: rgba(6,20,38,.55); stroke-width: 3; stroke-dasharray: 5 4; }
.nd-nyckelhjarta { color: var(--nd-guld); font-weight: 700; }

.nd-morker { fill: #05101f; }
.nd-stig { stroke: rgba(255,217,118,.45); stroke-width: 6; stroke-linecap: round; }
.nd-stig-fel { stroke: rgba(255,255,255,.1); stroke-width: 5; stroke-linecap: round; }
.nd-stjarnpunkt { fill: var(--nd-guld); }

/* Balansvågen */

.nd-vag { padding: .5rem 0 1.4rem; }
.nd-balk {
	display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;
	transition: transform .45s ease; transform-origin: center;
}
.nd-skal {
	border: 2px dashed rgba(255,217,118,.4); border-radius: 1rem;
	background: rgba(255,255,255,.05); color: var(--nd-cream);
	padding: .8rem .6rem; min-height: 7rem; cursor: pointer;
	display: flex; flex-direction: column; gap: .4rem; align-items: center;
}
.nd-skal:hover { background: rgba(255,217,118,.15); }
.nd-skaltitel { font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: .75rem; }
.nd-skallista { display: flex; flex-wrap: wrap; gap: .3rem; justify-content: center; }
.nd-paketchip {
	display: inline-block; border-radius: .4rem; padding: .2rem .5rem;
	font-size: .75rem; background: var(--nd-guld-djup); color: #061426;
}
.nd-paket-stor { border-width: 3px; font-size: 1rem; }
.nd-paket-mellan { font-size: .92rem; }
.nd-paket-liten { font-size: .8rem; }
.nd-kort.nd-paket-stor { padding: 1.3rem .8rem; }
.nd-kort.nd-paket-liten { padding: .6rem .6rem; }

.nd-matare {
	position: relative; height: .6rem; border-radius: 999px;
	background: rgba(255,255,255,.14); margin: 0 0 1.2rem;
}
.nd-visare {
	position: absolute; top: -.35rem; width: 1.3rem; height: 1.3rem;
	border-radius: 50%; background: var(--nd-guld);
	transform: translateX(-50%); transition: left .45s ease;
}

/* Färgmönster */

.nd-monsterrad {
	margin: 0 0 1.2rem; padding: .8rem; border-radius: 1rem;
	background: rgba(0,0,0,.2);
}
.nd-monsterrad.nd-rad-klar { background: rgba(12,90,70,.4); }
.nd-remsa { display: flex; gap: .35rem; justify-content: center; margin-bottom: .7rem; flex-wrap: wrap; }
.nd-ruta {
	width: 2.2rem; height: 2.2rem; border-radius: .45rem;
	display: flex; align-items: center; justify-content: center;
	font-weight: 700; color: var(--nd-cream);
}
.nd-ruta-tom { border: 2px dashed rgba(255,217,118,.6); background: none; }
.nd-fargval { display: flex; gap: .5rem; justify-content: center; flex-wrap: wrap; }
.nd-fargknapp {
	width: 3.6rem; height: 2.6rem; border-radius: .5rem;
	border: 2px solid rgba(6,20,38,.4); cursor: pointer; padding: 0;
	display: flex; align-items: flex-end; justify-content: center;
}
.nd-fargknapp:disabled { opacity: .45; cursor: default; }
.nd-fargnamn { font-size: .65rem; color: #061426; font-weight: 700; padding-bottom: .15rem; }
.nd-fargknapp.nd-fel { border-color: var(--nd-rod); }

/* Tända ljus i rad */

.nd-hog-rad { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: .5rem; }
.nd-hog-rad .nd-skiva { flex: 0 1 auto; }

/* Provet */

.nd-hjartsteg { margin-top: 1.2rem; text-align: center; }
.nd-hjartknapp {
	background: none; border: 0; cursor: pointer; width: 4.5rem; padding: 0;
	margin: .6rem auto 0; display: block;
}
.nd-hjartknapp svg { width: 100%; height: auto; fill: var(--nd-rod); }
.nd-hjartknapp:disabled { opacity: .35; cursor: default; }
.nd-hjartknapp:hover:not(:disabled) svg { transform: scale(1.08); transition: transform .2s ease; }

/* Finalen och diplomet */

.nd-final { text-align: center; }
.nd-final .nd-scen { margin-top: 1rem; max-width: 220px; }
.nd-diplomomrade { margin-top: 1.5rem; }
.nd-diplom {
	background: var(--nd-cream); color: #20302a;
	border: 6px double var(--nd-guld-djup); border-radius: 1rem;
	padding: 1.6rem 1.2rem; text-align: center;
}
.nd-diplomkicker {
	margin: 0; letter-spacing: .2em; text-transform: uppercase;
	font-size: .7rem; color: #7a5a1a;
}
.nd-diplomrubrik { margin: .4rem 0 1rem; color: #8a2a1e; }
.nd-diplomnamn {
	min-height: 2rem; margin: 0 0 .6rem; font-size: 1.6rem; font-weight: 700;
	border-bottom: 2px solid rgba(0,0,0,.15); display: inline-block; min-width: 60%;
}
.nd-diplomnamn:empty::after { content: ' '; }
.nd-diplomtext { margin: 0 0 1rem; }
.nd-diplomdatum { margin: 0; font-size: .85rem; opacity: .7; }
.nd-diplomfalt { margin: 1rem 0; text-align: left; }
.nd-diplometikett { display: block; font-size: .85rem; margin-bottom: .3rem; }
.nd-namninput {
	width: 100%; padding: .6rem .8rem; border-radius: .6rem;
	border: 1px solid rgba(255,255,255,.3);
	background: rgba(255,255,255,.08); color: var(--nd-is); font-size: 1rem;
}

/* ---------- Diplomet ---------- */

.nd-utskrift { display: none; }

.nd .nd-diplom {
	background: var(--nd-cream);
	color: #20302a;
	border: 3px solid #a8822c;
	border-radius: .5rem;
	padding: .55rem;
}
.nd .nd-diplomram {
	border: 1px solid #c8a94e;
	border-radius: .3rem;
	padding: 2.2rem 1.6rem 1.8rem;
	text-align: center;
}
.nd-diplomstjarna { width: 2.6rem; margin: 0 auto .6rem; }
.nd-diplomstjarna svg { width: 100%; height: auto; fill: #c8a94e; }
.nd .nd-diplom .nd-diplomkicker {
	margin: 0; letter-spacing: .28em; text-transform: uppercase;
	font-size: .68rem; color: #7a5a1a;
}
.nd .nd-diplom .nd-diplomrubrik {
	margin: .5rem 0 .1rem; color: #8a2a1e;
	font-size: 2.6rem; line-height: 1; letter-spacing: .04em;
}
.nd .nd-diplom .nd-diplomunder {
	margin: 0 0 1.4rem; color: #6a4a12;
	font-size: 1rem; letter-spacing: .06em;
}
.nd .nd-diplom .nd-diplomnamn {
	min-height: 2.6rem; margin: 0 auto .9rem; padding-bottom: .3rem;
	font-size: 2rem; font-weight: 700; color: #20302a;
	border-bottom: 1px solid rgba(0,0,0,.2);
	display: block; max-width: 22rem;
}
.nd .nd-diplom .nd-diplomtext {
	margin: 0 auto 1rem; max-width: 30rem; line-height: 1.65; color: #20302a;
}
.nd .nd-diplom .nd-diplommotto {
	margin: 0 0 1.2rem; font-style: italic; color: #6a4a12;
}
.nd-diplomnyckel { width: 4.4rem; margin: 0 auto 1.2rem; }
.nd-diplomsign {
	display: flex; justify-content: center; gap: 3rem; flex-wrap: wrap;
	margin: 0 0 1.2rem;
}
.nd-signfalt { min-width: 8rem; }
.nd .nd-diplom .nd-signnamn {
	margin: 0; padding-bottom: .2rem; color: #8a2a1e;
	font-size: 1.1rem; font-weight: 700;
	border-bottom: 1px solid rgba(0,0,0,.25);
}
.nd .nd-diplom .nd-signtitel {
	margin: .25rem 0 0; font-size: .78rem; color: #4a5a50;
	letter-spacing: .08em; text-transform: uppercase;
}
.nd .nd-diplom .nd-diplomdatum {
	margin: 0; font-size: .82rem; color: #4a5a50; letter-spacing: .06em;
}

@media (max-width: 40rem) {
	.nd .nd-diplomram { padding: 1.6rem 1rem 1.4rem; }
	.nd .nd-diplom .nd-diplomrubrik { font-size: 2rem; }
	.nd .nd-diplom .nd-diplomnamn { font-size: 1.5rem; }
	.nd-diplomsign { gap: 1.4rem; }
}

@media print {
	@page { size: A4 portrait; margin: 14mm; }
	html, body { background: #fff !important; height: auto !important; }
	body > *:not(.nd-utskrift) { display: none !important; }
	.nd-utskrift { display: block !important; }
	.nd-utskrift .nd-diplom {
		background: #fff;
		border-color: #8a6a1a;
		break-inside: avoid;
		page-break-inside: avoid;
	}
	.nd-utskrift .nd-diplomram { border-color: #a8822c; }
}