/* ==================================================================
   werkgebied.css  -  losse CSS uit het ontwerp, letterlijk overgenomen.
   Bron: ruw/Uve - werkgebied Uitvaartverzorging sectie herontwerp/_plat/
         pagina-werkgebied.html  (de <style>- en <style data-plat="hover">-blokken).
   De hele indeling/opmaak zit in de inline-styles in page-werkgebied.php; de
   tokens (kleur, vorm, schaduw, motion-keyframes erika-drift/-drift2/-morph/
   -breathe) komen uit tokens-erika.css. Hier staat niets zelfbedachts: alleen
   wat het ontwerp buiten de inline-styles voorschrijft.
   De globale body/a-basisregels uit de export zijn weggelaten; home.css levert
   die al sitebreed en ze zouden anders de kop/voet op deze pagina herkleuren.
   ================================================================== */

html{scroll-behavior:smooth}

@keyframes erika-fade-up{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}
@keyframes erika-band-in{from{opacity:.55;translate:0 10px}to{opacity:1;translate:0 0}}

.dc-hover-1:hover{background:var(--surface-card-hover);transform:translateY(-4px);box-shadow:var(--shadow-card-hover);border-radius:18px 26px 18px 26px}
.dc-hover-2:hover{color:var(--aubergine)}

@media (prefers-reduced-motion:reduce){[data-fade]{animation:none !important}html{scroll-behavior:auto}}

/* ---------- de naad naar de bel-actie ----------
   Zelfde geval als op /over-erika/: secties met inline stijl en zonder class,
   nooit gemeten omdat een lege sectienaam uit de ronde viel. De laatste sectie
   vóór div.eo eindigt met een gewaasde rand terwijl .eo .cta-band::before zijn
   golf in vlak --paper tekent. Gemeten 10,9 op 1280 en 16,0 op 390.
   Onderpadding is 140px tegen 120px uitdoving, dus de tekst wordt niet geraakt. */
main > section:last-of-type::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:120px;
  pointer-events:none;z-index:1;
  background:linear-gradient(to bottom, rgba(250,245,236,0) 0%, var(--paper) 78%, var(--paper) 100%);
}