/* Rijmbos — Expertise (herontwerp) */
.pagina-expertise{--ijzer:#505D62}
/* intro met smeedwerk-embleem */
.x-intro{padding:120px 0 40px}
.x-intro-grid{display:grid;grid-template-columns:150px minmax(0,1fr);gap:72px;align-items:center}
.x-embleem{color:var(--ijzer)}
.x-gate{display:block;width:100%;height:auto;overflow:visible}
.x-embleem .x-gate :is(path,ellipse,circle,rect){stroke-dasharray:1 1;stroke-dashoffset:1}
.x-embleem.zicht .x-gate :is(path,ellipse,circle,rect){animation:xTeken 2.6s cubic-bezier(.6,0,.2,1) forwards}
@keyframes xTeken{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
.x-intro-tekst{margin:0;color:#1D1D1F;font-family:"Inter Tight",sans-serif;font-weight:600;font-size:clamp(24px,2.5vw,34px);letter-spacing:-.025em;line-height:1.28}
/* expertises: tekst links, groot beeld rechts dat meeschuift en zacht uitloopt */
.x-exp{position:relative;padding:40px 0 60px;overflow-x:clip}
.x-grid{display:grid;grid-template-columns:minmax(0,1fr) 52vw;padding-left:max(22px,calc((100vw - 1080px)/2 + 22px))}
.x-kol{padding:40px 64px 0 0;max-width:600px}
.x-label{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--g);margin:0}
.x-art{min-height:62vh;display:flex;flex-direction:column;justify-content:center;padding:6vh 0}
.x-art:first-of-type{min-height:64vh;padding-top:2vh}
.x-nr{font-size:13px;letter-spacing:.18em;color:var(--ijzer);margin:0 0 16px;font-variant-numeric:tabular-nums}
.x-art h2{font-family:"Inter Tight",sans-serif;font-size:clamp(36px,3.6vw,54px);line-height:1.04;letter-spacing:-.035em;margin:0 0 22px}
.x-art .x-txt>p:last-child{margin:0;font-size:18px;line-height:1.6;color:#424245}
.x-art .x-txt{transition:opacity .6s ease}
.x-mbeeld{display:none}
.x-paneel{position:relative}
.x-sticky{position:sticky;top:0;height:100vh}
.x-fotos{position:absolute;inset:0;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 26%),linear-gradient(180deg,transparent 0,#000 10%,#000 80%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent 0,#000 26%),linear-gradient(180deg,transparent 0,#000 10%,#000 80%,transparent 100%);
  mask-composite:intersect}
.x-fotos figure{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1.1s ease}
.x-fotos figure.aan{opacity:1}
.x-fotos img{width:100%;height:100%;object-fit:cover;transform:scale(1.07);transition:transform 7s cubic-bezier(.2,.6,.2,1)}
.x-fotos figure.aan img{transform:scale(1)}
/* samenwerkingsvormen: smeedwerk als stil watermerk */
.x-modellen{position:relative;overflow:hidden}
.x-modellen .wrap{position:relative;z-index:1}
.x-water{position:absolute;right:max(-30px,calc((100vw - 1080px)/2 - 150px));top:50%;width:160px;transform:translateY(-50%);color:var(--ijzer);opacity:.09;pointer-events:none}
.x-modellen .modellen .l{color:var(--ijzer)}
@media (max-width:834px){
  .x-intro{padding:84px 0 18px}
  .x-intro-grid{grid-template-columns:1fr;gap:36px}
  .x-embleem{width:92px}
  .x-intro-tekst{font-size:24px}
  .x-exp{padding:10px 0 30px}
  .x-grid{display:block;padding:0}
  .x-paneel{display:none}
  .x-kol{padding:0;max-width:none}
  .x-label{padding:0 22px;margin-bottom:8px}
  .x-art,.x-art:first-of-type{min-height:0;padding:0 0 56px;display:block}
  .x-mbeeld{display:block;margin:0 0 6px;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 70%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 70%,transparent 100%)}
  .x-mbeeld img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
  .x-txt{padding:0 22px;margin-top:-34px;position:relative}
  .x-art h2{font-size:34px;margin-bottom:16px}
  .x-art .x-txt>p:last-child{font-size:17px}
  .x-water{width:150px;right:-50px;top:auto;bottom:-30px;transform:none}
}
@media (prefers-reduced-motion:reduce){.x-fotos img{transform:none!important;transition:none}.x-embleem .x-gate :is(path,ellipse,circle,rect){stroke-dashoffset:0!important;animation:none!important}}
