/* =============================================================
   Tekst med boks — .tekst-med-boks-graesmarken
   Brødtekst + sidestillet indholdsboks (ændring 03: bolig-disclaimer +
   økonomi-boks, men generisk genbrugelig). Layout via delt .split--7-5/--5-7
   (1→2 kolonner — eneste breakpoint ejes af .split; boksen falder under
   teksten på smalle skærme). Boksen genbruger delt .card/.card--accent som
   visuelt adskilt flade; den er hverken klikbar eller sticky → intet
   hover-løft (neutraliseres nedenfor via enqueue-order, jf. bolig-kort og
   husets regel "løft hører til klikbare flader").
   Content-first DOM: teksten står altid først; 'boks venstre' ombytter kun
   visuelt via order. Kun :root-tokens; 0 !important; ingen JS.
   ============================================================= */

.tekst-med-boks-graesmarken {
    padding-block: var(--section-spacing);
}


/* ---- Layout (.split ejer 1→2-kolonne-skiftet) ---- */
/* start: boksen følger sit eget indhold — strækkes ikke til tekstens højde. */
.tekst-med-boks-graesmarken__layout {
    align-items: start;
}
.tekst-med-boks-graesmarken--boks-venstre .tekst-med-boks-graesmarken__aside {
    order: -1;
}


/* ---- Brødtekst (WYSIWYG) ---- */
.tekst-med-boks-graesmarken__body {
    color: var(--color-text-soft);
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    max-width: var(--measure);
}
.tekst-med-boks-graesmarken__body :where(p, ul, ol):first-child { margin-top: 0; }
.tekst-med-boks-graesmarken__body :where(p, ul, ol):last-child  { margin-bottom: 0; }


/* ---- Boksen (delt .card--accent bærer flade/kant/radius/padding) ---- */
/* Ikke-klikbar flade → intet løft/skygge på hover (samme specificitet som
   .card:hover; denne fil vinder på enqueue-order). */
.tekst-med-boks-graesmarken__aside:hover {
    box-shadow: none;
    transform: none;
}
.tekst-med-boks-graesmarken__aside-body :where(p, ul, ol):first-child { margin-top: 0; }
.tekst-med-boks-graesmarken__aside-body :where(p, ul, ol):last-child  { margin-bottom: 0; }
