/* Evirht Snabbverktyg */
.evirht-verktyg {
	background: #14171A;
	color: #F4F1EA;
	border-radius: 16px;
	padding: 3rem;
	margin: 3rem 0;
}
.evirht-verktyg__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 3rem;
	align-items: start;
}
.evirht-verktyg__etikett {
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #E3B57A;
	margin: 0 0 0.75rem;
}
.evirht-verktyg__etikett--morkt { color: #7A5214; }
.evirht-verktyg__rubrik {
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 2.25rem;
	line-height: 1.1;
	margin: 0 0 0.75rem;
	color: #FFFFFF;
}
.evirht-verktyg__ingress { margin: 0 0 0.75rem; color: #D6D1C6; }
.evirht-verktyg__rakning {
	margin: 0 0 2rem;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #C08A2E;
}
.evirht-verktyg__falt { border: 0; margin: 0 0 1.75rem; padding: 0; }
.evirht-verktyg__falt legend { font-weight: 600; margin-bottom: 0.75rem; padding: 0; }
.evirht-verktyg__knappar { display: flex; flex-wrap: wrap; gap: 0.625rem; }
.evirht-verktyg__knapp {
	font: inherit;
	font-size: 0.9375rem;
	min-height: 46px;
	padding: 0.75rem 1.125rem;
	border-radius: 999px;
	border: 1px solid #5A5F67;
	background: transparent;
	color: #F4F1EA;
	cursor: pointer;
}
.evirht-verktyg__knapp:hover { border-color: #C08A2E; }
.evirht-verktyg__knapp[aria-pressed="true"] {
	background: #C08A2E;
	border-color: #C08A2E;
	color: #14171A;
	font-weight: 600;
}
.evirht-verktyg__resultat {
	background: #F4F1EA;
	color: #14171A;
	border-radius: 12px;
	padding: 2rem;
	min-height: 420px;
}
.evirht-verktyg__vanta {
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 1.5rem;
	margin: 0 0 0.5rem;
}
.evirht-verktyg__kvar { color: #55524B; margin: 0; }
.evirht-verktyg__slutsats {
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 1.5rem;
	line-height: 1.3;
	margin: 0 0 1.25rem;
}
.evirht-verktyg__steg { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.75rem; }
.evirht-verktyg__steg li {
	display: flex;
	gap: 1rem;
	background: #FFFFFF;
	border: 1px solid #EDE4D3;
	border-radius: 12px;
	padding: 1rem;
}
.evirht-verktyg__nr {
	flex-shrink: 0;
	width: 34px; height: 34px;
	border-radius: 50%;
	background: #7A5214;
	color: #FFFFFF;
	display: flex; align-items: center; justify-content: center;
	font-weight: 600;
}
.evirht-verktyg__stegtext { display: flex; flex-direction: column; gap: 0.25rem; }
.evirht-verktyg__varfor { color: #2E3238; font-size: 0.9375rem; }
.evirht-verktyg__tagg {
	align-self: flex-start;
	font-size: 0.75rem;
	font-weight: 600;
	color: #7A5214;
	background: #F5EEE1;
	padding: 0.25rem 0.625rem;
	border-radius: 999px;
}
.evirht-verktyg__tips { font-size: 0.9375rem; }
.evirht-verktyg__byraer { border-top: 1px solid #EDE4D3; margin-top: 1.25rem; padding-top: 1.125rem; }
.evirht-verktyg__byrarubrik { font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.25rem; margin: 0 0 0.75rem; }
.evirht-verktyg__byra { background: #FFFFFF; border: 1px solid #EDE4D3; border-radius: 12px; padding: 1rem; margin-bottom: 0.75rem; }
.evirht-verktyg__byratopp { display: flex; justify-content: space-between; gap: 0.75rem; align-items: center; }
.evirht-verktyg__byratext { font-size: 0.9375rem; margin: 0.5rem 0; }
.evirht-verktyg__byrataggar { display: flex; flex-wrap: wrap; gap: 0.5rem; font-size: 0.75rem; }
.evirht-verktyg__byrataggar span { background: #F5EEE1; padding: 0.25rem 0.625rem; border-radius: 999px; }
.evirht-verktyg__not { font-size: 0.8125rem; color: #55524B; margin: 0; }

/* Jämförelsen med och utan målgruppsförståelse */
.evirht-varde {
	background: #FFFFFF;
	border: 1px solid #EDE4D3;
	border-radius: 16px;
	padding: 3rem;
	margin: 3rem 0;
}
.evirht-varde__topp { display: flex; justify-content: space-between; align-items: flex-end; gap: 2rem; flex-wrap: wrap; }
.evirht-varde__rubrik { font-family: "Cormorant Garamond", Georgia, serif; font-size: 2.5rem; line-height: 1.1; margin: 0 0 0.5rem; }
.evirht-varde__ingress { margin: 0; max-width: 40em; color: #2E3238; }
.evirht-varde__vaxel { display: flex; gap: 0.25rem; background: #F4F1EA; border: 1px solid #EDE4D3; border-radius: 999px; padding: 0.3rem; }
.evirht-varde__vaxelknapp {
	font: inherit; font-size: 0.9375rem; font-weight: 600;
	min-height: 46px; padding: 0.625rem 1.25rem;
	border: 0; border-radius: 999px; background: transparent; color: #14171A; cursor: pointer;
}
.evirht-varde__vaxelknapp[aria-pressed="true"] { background: #14171A; color: #FFFFFF; }
.evirht-varde__kropp { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 2.5rem; align-items: center; margin-top: 2rem; }
.evirht-varde__bild { margin: 0; }
.evirht-varde__lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.evirht-varde__rad {
	background: #FBF7F1; border: 1px solid #E8DCCB; border-radius: 12px; padding: 1.125rem 1.25rem;
	display: flex; flex-direction: column; gap: 0.375rem;
	transition: background .25s ease, border-color .25s ease;
}
.evirht-varde__rad[data-lage="med"] { background: #F5EEE1; border-color: #E6D9BF; }
.evirht-varde__funktion { font-size: 0.75rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: #B5702A; }
.evirht-varde__rad[data-lage="med"] .evirht-varde__funktion { color: #7A5214; }
.evirht-varde__beskrivning { font-size: 1rem; line-height: 1.5; }

@media (max-width: 781px) {
	.evirht-verktyg, .evirht-varde { padding: 1.75rem; border-radius: 12px; }
	.evirht-verktyg__grid { grid-template-columns: 1fr; gap: 2rem; }
	.evirht-verktyg__resultat { min-height: 0; }
	.evirht-varde__kropp { grid-template-columns: 1fr; gap: 1.5rem; }
	.evirht-varde__lista { grid-template-columns: 1fr; }
	.evirht-varde__rubrik { font-size: 1.875rem; }
}

/* =========================================================
   Metodsidor: planband, arbetsgång, mallar
   ========================================================= */

/* --- Planbandet högst upp och rutan längst ned --- */
.evirht-plan,
.evirht-plan-slut {
	background: #14171A;
	color: #F4F1EA;
	border-radius: 14px;
	padding: 1.5rem 1.75rem;
	margin: 0 0 2.5rem;
}
.evirht-plan-slut { margin: 3rem 0 0; padding: 2rem 1.75rem; }
.evirht-plan[hidden] { display: none; }

.evirht-plan__topp {
	display: flex; justify-content: space-between; align-items: baseline;
	gap: 1rem; flex-wrap: wrap; margin-bottom: 1.1rem;
}
.evirht-plan__etikett {
	font-size: 0.75rem; font-weight: 600; letter-spacing: 0.14em;
	text-transform: uppercase; color: #C08A2E; margin: 0;
}
.evirht-plan__andra, .evirht-plan__vidare { color: #E3B57A; font-size: 0.875rem; }
.evirht-plan__andra:hover, .evirht-plan__vidare:hover { color: #FFFFFF; }

.evirht-plan__spar {
	list-style: none; margin: 0 0 1.1rem; padding: 0;
	display: flex; flex-wrap: wrap; gap: 0.5rem;
}
.evirht-plan__steg {
	display: flex; align-items: center; gap: 0.6rem;
	border: 1px solid #2E3238; border-radius: 999px;
	padding: 0.45rem 1rem 0.45rem 0.5rem;
	background: transparent;
}
.evirht-plan__steg[data-lage="nu"] { border-color: #C08A2E; background: rgba(192,138,46,0.12); }
.evirht-plan__steg[data-lage="klar"] { opacity: 0.62; }
.evirht-plan__nr {
	flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	font-size: 0.8125rem; font-weight: 600;
	background: #2E3238; color: #D6D1C6;
}
.evirht-plan__steg[data-lage="nu"] .evirht-plan__nr { background: #C08A2E; color: #14171A; }
.evirht-plan__steg[data-lage="klar"] .evirht-plan__nr { background: #7A5214; color: #FFFFFF; }
.evirht-plan__namn { font-size: 0.9375rem; color: #F4F1EA; text-decoration: none; }
a.evirht-plan__namn:hover { color: #E3B57A; }
.evirht-plan__status { margin: 0; font-size: 0.9375rem; color: #A8A49B; }

.evirht-plan-slut__text { margin: 0.5rem 0 1.25rem; color: #D6D1C6; max-width: 46em; }
.evirht-plan-slut__reserv p { margin: 0.5rem 0 1rem; color: #D6D1C6; max-width: 46em; }
.evirht-plan-slut__reserv .evirht-etikett { color: #C08A2E; }
.evirht-plan-slut__knappar { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; }
.evirht-plan__knapp {
	font: inherit; font-size: 0.9375rem; font-weight: 600;
	display: inline-block; min-height: 48px; padding: 0.8rem 1.4rem;
	border: 1px solid #C08A2E; border-radius: 999px;
	background: #C08A2E; color: #14171A; cursor: pointer; text-decoration: none;
}
.evirht-plan__knapp:hover { background: #E3B57A; border-color: #E3B57A; color: #14171A; }
.evirht-plan__knapp--tunn { background: transparent; color: #E3B57A; }
.evirht-plan__knapp--tunn:hover { background: rgba(192,138,46,0.16); color: #FFFFFF; }

/* --- Faktaremsan under rubriken --- */
.evirht-fakta {
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
	border-top: 1px solid #E3D8C2; border-bottom: 1px solid #E3D8C2;
	margin: 2rem 0 2.5rem;
}
.evirht-fakta > * { padding: 1.25rem 1.5rem 1.25rem 0; border-right: 1px solid #EDE4D3; }
.evirht-fakta > *:last-child { border-right: 0; }
.evirht-fakta > * + * { padding-left: 1.5rem; }
.evirht-fakta__etikett {
	font-size: 0.6875rem !important; font-weight: 600; letter-spacing: 0.14em;
	text-transform: uppercase; color: #B5702A; margin: 0 0 0.4rem !important;
}
.evirht-fakta__varde {
	margin: 0 !important; font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 1.5rem !important; line-height: 1.2; color: #14171A;
}

/* --- Arbetsgången: numrerad kolumn med linje --- */
.evirht-arbetsgang { list-style: none; margin: 0; padding: 0; counter-reset: steg; }
.evirht-arbetsgang > li {
	position: relative; counter-increment: steg;
	padding: 0 0 2.5rem 4.5rem; border-left: 1px solid #E3D8C2; margin-left: 1.25rem;
}
.evirht-arbetsgang > li:last-child { border-left-color: transparent; padding-bottom: 0.5rem; }
.evirht-arbetsgang > li::before {
	content: counter(steg);
	position: absolute; left: -1.25rem; top: -0.35rem;
	width: 2.5rem; height: 2.5rem; border-radius: 50%;
	background: #FAF6EE; border: 1px solid #E3D8C2; color: #7A5214;
	font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.25rem; font-weight: 600;
	display: flex; align-items: center; justify-content: center;
}
.evirht-arbetsgang > li > strong:first-child {
	display: block; margin: 0 0 0.4rem;
	font-family: "Cormorant Garamond", Georgia, serif; font-weight: 600;
	font-size: 1.5rem; line-height: 1.2; color: #14171A;
}
.evirht-arbetsgang > li > em { display: block; margin-top: 0.6rem; font-style: normal; }
.evirht-arbetsgang__exempel {
	background: #FAF6EE; border-left: 2px solid #C08A2E; border-radius: 0 8px 8px 0;
	padding: 1rem 1.25rem; font-size: 0.9375rem; color: #2E3238; margin: 0.75rem 0 0;
}
.evirht-arbetsgang__exempel strong { color: #7A5214; }

/* --- Mallarna --- */
.evirht-mallar {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1rem; margin: 1.5rem 0 0;
}
.evirht-mall {
	position: relative; display: flex; flex-direction: column; gap: 0.5rem;
	background: #FFFFFF; border: 1px solid #E3D8C2; border-radius: 12px;
	padding: 1.5rem;
	transition: border-color .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.evirht-mall--vald { border-color: #C08A2E; box-shadow: 0 0 0 1px #C08A2E inset; }
.evirht-mall--ovald { opacity: 0.72; }
.evirht-mall--ovald:hover { opacity: 1; }
.evirht-mall__format {
	font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.12em;
	text-transform: uppercase; color: #B5702A;
}
.evirht-mall__markering {
	display: none;
	position: absolute; top: 1.1rem; right: 1.1rem;
	font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
	background: #C08A2E; color: #14171A; border-radius: 999px; padding: 0.25rem 0.7rem;
}
.evirht-mall--tom {
	border-style: dashed; border-color: #D8CBB3; background: #FCFAF6;
}
.evirht-mall--tom .evirht-mall__namn,
.evirht-mall--tom .evirht-mall__text { color: #8B8880; }
.evirht-mall--vald .evirht-mall__markering { display: block; }
.evirht-mall__namn {
	font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.375rem;
	line-height: 1.2; margin: 0; color: #14171A;
}
.evirht-mall__text { font-size: 0.9375rem; color: #55524B; margin: 0; flex-grow: 1; }
.evirht-mall__hamta {
	align-self: flex-start; font-weight: 600; color: #7A5214; text-decoration: none;
	border-bottom: 1px solid #E3B57A; padding-bottom: 2px; margin-top: 0.5rem;
}
.evirht-mall__hamta:hover { color: #14171A; border-bottom-color: #14171A; }

/* --- Vanliga misstag --- */
.evirht-misstag {
	list-style: none; margin: 1.5rem 0 0; padding: 0;
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 2rem;
}
.evirht-misstag li { position: relative; padding-left: 2rem; font-size: 1rem; }
.evirht-misstag li::before {
	content: "✕"; position: absolute; left: 0; top: 0.05em;
	color: #B5702A; font-weight: 600;
}
.evirht-misstag strong { display: block; }

/* --- Avsnittet för dem som inte har kunder än --- */
.evirht-utankunder {
	background: #F7EFE3; border-left: 3px solid #B5702A; border-radius: 0 12px 12px 0;
	padding: 2rem 2rem 2rem 2.25rem; margin: 2.5rem 0;
}
.evirht-utankunder > *:first-child { margin-top: 0; }
.evirht-utankunder > *:last-child { margin-bottom: 0; }

@media (max-width: 781px) {
	.evirht-plan, .evirht-plan-slut { padding: 1.25rem; border-radius: 12px; }
	.evirht-plan__spar { flex-direction: column; align-items: stretch; }
	.evirht-plan__steg { border-radius: 10px; }
	.evirht-plan-slut__knappar { flex-direction: column; align-items: stretch; }
	.evirht-plan__knapp { text-align: center; }
	.evirht-fakta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.evirht-fakta > * { border-right: 0; border-bottom: 1px solid #EDE4D3; padding: 1rem 0; }
	.evirht-fakta > * + * { padding-left: 0; }
	.evirht-fakta > *:nth-child(odd) { border-right: 1px solid #EDE4D3; padding-right: 1rem; }
	.evirht-fakta > *:nth-child(even) { padding-left: 1rem; }
	.evirht-fakta__varde { font-size: 1.25rem !important; }
	.evirht-arbetsgang > li { padding-left: 3.25rem; }
	.evirht-misstag { grid-template-columns: 1fr; }
	.evirht-utankunder { padding: 1.5rem 1.25rem 1.5rem 1.5rem; }
}