/* Dagens ord word page: example sentences, learner quotes (learner-quote) and the "Bra att veta" note. */
.tv-wq, .tv-wu {
	--tv-navy: var(--e-global-color-primary, #051644);
	--tv-ink: #0e2338; /* muted text = this colour at 45-75 % (the home page convention) */
	--tv-steel: var(--e-global-color-secondary, #2d6ca9);
	--tv-soft-gold: var(--e-global-color-722ed5d, #efd686);
	--tv-cream: var(--e-global-color-e33c8be, #fcfaf6);
	--tv-bright: var(--e-global-color-b1a8e7f, #44a8e7);
	color: var(--tv-navy);
	font-family: "Open Sans", sans-serif;
	font-size: 17px;
	line-height: 1.7;
}
.tv-wq blockquote, .tv-wq p, .tv-wu p { margin: 0; border: 0; padding: 0; font-style: normal; quotes: none; }
.tv-wq blockquote::before, .tv-wq blockquote::after { content: none; }

.tv-wq--examples { display: grid; gap: 1rem; }
.tv-wq .tv-wq__example { border-radius: 20px; padding: 1.5rem; background: color-mix(in oklab, var(--tv-soft-gold) 65%, transparent); color: var(--tv-navy); font: 400 1.25rem/1.625 "Outfit", sans-serif; }

.tv-wq--learner { display: grid; gap: 1.25rem; }
.tv-wq .tv-wq__card { min-height: 10rem; border: 1px solid color-mix(in oklab, var(--tv-navy) 7%, transparent); border-radius: 20px; padding: 1.5rem; background: var(--tv-cream); box-shadow: 0 12px 32px color-mix(in oklab, var(--tv-navy) 8%, transparent); }
.tv-wq__card svg { display: block; color: var(--tv-bright); }
.tv-wq .tv-wq__card p { margin-top: 1rem; color: color-mix(in srgb, var(--tv-ink) 75%, transparent); font: 400 1.125rem/1.625 "Outfit", sans-serif; }

.tv-wu { margin-top: 1.75rem; border-left: 2px solid var(--tv-bright); padding-left: 1.25rem; }
.tv-wu .tv-wu__label { font-size: .75rem; font-weight: 600; line-height: 1rem; letter-spacing: .14em; text-transform: uppercase; color: var(--tv-steel); }
.tv-wu .tv-wu__text { margin-top: .5rem; color: color-mix(in srgb, var(--tv-ink) 65%, transparent); }

@media (min-width: 640px) {
	.tv-wq--examples { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 768px) {
	.tv-wq--learner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
