/* videograaf-draaidag: signatuurmodule van de videograafpreview Kaderlicht (fictief).
   Bron: React Bits Pro Blocks/pricing-8 (block-port: raster van kop en pakketten, secties met bovenrand en
   een uitklapknop over de volle breedte, rijen met onderstreept label en vinkjes in een rondje van 20 px).
   De draaidagbouwer (radiogroepen, draaiplanregel, voorbeeldkader) is eigen code uit het inhoudsplan.
   Alles gescoped onder .msm-videograaf-draaidag. */
.msm-videograaf-draaidag{--vd-p:var(--m-primary,#e55b34);--vd-bg:var(--m-bg,#11130f);--vd-ink:var(--m-ink,#f5f2ea);--vd-s:var(--m-surface,#1a1d18);--vd-mu:var(--m-muted,#a9a596);--vd-a:var(--m-accent2,#e9dfc6);--vd-l:var(--m-line,#2b2e28);--vd-fd:var(--m-font-display,"Syne","Segoe UI",system-ui,sans-serif);--vd-fb:var(--m-font-body,"DM Sans","Segoe UI",system-ui,sans-serif);--vd-ease:cubic-bezier(.22,1,.36,1);position:relative;scroll-margin-top:112px;padding:64px 16px;background:var(--vd-bg);color:var(--vd-ink);font-family:var(--vd-fb);font-size:16px;line-height:1.5}
.msm-videograaf-draaidag *{box-sizing:border-box}
.msm-videograaf-draaidag [hidden]{display:none!important}
.msm-videograaf-draaidag .vd-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.msm-videograaf-draaidag .vd-wrap{max-width:1400px;margin:0 auto;width:100%}

/* Kop en pakketten (pricing-8: grid van kop plus pakketkolommen) */
.msm-videograaf-draaidag .vd-head{display:grid;grid-template-columns:1fr;gap:24px;align-items:start}
.msm-videograaf-draaidag .vd-title{margin:0;font:600 clamp(36px,4.5vw,48px)/1.05 var(--vd-fd);letter-spacing:-.02em;color:var(--vd-ink)}
.msm-videograaf-draaidag .vd-tier{display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:16px;border:1px solid transparent;transition:border-color .3s}
.msm-videograaf-draaidag .vd-tier.is-pick{border-color:var(--vd-p)}
.msm-videograaf-draaidag .vd-tier-name{margin:0;font-size:20px;color:var(--vd-ink)}
.msm-videograaf-draaidag .vd-tier-price{margin:-4px 0 0;color:var(--vd-mu);font-size:14px;font-variant-numeric:tabular-nums}
.msm-videograaf-draaidag .vd-tag{display:inline-block;margin-right:4px;padding:1px 7px;border:1px solid var(--vd-l);border-radius:999px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--vd-mu)}
.msm-videograaf-draaidag .vd-btn{display:block;width:100%;padding:12px 16px;border:1px solid color-mix(in srgb,var(--vd-ink) 30%,var(--vd-bg));border-radius:999px;background:transparent;color:var(--vd-ink);font-size:14px;font-weight:500;text-align:center;text-decoration:none;cursor:pointer;transition:background-color .2s,color .2s,opacity .2s}
.msm-videograaf-draaidag .vd-btn:hover{background:color-mix(in srgb,var(--vd-ink) 8%,transparent)}
.msm-videograaf-draaidag .vd-btn-fill{border-color:var(--vd-ink);background:var(--vd-ink);color:var(--vd-bg)}
.msm-videograaf-draaidag .vd-btn-fill:hover{background:var(--vd-ink);opacity:.9}
.msm-videograaf-draaidag .vd-btn:focus-visible,.msm-videograaf-draaidag .vd-sec-btn:focus-visible{outline:2px solid var(--vd-ink);outline-offset:3px}

/* Draaidagbouwer */
.msm-videograaf-draaidag .vd-builder{display:grid;grid-template-columns:1fr;gap:24px;margin-top:40px;padding:24px;border-radius:24px;border:1px solid var(--vd-l);background:var(--vd-s)}
.msm-videograaf-draaidag .vd-choices{display:flex;flex-direction:column;gap:18px;margin:0}
.msm-videograaf-draaidag .vd-group{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;padding:0;border:0;min-width:0}
.msm-videograaf-draaidag .vd-group legend{float:left;width:100%;margin:0 0 8px;padding:0;color:var(--vd-mu);font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase}
.msm-videograaf-draaidag .vd-opt{position:relative;display:inline-flex}
.msm-videograaf-draaidag .vd-opt input{position:absolute;inset:0;margin:0;opacity:0;cursor:pointer}
.msm-videograaf-draaidag .vd-opt span{display:inline-block;min-height:40px;padding:9px 16px;border:1px solid var(--vd-l);border-radius:999px;color:var(--vd-ink);font-size:14px;line-height:1.4;transition:background-color .2s,border-color .2s,color .2s}
.msm-videograaf-draaidag .vd-opt:hover span{border-color:var(--vd-mu)}
.msm-videograaf-draaidag .vd-opt input:checked+span{border-color:var(--vd-ink);background:var(--vd-ink);color:var(--vd-bg)}
.msm-videograaf-draaidag .vd-opt input:focus-visible+span{outline:2px solid var(--vd-p);outline-offset:2px}
.msm-videograaf-draaidag .vd-plan{display:grid;gap:6px;margin:6px 0 0;padding:16px 18px;border-radius:16px;background:var(--vd-bg);border:1px solid var(--vd-l)}
.msm-videograaf-draaidag .vd-plan-label{color:var(--vd-p);font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.msm-videograaf-draaidag .vd-plan-text{color:var(--vd-ink);font-size:17px;line-height:1.55}
.msm-videograaf-draaidag .vd-plan-text b{font-weight:600;color:var(--vd-a);font-variant-numeric:tabular-nums}
.msm-videograaf-draaidag .vd-sw{display:inline-block}
.msm-videograaf-draaidag .vd-plan-note{color:var(--vd-mu);font-size:12px}
.msm-videograaf-draaidag .vd-preview{position:relative;margin:0;overflow:hidden;border-radius:16px;border:1px solid var(--vd-l);background:var(--vd-bg);aspect-ratio:3/2}
.msm-videograaf-draaidag .vd-preview-img{display:block;width:100%;height:100%;object-fit:cover;transition:filter .4s}
.msm-videograaf-draaidag .vd-preview[data-look="helder"] .vd-preview-img{filter:saturate(1.08) contrast(1.04) brightness(1.04)}
.msm-videograaf-draaidag .vd-preview[data-look="warm"] .vd-preview-img{filter:sepia(.28) saturate(1.15) contrast(.96) brightness(1.02)}
.msm-videograaf-draaidag .vd-preview[data-look="nacht"] .vd-preview-img{filter:contrast(1.35) brightness(.78) saturate(.85)}
.msm-videograaf-draaidag .vd-grain{position:absolute;inset:0;opacity:0;pointer-events:none;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 1 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");background-size:180px 180px;transition:opacity .4s}
.msm-videograaf-draaidag .vd-preview[data-look="warm"] .vd-grain{opacity:.45}
.msm-videograaf-draaidag .vd-preview figcaption{position:absolute;left:12px;bottom:12px;padding:4px 10px;border-radius:999px;background:color-mix(in srgb,var(--vd-bg) 80%,transparent);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:var(--vd-ink);font-size:12px}

/* Tarieventabel (pricing-8: secties met bovenrand, uitklapknop, rijen met label en vinkjes) */
.msm-videograaf-draaidag .vd-tarieven{scroll-margin-top:112px;margin-top:40px}
.msm-videograaf-draaidag .vd-table{width:100%;border-collapse:collapse;table-layout:fixed}
.msm-videograaf-draaidag .vd-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.msm-videograaf-draaidag .vd-th-name{display:block;font-size:14px;font-weight:500;color:var(--vd-ink)}
.msm-videograaf-draaidag .vd-th-price{display:block;margin-top:2px;color:var(--vd-mu);font-size:12px;font-variant-numeric:tabular-nums}
.msm-videograaf-draaidag .vd-th-note{color:var(--vd-mu);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.msm-videograaf-draaidag .vd-sec th{padding:0;border-top:1px solid var(--vd-l)}
.msm-videograaf-draaidag .vd-sec-btn{display:grid;grid-template-columns:1fr auto;align-items:center;width:100%;padding:20px 0;border:0;background:transparent;color:var(--vd-ink);font:500 20px/1.3 var(--vd-fd);text-align:left;cursor:pointer}
.msm-videograaf-draaidag .vd-sec-btn svg{width:16px;height:16px;margin-right:8px;fill:none;stroke:var(--vd-mu);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.msm-videograaf-draaidag .vd-sec-btn[aria-expanded="false"] svg{transform:rotate(180deg)}
.msm-videograaf-draaidag .vd-rows tr{display:block;padding:20px 0;border-top:1px solid var(--vd-l)}
.msm-videograaf-draaidag .vd-rows th,.msm-videograaf-draaidag .vd-rows td{display:block;padding:0;text-align:left;font-weight:400;vertical-align:top}
.msm-videograaf-draaidag .vd-rows th{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.msm-videograaf-draaidag .vd-label{color:var(--vd-ink);font-size:14px;text-decoration:underline;text-underline-offset:4px;text-decoration-color:color-mix(in srgb,var(--vd-ink) 30%,transparent)}
.msm-videograaf-draaidag .vd-mini{width:48px;height:48px;flex-shrink:0;object-fit:contain;border-radius:10px;background:var(--vd-s)}
.msm-videograaf-draaidag .vd-mini+.vd-mini{margin-left:-14px}
.msm-videograaf-draaidag .vd-rows td{display:flex;align-items:center;gap:12px;padding:5px 0}
.msm-videograaf-draaidag .vd-rows td::before{content:attr(data-tier);flex:0 0 96px;color:var(--vd-mu);font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.msm-videograaf-draaidag .vd-check{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--vd-ink);color:var(--vd-bg)}
.msm-videograaf-draaidag .vd-check svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.msm-videograaf-draaidag .vd-text{margin:0;color:var(--vd-a);font-size:14px;line-height:1.6}
.msm-videograaf-draaidag .vd-table [data-col]{transition:background-color .3s,box-shadow .3s}
.msm-videograaf-draaidag .vd-table[data-pick="halve-dag"] td[data-col="halve-dag"],.msm-videograaf-draaidag .vd-table[data-pick="hele-dag"] td[data-col="hele-dag"],.msm-videograaf-draaidag .vd-table[data-pick="twee-dagen"] td[data-col="twee-dagen"],.msm-videograaf-draaidag .vd-table[data-pick="op-maat"] td[data-col="op-maat"]{box-shadow:inset 3px 0 0 var(--vd-p);padding-left:12px;background:color-mix(in srgb,var(--vd-p) 8%,transparent)}
.msm-videograaf-draaidag .vd-foot{margin:20px 0 0;color:var(--vd-mu);font-size:13px}

@media (min-width:640px){
.msm-videograaf-draaidag{padding:80px 24px}
.msm-videograaf-draaidag .vd-head{grid-template-columns:repeat(2,1fr)}
.msm-videograaf-draaidag .vd-title{grid-column:1/-1}
.msm-videograaf-draaidag .vd-choices{gap:22px}
}
@media (min-width:768px){
.msm-videograaf-draaidag .vd-head{grid-template-columns:1.4fr repeat(4,1fr)}
.msm-videograaf-draaidag .vd-title{grid-column:auto}
.msm-videograaf-draaidag .vd-builder{grid-template-columns:1.1fr .9fr;align-items:start;padding:28px}
.msm-videograaf-draaidag .vd-table thead{position:static;width:auto;height:auto;overflow:visible;clip:auto}
.msm-videograaf-draaidag .vd-table thead th{padding:0 12px 16px 0;text-align:left;font-weight:400;vertical-align:bottom}
.msm-videograaf-draaidag .vd-table thead th:first-child{width:30%}
.msm-videograaf-draaidag .vd-table thead th[data-col]{padding:8px 12px 12px;border-radius:12px 12px 0 0;border:1px solid transparent;border-bottom:0;transition:border-color .3s}
.msm-videograaf-draaidag .vd-table[data-pick="halve-dag"] thead th[data-col="halve-dag"],.msm-videograaf-draaidag .vd-table[data-pick="hele-dag"] thead th[data-col="hele-dag"],.msm-videograaf-draaidag .vd-table[data-pick="twee-dagen"] thead th[data-col="twee-dagen"],.msm-videograaf-draaidag .vd-table[data-pick="op-maat"] thead th[data-col="op-maat"]{border-color:var(--vd-p)}
.msm-videograaf-draaidag .vd-table col{width:auto}
.msm-videograaf-draaidag .vd-rows tr{display:table-row;padding:0}
.msm-videograaf-draaidag .vd-rows th,.msm-videograaf-draaidag .vd-rows td{display:table-cell;padding:20px 12px 20px 0;border-top:1px solid var(--vd-l)}
.msm-videograaf-draaidag .vd-rows th{width:28%}
.msm-videograaf-draaidag .vd-rows th{display:table-cell}
.msm-videograaf-draaidag .vd-rows th>*{vertical-align:middle}
.msm-videograaf-draaidag .vd-rows th .vd-mini{display:inline-block;margin-right:8px}
.msm-videograaf-draaidag .vd-rows th .vd-mini+.vd-mini{margin-left:-22px}
.msm-videograaf-draaidag .vd-rows th .vd-mini~.vd-label{display:inline-block;max-width:calc(100% - 84px);vertical-align:middle}
.msm-videograaf-draaidag .vd-rows td{padding-left:12px}
.msm-videograaf-draaidag .vd-rows td::before{display:none}
.msm-videograaf-draaidag .vd-table[data-pick="halve-dag"] td[data-col="halve-dag"],.msm-videograaf-draaidag .vd-table[data-pick="hele-dag"] td[data-col="hele-dag"],.msm-videograaf-draaidag .vd-table[data-pick="twee-dagen"] td[data-col="twee-dagen"],.msm-videograaf-draaidag .vd-table[data-pick="op-maat"] td[data-col="op-maat"]{box-shadow:none;padding-left:12px}
}
@media (min-width:1024px){
.msm-videograaf-draaidag{padding:96px 32px}
.msm-videograaf-draaidag .vd-head{gap:24px}
.msm-videograaf-draaidag .vd-builder{gap:32px;padding:32px}
.msm-videograaf-draaidag .vd-rows th{width:30%}
}
@media (prefers-reduced-motion:reduce){
.msm-videograaf-draaidag .vd-preview-img,.msm-videograaf-draaidag .vd-grain,.msm-videograaf-draaidag .vd-tier,.msm-videograaf-draaidag .vd-table [data-col],.msm-videograaf-draaidag .vd-sec-btn svg{transition:none}
}
