/* Recalora 2.2.0 (04-10-2026): tooltegels van ontwerp E, gedeeld door de homepage (#rchome) en /nl/tools/ (#rctl).
   Fotostrook met label (zand-koperbruin), titel, zin en de donkerblauwe knop "Open de tool". Waarden uit
   E-rustig.dc.html blok 4 (ronde 6-7). De knoppen zijn hier spans in een <a>, zodat de hele tegel klikbaar is. */
.rc-toolkaarten{display:grid;gap:24px;grid-template-columns:1fr;--rc-ease:cubic-bezier(.22,1,.36,1);--rc-snel:120ms;--rc-staat:200ms;}
@media (min-width:720px){.rc-toolkaarten{grid-template-columns:repeat(2,1fr);}.rc-toolkaarten .rc-tool-hoofd{grid-column:span 2;}}
@media (min-width:1000px){.rc-toolkaarten{grid-template-columns:repeat(3,1fr);}}
#rchome .rc-toolkaarten .rc-tool,#rctl .rc-toolkaarten .rc-tool{position:relative;display:flex;flex-direction:column;text-decoration:none;color:#141821;background:#FFFFFF;border-radius:12px;overflow:hidden;box-shadow:rgb(64,68,66) 0 0 0 .5px inset,rgba(9,53,45,.05) 0 5px 6px -4px,rgba(174,202,197,.08) 0 1px 1px .5px;transition:transform var(--rc-staat) var(--rc-ease),box-shadow var(--rc-staat) var(--rc-ease);}
#rchome .rc-toolkaarten .rc-tool:hover,#rctl .rc-toolkaarten .rc-tool:hover{transform:translateY(-4px);box-shadow:rgb(64,68,66) 0 0 0 .5px inset,rgba(15,27,48,.16) 0 16px 28px -14px;color:#141821;}
#rchome .rc-toolkaarten .rc-tool:focus-visible,#rctl .rc-toolkaarten .rc-tool:focus-visible{outline:3px solid #1A2E4D;outline-offset:3px;}
.rc-toolkaarten .rc-strook{position:relative;flex:none;width:100%;height:98px;overflow:hidden;border-radius:6px 6px 0 0;background:var(--tint,#ECE9E4);}
@media (min-width:720px){.rc-toolkaarten .rc-strook{height:104px;}}
.rc-toolkaarten .rc-strook-foto{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%;}
.rc-toolkaarten .rc-strook-label{position:absolute;top:12px;left:12px;padding:5px 10px;border-radius:4px;background:#F1EAE0;border:1px solid #E2CFB3;font-family:var(--rc-mono,"JetBrains Mono",monospace);font-size:13px;font-weight:700;line-height:1.3;letter-spacing:.08em;text-transform:uppercase;color:#7A4A1C;box-shadow:0 2px 8px rgba(15,27,48,.18);}
.rc-toolkaarten .rc-tool-body{padding:18px;display:flex;flex-direction:column;gap:6px;flex:1;}
#rchome .rc-toolkaarten .rc-tool h3,#rctl .rc-toolkaarten .rc-tool h3{margin:0;font-family:var(--sans);font-weight:700;font-size:20px;line-height:1.19;letter-spacing:0;color:#0F1B30;transition:color var(--rc-snel) ease-out;}
#rchome .rc-toolkaarten .rc-tool-hoofd h3,#rctl .rc-toolkaarten .rc-tool-hoofd h3{font-family:var(--serif);font-weight:600;font-size:28px;line-height:1.15;letter-spacing:-.01em;}
#rchome .rc-toolkaarten .rc-tool:hover h3,#rctl .rc-toolkaarten .rc-tool:hover h3{color:#8E561F;}
#rchome .rc-toolkaarten .rc-tool p,#rctl .rc-toolkaarten .rc-tool p{margin:0;font-size:15px;line-height:1.5;color:#4A5160;}
#rchome .rc-toolkaarten .rc-tool-hoofd p,#rctl .rc-toolkaarten .rc-tool-hoofd p{font-size:16px;max-width:36em;}
.rc-toolkaarten .rc-tool-voet{margin-top:auto;padding-top:16px;display:flex;justify-content:flex-start;align-items:center;}
/* De knop: donkerblauw gevuld, wit, radius 6 (ronde 6: contrast 13,62:1; hover #0F1B30 17,22:1) */
.rc-toolkaarten .rc-knop-blauw{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;font-size:15px;font-weight:700;line-height:1.5;border-radius:6px;border:1px solid #1A2E4D;background:#1A2E4D;color:#FFFFFF;white-space:nowrap;box-sizing:border-box;transition:background var(--rc-snel) ease-out,border-color var(--rc-snel) ease-out;}
.rc-toolkaarten .rc-knop-blauw .rc-knop-pijl{display:inline-block;transition:transform 100ms ease-out;}
.rc-toolkaarten .rc-tool:hover .rc-knop-blauw{background:#0F1B30;border-color:#0F1B30;}
.rc-toolkaarten .rc-tool:hover .rc-knop-pijl{transform:translateX(3px);}
@media (prefers-reduced-motion: reduce){
  .rc-toolkaarten .rc-tool:hover,.rc-toolkaarten .rc-tool:hover .rc-knop-pijl{transform:none;}
  .rc-toolkaarten .rc-tool,.rc-toolkaarten .rc-tool *{transition-duration:1ms !important;}
}
