/* Kennisbank (B-176): de dienststand van de artikelhero. Rechts, op de plek van de auteurskaart (400 naast 680,
   B-116), de uploadkaart van de VSO-trechter (B-096). De trechter is normaal een vlak van rand tot rand met een
   vaste standhoogte; in de hero bepaalt de inhoud de hoogte en zit de kaart binnen de kolom. Gemeten (mockup r2):
   1440 × 900 kaart 157–634, knop 442–490, Trustpilot 672; 1280 × 720 kaart binnen de vouw; 393 × 660: H1, streep,
   kaart (350), antwoordzin ná de kaart. Laadt ná artikel.css en vso-pagina.css. */
.orj-ah-upload { position: relative; z-index: 1; flex: 0 0 400px; width: 400px; margin: 40px 0 38px; align-self: flex-start; }
.orj-calc.orj-calc--in-hero { width: auto !important; max-width: none !important; margin: 0 !important; min-height: 0 !important; background: transparent !important; }
.orj-calc--in-hero .orj-calc-kaart { padding: 20px 20px 24px !important; }
.orj-calc--in-hero .orj-calc-stand.is-aan { min-height: 0 !important; }
.orj-ah-upload-tp { margin-top: 18px; padding-left: 20px; }
.orj-ah-upload--leeg .orj-cta { margin-top: 12px; }
@media (max-width: 1279px) { .orj-ah-upload { flex-basis: 360px; width: 360px; } }
/* telefoon en tablet staand: H1 en streep, dan de kaart, dan de antwoordzin (uploadknop binnen de vouw van 660) */
@media (max-width: 959px) {
	.orj-ah-in--dienst { display: flex; flex-direction: column; gap: 0; }
	.orj-ah--dienst .orj-ah-tekst { display: contents; }
	.orj-ah--dienst .orj-ah-tekst > * { order: 1; }
	.orj-ah--dienst .orj-ah-upload { order: 2; margin: 28px 0 0; width: 100%; flex-basis: auto; align-self: stretch; }
	.orj-ah--dienst .orj-ah-lead { order: 3; margin-top: 28px !important; }
}
@media (min-width: 640px) and (max-width: 959px) { .orj-ah--dienst .orj-ah-tekst > *, .orj-ah--dienst .orj-ah-upload { margin-left: 32px; } }
@media (max-width: 639px) { .orj-ah-upload-tp { padding-left: 0; } }

/* B-188, B-189, B-232 (v3.2.0): dienst- en rekenpagina beginnen met de trechter zelf, van rand tot rand en schermvullend onder de
   header. Boven de fasen staat niets (B-232 schrapte kruimelpad, titelregel en chip van B-189): de H1 is de kop van scherm 1, in de
   kaart, op de kaartkopmaat van B-085 (28 px vanaf 960, 22 px op de telefoon). De voortgang staat alleen boven het formulier en de
   zijkolom begint op die hoogte (B-189; sinds B-234 op de bovenrand van de kaart). Alles hangt aan .orj-calc--pagina: /vso-check/ en de
   oude rekenpagina blijven zoals ze zijn. */
/* B-233 (v3.2.1): het uploadscherm in vaste maten. Onderzin → uploadvlak is gelijk aan uploadvlak → knoppenrij: 18 op de telefoon (de
   padding-top van de knoppenrij daar), 28 vanaf 960. De restruimte van de standhoogte (B-089) gaat in het uploadvlak in plaats van boven
   de knop, dus kaart en knop blijven op hun plek en het sleepvlak wordt groter (181 in plaats van 168 op 1455). */
.orj-calc--pagina.orj-calc--vso [data-orj-stand="upload"] .orj-calc-sub { margin-bottom: 18px; }
.orj-calc--pagina.orj-calc--vso [data-orj-stand="upload"] .orj-vsop-dz { flex: 1 0 auto; display: flex; flex-direction: column; }
.orj-calc--pagina.orj-calc--vso [data-orj-stand="upload"] .orj-vsop-dz:not(.is-vol) { justify-content: center; }
.orj-calc--pagina .orj-calc-zij > * { min-width: 0; }   /* B-234: een lockup zonder afbreking mag de kolom van 316 nooit oprekken */
@container orjcalc (min-width: 960px) {
	.orj-calc--pagina .orj-calc-wrap { padding-top: 96px; }
	.orj-calc--pagina .orj-calc-wrap--zij { --zij-extra: 0px; }
	/* B-234: de zijkolom begint op de bovenrand van de kaart (B-189 zette hem 76 hoger, op de voortgang): twee witte kaarten naast
	   elkaar vergelijkt het oog op hun bovenrand. De stappenbalk staat op de inhoudslijnen van de kaart (48 = de zijpadding van de kaart
	   vanaf 960 in calculator.css): eerste bol op de H1-lijn, laatste op de rechterrand van de knop, elke lijn 16 van de bollen. De labels
	   blijven boven de bol (B-085) maar staan absoluut, zodat hun breedte de lijnen niet meer verschuift (was 28 · 38 · 38 · 20 op de
	   dienstpagina, 55 · 29 · 29 · 26 · 26 · 38 op de rekenpagina). De bollen houden hun hoogte (top −48 + 28 = de oude −76 + 56). */
	.orj-calc--pagina .orj-calc-fasen { top: -48px; left: 48px; width: calc(100% - 96px); align-items: center; }
	.orj-calc--pagina .orj-calc-fase { flex: 0 0 auto; }
	.orj-calc--pagina .orj-calc-lbl { position: absolute; left: 50%; bottom: calc(100% + 10px); transform: translateX(-50%); }
	.orj-calc--pagina .orj-calc-lijn { margin: 0 16px; }
	.orj-calc--pagina .orj-vsop-dz:not(.is-vol) { padding: 20px 24px; }
	.orj-calc--pagina .orj-vsop-dz-icoon, .orj-calc--pagina .orj-vsop-dz-icoon svg { width: 40px; height: 40px; }
	.orj-calc--pagina .orj-vsop-dz-icoon { margin-bottom: 10px; }
	.orj-calc--pagina.orj-calc--vso [data-orj-stand="upload"] .orj-calc-sub { margin-bottom: 28px; }   /* B-233 */
}
