/* Naxara motion system. Original CSS; no third-party animation runtime. */
:root {
  --motion-fast:180ms; --motion-base:300ms; --motion-slow:650ms; --motion-cinematic:1000ms;
  --ease-standard:cubic-bezier(.2,.65,.3,1); --ease-premium:cubic-bezier(.22,1,.36,1);
  --ease-enter:cubic-bezier(.16,1,.3,1); --ease-exit:cubic-bezier(.4,0,1,1);
}
/* Content remains visible before, during and without enhancement. */
.motion-enabled [data-reveal].is-visible{animation:none}
.site-header{transition:background var(--motion-base),box-shadow var(--motion-base)}
.site-header.is-scrolled{background:#021018fa;box-shadow:0 8px 30px #0003}
.desktop-nav a{transition:color var(--motion-fast)}
.desktop-nav a:focus-visible::after,.desktop-nav a[data-active-section]::after{transform:scaleX(1)}
.desktop-nav a[data-active-section]{color:var(--gold-bright)}
.site-progress{position:absolute;bottom:-1px;left:0;right:0;height:2px;background:linear-gradient(90deg,#aa7942,#ffe2a4);transform:scaleX(var(--page-progress,0));transform-origin:left;pointer-events:none}
.mobile-nav:not([hidden]){animation:nav-enter var(--motion-base) var(--ease-enter)}
@keyframes nav-enter{from{opacity:.8;transform:translateY(-6px)}to{opacity:1;transform:none}}
.motion-global{background:#021016e8;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 4px 24px #00000059;position:fixed;z-index:25;bottom:20px;right:20px;left:auto;top:auto}
.scroll-cue{position:absolute;right:4%;bottom:150px;z-index:3;display:flex;align-items:center;gap:12px;min-height:44px;padding:7px 13px;background:#021016b8;border:1px solid #d9b77766;border-radius:30px;color:#f8e4b8;font:11px/1.3 Instrument,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase}
.hero .motion-toggle{min-height:44px}
.scroll-cue span{font-size:20px;transition:transform var(--motion-base)}
.scroll-cue:hover span,.scroll-cue:focus-visible span{transform:translateY(3px)}
.button,.cr-button,.icon-button,.cr-round{transition:background var(--motion-base),border-color var(--motion-base),box-shadow var(--motion-base),translate var(--motion-base) var(--ease-premium)}
.button .icon,.cr-button .icon{transition:transform var(--motion-base) var(--ease-premium)}
.button:hover .icon,.button:focus-visible .icon,.cr-button:hover .icon,.cr-button:focus-visible .icon{transform:translateX(4px)}
.button:active,.cr-button:active,.icon-button:active,.cr-round:active{translate:0 1px}
.motion-enabled .magnetic-cta{translate:var(--magnet-x,0px) var(--magnet-y,0px)}
.magnetic-cta:focus-visible{translate:0 0!important}
.light-sweep{position:relative;isolation:isolate;overflow:hidden}
.light-sweep::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 25%,#fff6 50%,transparent 75%);transform:translateX(-110%);opacity:0}
.light-sweep:hover::after,.light-sweep:focus-visible::after{animation:gold-sweep var(--motion-slow) var(--ease-standard)}
@keyframes gold-sweep{0%{transform:translateX(-110%);opacity:0}20%{opacity:.7}100%{transform:translateX(110%);opacity:0}}
.hover-lift{transition:translate var(--motion-base) var(--ease-premium),border-color var(--motion-base),box-shadow var(--motion-base)}
.hover-lift:focus-within{border-color:#f4d390;box-shadow:0 0 0 1px #f4d39055,0 14px 35px #0003}
.image-depth img{transition:transform var(--motion-slow) var(--ease-premium)}
.case-image:focus-visible img{transform:scale(1.025)}
.gold-border-reveal{position:relative;isolation:isolate}
.gold-border-reveal::after{content:'';position:absolute;inset:0;z-index:0;border-radius:inherit;pointer-events:none;background:radial-gradient(260px circle at var(--light-x,50%) var(--light-y,50%),#f6d69a1a,transparent 70%);opacity:0;transition:opacity var(--motion-base)}
.gold-border-reveal.is-pointer::after,.gold-border-reveal:focus-within::after{opacity:1}
@media(hover:hover) and (pointer:fine){
  .motion-enabled .hover-lift:hover{translate:0 -4px;border-color:#e9c282;box-shadow:0 16px 36px #0004}
  .motion-enabled .image-depth:hover img{transform:scale(1.025)}
  .motion-enabled .service-item:hover .gold-ring{transform:translateY(-3px)}
}
.gold-ring{transition:transform var(--motion-base) var(--ease-premium)}
/* Architecture stays fixed. Future water footage must be isolated to its real basin. */
/* Existing decorative layers only run while their scene is visible. */
.motion-enabled :not(.in-view)>.water-light,.motion-enabled :not(.in-view)>.cr-light{animation-play-state:paused}
.process-grid li{transition:opacity var(--motion-base),border-color var(--motion-base);border-top:1px solid transparent;padding-top:18px}
.process-grid li.is-current{border-color:#ffe0a3}
.process-grid li.is-current .step-number{color:#05111a;background:linear-gradient(140deg,#ffedc1,#d29b52);box-shadow:0 0 20px #edbd631c}
button.step-number{cursor:pointer;font:inherit;flex-shrink:0}
.process-reading{max-width:490px;margin-top:24px;display:flex;gap:18px;align-items:flex-start}
.process-reading .process-position{color:var(--gold-bright);font:11px/1.5 Instrument,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.process-reading p[data-process-caption]{font-size:17px;line-height:1.5;margin:10px 0 0;min-height:52px}
.process-ring{flex:none;width:54px;height:54px;display:grid;place-items:center;border:1px solid #e2ba73a6;border-radius:50%;background:#03202a99;color:var(--gold);box-shadow:inset 0 0 12px #edbd6326,0 0 10px #dca95d1c}
.process-ring .icon{width:24px;height:24px}
.process-reading-body{flex:1;min-width:0}
.process-reading-top{display:flex;align-items:center;gap:10px 12px;flex-wrap:wrap}
.process-hairline{flex:1 1 18px;min-width:18px;height:1px;background:linear-gradient(90deg,#e2ba7373,#e2ba7322)}
.process-tag{color:#caa863;font:10px/1.4 Instrument,Arial,sans-serif;letter-spacing:.2em;text-transform:uppercase;white-space:nowrap;margin-left:auto}
.process-next{margin-top:12px;display:inline-flex;align-items:center;gap:10px;background:none;border:0;padding:8px 0;color:var(--gold-bright);font:11px/1 Instrument,Arial,sans-serif;letter-spacing:.18em;text-transform:uppercase;cursor:pointer}
.process-next:hover,.process-next:focus-visible{color:#ffe9c0}
.section-progress{height:2px;width:100%;background:#edc47b2c;margin-top:28px;overflow:hidden}
.section-progress::before{content:'';display:block;height:100%;background:#f0c985;transform:scaleX(var(--section-progress,.25));transform-origin:left;transition:transform var(--motion-base) var(--ease-standard)}
.premium-tabs{display:flex;gap:7px;flex-wrap:wrap;margin:24px 0;border-bottom:1px solid #c6a57444;padding-bottom:14px}
.premium-tabs button{min-height:44px;padding:10px 18px;border:1px solid #c6a57455;border-radius:4px;background:#02131ad9;color:#dbdcd9;font:12px/1.5 Instrument,Arial,sans-serif;cursor:pointer;transition:background var(--motion-base),color var(--motion-base),border-color var(--motion-base)}
.premium-tabs button[aria-selected=true]{background:#e6c080;color:#03131b;border-color:#f5d9a4}
.premium-tabs button:focus-visible{outline:2px solid #fff1cd;outline-offset:4px}
.price-grid>[hidden],[data-product-panel][hidden],.premium-tabs[hidden]{display:none!important}
.pricing-section .premium-tabs{justify-content:center}
.price-grid:has(>.price-card[hidden]){grid-template-columns:repeat(2,minmax(0,1fr));max-width:850px;margin-inline:auto}
.price-grid:has(>.price-card:first-child:not([hidden])):has(>.price-card:nth-child(2)[hidden]){grid-template-columns:minmax(0,1fr);max-width:460px}
details{scroll-margin-top:110px}
details summary:focus-visible{outline:2px solid #f1d291;outline-offset:5px;border-radius:2px}
details summary .icon{transition:transform var(--motion-base) var(--ease-premium);flex-shrink:0}
details[open]>summary .icon{transform:rotate(45deg)}
.accordion-body{display:flow-root}
.faq details>.accordion-body>p{color:#c4d0d3;font-size:14px;line-height:1.75;margin:0 0 18px}
.cr-faq details>.accordion-body>p{font-size:16px;line-height:1.65;color:#c2d0d2;padding:0 0 18px}
.cr-conditions>.accordion-body{font-size:14px;line-height:1.7}
.field:focus-within label,.cr-field:focus-within label{color:#f8d89a}
.field input,.field textarea,.cr-field input,.cr-field textarea{transition:border-color var(--motion-fast),box-shadow var(--motion-fast),background var(--motion-fast)}
.field input:focus,.field textarea:focus,.cr-field input:focus,.cr-field textarea:focus{background:#061b25;border-color:#f1c781;box-shadow:0 0 0 3px #e6ba6920}
.form-progress{font:11px/1.5 Instrument,Arial,sans-serif;color:#b5c3c8;margin:12px 0;display:flex;align-items:center;gap:12px}
.form-progress::before{content:'';display:block;width:56px;height:2px;background:linear-gradient(to right,#e8c180 calc(var(--form-progress,0)*100%),#677b8555 0)}
.form-result,.cr-result,#interest-result{border-color:#e8bf78!important}
/* Mobile Creative cards remain complete visual blocks with real selectors. */
.cr-discipline h3 button:focus-visible{outline:2px solid #f4d39d;outline-offset:7px}
.cr-discipline[aria-current=true]{border-color:#f0cf98}
@media(max-width:700px){
  .cr-enhanced .cr-discipline:not(.is-active) .cr-card-detail{display:none}
  .cr-enhanced .cr-discipline:not(.is-active) .cr-card-photo{height:170px}
  .cr-enhanced .cr-discipline.is-active .cr-card-photo{height:290px}
  .cr-enhanced .cr-card-controls:not([hidden]){display:flex!important}
}
@media(max-width:760px){
  .scroll-cue{bottom:174px;left:20px;right:auto;font-size:9px}
  .motion-global{bottom:12px;right:12px;font-size:10px;padding:6px 11px;min-height:34px}
  .process-reading{margin-top:20px}.process-reading p[data-process-caption]{font-size:16px}
  .price-grid:has(>.price-card[hidden]){grid-template-columns:1fr}
  .premium-tabs button{flex:1 1 auto;padding-inline:12px}
}
@media(prefers-reduced-motion:reduce){.image-depth img{transform:none!important}}
@media(forced-colors:active){.gold-border-reveal::after{display:none}.premium-tabs button{border:1px solid ButtonText}.premium-tabs button[aria-selected=true]{outline:2px solid Highlight}.site-progress{background:Highlight}.process-grid li.is-current{border-color:Highlight}}

/* Depth & polish round 2026-09-15. Motion-gated; reduced motion keeps static rendering. */
@media (min-width:1051px){
 .process-copy{display:flex;justify-content:space-between;align-items:flex-end;gap:56px;max-width:none;width:100%}
 .process-copy .section-heading{max-width:560px}
 .process-copy .section-heading{margin:0;flex:1}
 .process-copy .process-reading{margin-top:0;flex:0 0 400px;max-width:400px}
 .process-section .process-grid{margin-top:34px}
}
@media (hover:hover) and (pointer:fine){
 .motion-enabled .case-card .laptop{transition:transform 420ms cubic-bezier(.23,1,.32,1),filter 420ms cubic-bezier(.23,1,.32,1)}
 .motion-enabled .case-card:hover .laptop,.motion-enabled .case-card:focus-within .laptop{transform:translateY(-6px);filter:drop-shadow(0 20px 32px #00000073)}
 .motion-enabled .case-card:hover .case-image img,.motion-enabled .case-card:focus-within .case-image img{transform:scale(1.05)}
}
.motion-enabled .scene[data-parallax] img{transform:translate3d(0,var(--parallax-y,0%),0) scale(1.07);will-change:transform}

/* Finishing pass 2026-09-15: no-orphan headings and branded text selection. */
h1,h2,.section-heading h2,.price-card h3,.deck-detail h2{text-wrap:balance}
::selection{background:#e5c680;color:#011f1e}

/* Reviewronde 2026-09-15 - geregisseerde overgangen en wereldbinding. */
.section.cinematic>picture.scene{mask-image:linear-gradient(180deg,transparent,#000 110px,#000 calc(100% - 110px),transparent);-webkit-mask-image:linear-gradient(180deg,transparent,#000 110px,#000 calc(100% - 110px),transparent)}
.finale.cinematic>picture.scene{mask-image:linear-gradient(180deg,transparent,#000 130px,#000 calc(100% - 120px),transparent);-webkit-mask-image:linear-gradient(180deg,transparent,#000 130px,#000 calc(100% - 120px),transparent)}
.sector-card .sector-portrait{position:relative;display:block}
.sector-card .sector-portrait img{filter:grayscale(.22) saturate(.82) brightness(.9) contrast(1.07)}
.sector-card .sector-portrait::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#0a1c3059,#0a1c300f 45%,#c9955526);mix-blend-mode:soft-light}
@media(min-width:1051px){
 .sector-grid>article:nth-child(even){transform:translateY(26px)}
 .sectors-section .sector-grid{padding-bottom:26px}
 .sectors-section .section-heading,.services-section .section-heading{text-align:left}
 .sectors-section .section-heading h2,.services-section .section-heading h2{margin-inline:0}
}
@media(min-width:1051px){
 .product-grid .product-featured{grid-column:span 2;text-align:left;align-items:flex-start}
 .product-grid .product-featured .product-blurb{font-size:15px;line-height:1.6;color:#ccd8da;max-width:46ch;margin:8px 0 0}
}
.product-grid .product-blurb{color:#c7d3d5}
.comparison-before{background:#f0eee8}
.comparison-before .mini-nav{background:#3c4a5a;color:#e8ebee;font:600 11px/1.4 Arial,Helvetica,sans-serif;letter-spacing:0}
.comparison-before .mini-content h3{font:700 19px/1.3 Georgia,'Times New Roman',serif;color:#22303c}
.comparison-before .mini-content p{font:13px/1.55 Arial,Helvetica,sans-serif;color:#4a5560}
.comparison-before .mini-action{color:#1a4fa0;text-decoration:underline;font:13px/1.5 Arial,Helvetica,sans-serif;background:none;border:1px solid #b9c2cc;border-radius:2px;padding:6px 12px}
.comparison-before .wire-cards i{border:1px solid #cfd6dd;background:#e6e9ec;border-radius:2px}
.comparison .fineprint{display:inline-block;margin:14px auto 0;padding:7px 16px;border:1px solid #d9b26f66;border-radius:20px;background:#03121bd6;color:#e9d9b4;letter-spacing:.06em}
.finale{overflow:hidden}
.finale .container{position:relative;isolation:isolate}
.finale .container::before{content:'';position:absolute;inset:-6% -10%;z-index:-1;background:radial-gradient(58% 62% at 50% 44%,#04101ac2,transparent 74%);pointer-events:none}
p.scene-plaque{font-size:10.5px;letter-spacing:.3em}

/* Creative-panel hologramloops 2026-09-16: goedgekeurde clips leven onder de vaste HTML-titels; overlayverloop borgt leesbaarheid. */
.creative-gallery article .panel-loop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s cubic-bezier(.23,1,.32,1);z-index:0;pointer-events:none}
.creative-gallery article.has-video .panel-loop{opacity:1}
/* Productpanelen 2026-09-17: OWNER_APPROVED loops uit product-media.json achter de paneelinhoud; shade bewaakt tekstleesbaarheid. */
.product-grid article{position:relative;overflow:hidden}
.product-grid article .panel-loop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s cubic-bezier(.23,1,.32,1);z-index:0;pointer-events:none}
.product-grid article .product-loop-shade{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .8s cubic-bezier(.23,1,.32,1);background:linear-gradient(180deg,#03101a59 0%,#03101a9e 34%,#03101a96 58%,#03101abf 100%)}
.product-grid article.has-video .panel-loop,.product-grid article.has-video .product-loop-shade{opacity:1}
.product-grid article>:not(.panel-loop):not(.media-poster):not(.product-loop-shade){position:relative;z-index:1}
/* Verfijning 2026-09-17 (eigenaar): op levende panelen dimt het ringicoon — het filmbeeld is dan het icoon; keert terug zodra de film pauzeert of reduced-motion actief is. */
.product-grid article .gold-ring{transition:transform var(--motion-base) var(--ease-premium),opacity .8s cubic-bezier(.23,1,.32,1)}
.product-grid article.has-video .gold-ring{opacity:.22}
/* Insight-beeldpositionering 2026-09-17: de kolommensculptuur staat links in het bronbeeld; lichte zoom+shift centreert haar in het paneel (overflow:hidden vangt de rest). */
.product-grid video[data-panel-loop="product-insight-studio"]{transform:scale(1.22) translateX(9%)}
.creative-gallery article>div{z-index:1}

/* Sectorensectie 2026-09-16 (eigenaar: "die zijn goed"): levende scene-laag + vier kaartloops, zelfde poorten als overal. */
.cinematic>.scene-loop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-2;opacity:0;transition:opacity 1.2s cubic-bezier(.23,1,.32,1);pointer-events:none;mask-image:linear-gradient(180deg,transparent,#000 110px,#000 calc(100% - 110px),transparent);-webkit-mask-image:linear-gradient(180deg,transparent,#000 110px,#000 calc(100% - 110px),transparent)}
.cinematic.has-video>.scene-loop{opacity:1}
.sector-card .sector-loop{position:absolute;top:0;left:0;width:100%;height:245px;object-fit:cover;z-index:1;opacity:0;transition:opacity .8s cubic-bezier(.23,1,.32,1);pointer-events:none;filter:grayscale(.22) saturate(.82) brightness(.9) contrast(1.07)}
.sector-card.has-video .sector-loop{opacity:1}
@media(max-width:1100px){.sector-card .sector-loop{height:250px}}
@media(max-width:760px){.cinematic>.scene-loop{display:none}}
/* Leesbaarheidsborg diensten: titels winnen altijd van de hologramgloed. */
.services-section.has-video .service-item h3,.services-section.has-video .service-item p{text-shadow:0 1px 3px #000,0 2px 14px #000d,0 0 30px #000b}
.services-section.has-video .service-item .gold-ring{background:#03101ac9;box-shadow:0 0 22px #03101a}

/* Reviewpunten 16-09 (eigenaar "voer door"): warme halo, levende case-schermen, gedateerd voor-scherm met tekstregels. */
/* Punt 2: de blauwe sterrenhalo boven het logo wordt goudwarm getint zodat hij in de marmer/goud-familie valt. */
.handoff-hero .halo-warm{position:absolute;left:52%;top:2%;width:32%;height:26%;z-index:-2;pointer-events:none;background:radial-gradient(52% 60% at 50% 46%,#e8b96cd9 0%,#d9a45ac4 42%,#b9803e66 68%,transparent 88%);mix-blend-mode:color;opacity:.85;filter:blur(2px)}
.handoff-hero .halo-warm::after{content:'';position:absolute;inset:0;background:radial-gradient(50% 56% at 50% 46%,#ffdf9e33 0%,transparent 70%);mix-blend-mode:soft-light}
@media(max-width:760px){.handoff-hero .halo-warm{display:none}}
/* Punt 3: case-laptops ademen mee - langzame schermglans, alleen bij motion-enabled. */
.case-image{isolation:isolate}
.case-image::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(115deg,transparent 30%,#ffffff14 46%,#ffe9bd1f 50%,#ffffff14 54%,transparent 70%);transform:translateX(-130%);}
.motion-enabled .case-image::after{animation:case-sheen 8.5s cubic-bezier(.4,.1,.3,1) infinite}
@keyframes case-sheen{0%,55%{transform:translateX(-130%)}85%,100%{transform:translateX(130%)}}
@media(prefers-reduced-motion:reduce){.case-image::after{animation:none!important}}
/* Punt 4: het voor-scherm leest als echte gedateerde site - grijze tekstregels in de kaartjes. */
.comparison-before .wire-cards i{position:relative}
.comparison-before .wire-cards i::before{content:'';position:absolute;left:12%;right:16%;top:22%;height:8%;background:#8c96a3;border-radius:1px;box-shadow:0 260% 0 0 #b9c1cb,0 520% 0 0 #b9c1cb}
.comparison-before .wire-cards i::after{content:'';position:absolute;left:12%;right:40%;top:70%;height:9%;background:#3f6fb5;border-radius:1px;opacity:.75}
/* Parallaxclip: de geschaalde scene mag nooit buiten zijn sectie meten (flaky overflow op 1024/1920 verholpen). */
main picture.scene{overflow:hidden}
/* Rootclip: gemaskeerde/geschaalde medialagen mogen nooit een horizontale scroll-latch veroorzaken (Chromium scrollable-overflow-eigenaardigheid). */
html{overflow-x:hidden;overflow-x:clip}

/* Micropunten review ronde 2 (eigenaar "voer door"). */
/* 1: de actieve-stap-callout in de werkwijze wint van de waterval - donkere plaquette. */
.process-reading{background:linear-gradient(135deg,#0d1f28d9,#03101ae8 55%,#0f2029d9);border:1px solid #e2ba7370;border-radius:14px;padding:20px 22px 18px;backdrop-filter:blur(10px);box-shadow:inset 0 1px 0 #f7dda426,0 18px 40px #000609c4,0 0 30px #d9a95e1c}
.process-reading p[data-process-caption]{color:#f2ede1}
/* 2: ceremoniele plaquette groeit mee op brede schermen. */
@media(min-width:1440px){p.scene-plaque{font-size:clamp(10.5px,.8vw,14px);letter-spacing:.34em}}

/* Optie D 2026-09-16 (eigenaar): dienstenpanelen - gegraveerd goud + zegelringen + levend licht. Zelfde goudtaal als het hero-woordmerk. */
.services-section .service-item h3{display:flex;align-items:center;justify-content:center;gap:16px;letter-spacing:.05em;color:#eecd87;background:linear-gradient(110deg,transparent 42%,#fff7dd 50%,transparent 58%) no-repeat,linear-gradient(178deg,#fff3cf 6%,#eecd87 36%,#e0b56e 62%,#c99a55 85%,#dcb475);background-size:250% 100%,100% 100%;background-position:-160% 0,0 0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 2px 3px #000000d9) drop-shadow(0 -1px 0 #fff3c218) drop-shadow(0 0 16px #d9a95722)}
.services-section .service-item h3::before,.services-section .service-item h3::after{content:'';flex:none;width:26px;height:1px;background:linear-gradient(90deg,transparent,#d9b26f)}
.services-section .service-item h3::after{background:linear-gradient(270deg,transparent,#d9b26f)}
.motion-enabled .services-section .service-item h3{animation:dienst-titelglans 9s cubic-bezier(.4,.1,.3,1) infinite}
@keyframes dienst-titelglans{0%,58%{background-position:-160% 0,0 0}82%,100%{background-position:260% 0,0 0}}
/* Zegelring: dubbele rand, metaalzoom, donker glas - de vlakke UI-cirkel wordt een geslagen munt. */
.services-section .gold-ring{position:relative;border:1.5px solid #f0cd85;background:#04101ab8;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 0 0 1px #7a56209c,0 0 0 8px #04101a55,0 8px 22px #000b,inset 0 1px 0 #ffe9b845,inset 0 -1px 0 #6b48187a,inset 0 0 16px #57c4ff10;color:#f2d492}
.services-section .gold-ring::before{content:'';position:absolute;inset:-11px;border-radius:50%;border:1px solid #e7c07836;pointer-events:none}
.services-section .gold-ring::after{content:'';position:absolute;inset:-4px;border-radius:50%;padding:2px;background:conic-gradient(from 0deg,transparent 0 68%,#ffe9b8cc 80%,transparent 93%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;pointer-events:none;opacity:0}
.motion-enabled .services-section .gold-ring::after{opacity:.9;animation:zegelglans 12s linear infinite}
@keyframes zegelglans{to{transform:rotate(360deg)}}
/* Gouden lijn bloeit open bij binnenkomst; subtitels in champagne-ivoor. */
.services-section .service-item .gold-rule{width:0;opacity:0;transition:width 1.1s cubic-bezier(.23,1,.32,1) .25s,opacity .6s ease .25s}
.services-section .service-item.is-visible .gold-rule{width:44px;opacity:1}
.services-section .service-item p{color:#ead9b4;letter-spacing:.015em}
@media(prefers-reduced-motion:reduce){.services-section .service-item h3,.services-section .gold-ring::after{animation:none!important}.services-section .gold-ring::after{opacity:0}.services-section .service-item .gold-rule{width:44px;opacity:1;transition:none}}
/* Optie D leesbaarheidsschrijn: gegraveerd goud moet van de hologramgloed winnen - zachte donkere ovaal + blur achter iedere tekstgroep. */
.services-section .service-item{position:relative;isolation:isolate}
.services-section .service-item::before{content:'';position:absolute;left:50%;top:46%;width:120%;height:118%;transform:translate(-50%,-50%);z-index:-1;pointer-events:none;background:radial-gradient(50% 54% at 50% 46%,#020c14c4 0%,#020c148c 44%,#020c1433 68%,transparent 86%);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);-webkit-mask:radial-gradient(55% 60% at 50% 46%,#000 55%,transparent 90%);mask:radial-gradient(55% 60% at 50% 46%,#000 55%,transparent 90%)}
.services-section .service-item h3{filter:drop-shadow(0 1px 1px #000) drop-shadow(0 2px 4px #000000e6) drop-shadow(0 0 18px #d9a95733)}
.services-section .service-item p{text-shadow:0 1px 2px #000,0 2px 10px #000d}

/* Paneelcompositie 2026-09-16 (eigenaar-annotatie, paarse pijlen): icoon naar de top, tekst naar de voet, titel centraal - het hologram ademt ertussen. Desktop-plaatlayout only. */
@media(min-width:1051px){
 .service-grid{top:33.5%;height:37.5%}
 .services-section .service-item{justify-content:flex-start}
 .services-section .service-item h3{margin-top:auto}
 .services-section .service-item .gold-rule{margin:14px auto 0!important}
 .services-section .service-item p{margin-top:auto;margin-bottom:.85vw}
 .services-section .service-item::before{top:52%;height:40%;width:102%;background:radial-gradient(50% 52% at 50% 50%,#020c14cf 0%,#020c1488 40%,#020c142e 62%,transparent 80%)}
 .services-section .service-item::after{content:'';position:absolute;left:50%;bottom:-6%;width:114%;height:34%;transform:translateX(-50%);z-index:-1;pointer-events:none;background:radial-gradient(52% 58% at 50% 46%,#020c14b8 0%,#020c1470 52%,transparent 86%);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);-webkit-mask:radial-gradient(55% 62% at 50% 46%,#000 52%,transparent 88%);mask:radial-gradient(55% 62% at 50% 46%,#000 52%,transparent 88%)}
}
/* Verfijning 3: de gouden lijn wint ook op de torengloed. */
.services-section .service-item .gold-rule{background:#f4d18b;box-shadow:0 0 7px #ffd98066,0 1px 2px #0009}

/* Eigenaar-annotatie 16-09 (ronde paarse cirkels + blokken): zegel linksboven in het paneel, beschrijvingen in het gegraveerde titelgoud. */
@media(min-width:1051px){
 .services-section .service-item .gold-ring{align-self:flex-start;margin-left:.5%}
}
.services-section .service-item p{color:#eecd87;background:linear-gradient(178deg,#fff3cf 6%,#eecd87 36%,#e0b56e 62%,#c99a55 85%,#dcb475);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:.035em;text-shadow:none;filter:drop-shadow(0 1px 1px #000) drop-shadow(0 2px 4px #000000e0) drop-shadow(0 0 14px #d9a95726)}
/* Eigenaar 16-09: zegels als klein keurmerk in de hoek - de hologrammen zijn de ster. */
@media(min-width:1051px){
 .services-section .service-item .gold-ring{width:46px;height:46px;min-width:0;min-height:0;margin-left:0;border-width:1px}
 .services-section .service-item .gold-ring .icon{width:21px;height:21px}
 .services-section .service-item .gold-ring::before{inset:-6px}
 .services-section .service-item .gold-ring::after{inset:-3px;padding:1.5px}
}

/* Cases: laptopscherm-loops + voorgrondwater 2026-09-16 (governed: alleen OWNER_APPROVED, data-panel-loop-poorten). Video dekt exact de schermrect binnen de bezel-padding; de picture blijft de statische fallback eronder. */
.case-image video.case-loop{position:absolute;top:8px;left:6px;width:calc(100% - 12px);height:calc(100% - 16px);z-index:0;object-fit:cover;object-position:center top;border-radius:2px;opacity:0;transition:opacity .8s ease}
.case-image.has-video video.case-loop{opacity:1}
@media(max-width:1100px){.case-image video.case-loop{top:5px;left:3px;width:calc(100% - 6px);height:calc(100% - 10px)}}
@media(max-width:760px){.case-image video.case-loop{top:7px;left:4px;width:calc(100% - 8px);height:calc(100% - 14px)}}

/* Comparison-verbouwing 2026-09-16 ("voer door"): VOOR als geloofwaardige gedateerde site, NA als levende mini-Naxara (hergebruik goedgekeurd cases-water), glasglans, gouden schuiflijn met voorloopgloed. */
.comparison-before{filter:saturate(.82)}
.comparison-before .mini-nav{height:auto;padding:9px 15px 8px}
.comparison-before .mini-nav .mini-menu{float:none;display:block;margin-top:5px;font:11px/1.4 Arial,Helvetica,sans-serif;color:#c6d0da;letter-spacing:0}
.comparison-before .mini-links{margin-top:12px}
.comparison-before .mini-link{font:12px/1.5 Arial,Helvetica,sans-serif;color:#1a4fa0;text-decoration:underline;margin-right:14px}
.comparison-before .mini-news{margin-top:15px;max-width:42%;border:1px solid #cfd6dd;background:#eef1f4;padding:8px 12px;font:11px/1.55 Arial,Helvetica,sans-serif;color:#4a5560;display:grid;gap:2px}
.comparison-before .mini-news b{color:#22303c;font-size:12px}
.comparison-before .mini-news u{color:#1a4fa0}
.comparison-before .mini-news small{font-size:10px;color:#7c8792}
.comparison-before .mini-footer{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:7px 22px;background:#d3d7da;border-top:1px solid #b9c1cb;font:10px/1.4 Arial,Helvetica,sans-serif;color:#5c6670}
.comparison-before .mini-visitors{font:10px/1 'Courier New',monospace;color:#7c8792;letter-spacing:.05em;white-space:nowrap}
@media(max-width:760px){.comparison-before .mini-news,.comparison-before .mini-footer{display:none}}
.comparison-after .mini-nav{text-align:right;padding-right:18px}
.comparison-after video.na-loop{position:absolute;inset:0;z-index:-1;width:100%;height:100%;object-fit:cover;object-position:center;filter:brightness(.62) saturate(.95);opacity:0;transition:opacity 1s ease}
.comparison-after.has-video video.na-loop{opacity:1}
.comparison-after.has-video .comparison-backdrop{opacity:0;transition:opacity 1s ease}
@media(max-width:760px){.comparison-after video.na-loop{display:none}}
.comparison-after .mini-eyebrow{font:600 8px/1 var(--sans);letter-spacing:.34em;text-transform:uppercase;color:#e7c98b;margin:0 0 10px;text-shadow:0 1px 6px #000}
.comparison-after .mini-content h3{text-shadow:none;background:linear-gradient(178deg,#fff3cf 6%,#eecd87 36%,#e0b56e 62%,#c99a55 85%,#dcb475);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 1px 1px #00000091) drop-shadow(0 3px 9px #00000078)}
.comparison-after .mini-rule{display:block;width:46px;height:2px;margin:13px 0 0;background:linear-gradient(90deg,#f4d18b,#8a6527);box-shadow:0 0 9px #f0c67f66}
.comparison-stage::after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(115deg,transparent 42%,#ffffff08 47%,#ffffff10 50%,#ffffff05 55%,transparent 62%),radial-gradient(140% 110% at 50% 45%,transparent 63%,#00000040 100%)}
.comparison-divider{width:2px;background:linear-gradient(#ffdfa0cc,#ffefca,#ffdfa0cc)}
.comparison-divider::before{content:'';position:absolute;top:0;bottom:0;left:2px;width:58px;background:linear-gradient(90deg,#ffe9bd33,transparent);pointer-events:none}
.comparison-divider span{width:44px;height:44px;font-size:19px;letter-spacing:2px;background:#08212af2;box-shadow:0 0 22px #ebbc6788,inset 0 0 9px #f7d99c22}
.monitor-labels span:first-child{transition:opacity .3s ease}

/* Contactsectie-altaarwand 2026-09-16 ("voer door"): gegraveerde titels, juwelenrek, gouden archief, gouden balie. */
.contact-grid>.glass-panel,.contact-grid>.webcheck{position:relative;border-radius:7px}
.contact-grid>.glass-panel::before,.contact-grid>.webcheck::before{content:'';position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,#f0cd85b8 28% 72%,transparent);pointer-events:none}
.contact-grid>.glass-panel::after,.contact-grid>.webcheck::after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:radial-gradient(120% 55% at 50% 0%,#ffe9b80c,transparent 55%)}
.contact-grid .eyebrow{font:600 11px/1.4 var(--sans);letter-spacing:.34em;text-transform:uppercase;color:#c8b384;margin:0 0 12px}
.contact-grid .integrations>h2,.contact-grid .faq>h3,.contact-grid .webcheck>h3{letter-spacing:.04em;border-bottom:0;padding-bottom:0;margin-bottom:14px;color:#eecd87;background:linear-gradient(110deg,transparent 42%,#fff7dd 50%,transparent 58%) no-repeat,linear-gradient(178deg,#fff3cf 6%,#eecd87 36%,#e0b56e 62%,#c99a55 85%,#dcb475);background-size:250% 100%,100% 100%;background-position:-160% 0,0 0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 3px #000000d9) drop-shadow(0 0 14px #d9a95720)}
.motion-enabled .contact-grid .integrations>h2,.motion-enabled .contact-grid .faq>h3,.motion-enabled .contact-grid .webcheck>h3{animation:dienst-titelglans 11s cubic-bezier(.4,.1,.3,1) infinite}
.contact-grid .integrations>.gold-rule,.contact-grid .faq>.gold-rule,.contact-grid .webcheck>.gold-rule{display:block;width:46px;height:2px;margin:0 0 18px;background:linear-gradient(90deg,#f4d18b,#8a6527);box-shadow:0 0 9px #f0c67f55}
/* juwelenrek */
.contact-grid .integrations ul{display:grid;grid-template-columns:1fr 1fr;gap:10px;border-top:0;padding-top:2px}
.contact-grid .integrations li{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:98px;padding:14px 8px;border:1px solid #d5b26f4d;border-radius:6px;background:linear-gradient(150deg,#12282ecf,#03161cd9);box-shadow:inset 0 1px 0 #ffe9b826,0 6px 14px #0006;text-align:center;transition:border-color .3s ease,box-shadow .3s ease,transform .3s ease}
.contact-grid .integrations li:hover{border-color:#f0cd85;box-shadow:inset 0 1px 0 #ffe9b83a,0 10px 20px #0008,0 0 18px #e7c07822;transform:translateY(-2px)}
.contact-grid .integrations .mark-name{font:400 9.5px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#e9d9b4}
.contact-grid .integrations .integration-mark{width:44px;height:44px;border-radius:50%;border:1px solid #e7c07866;background:#04101ab8;box-shadow:0 0 0 4px #04101a4d,inset 0 1px 0 #ffe9b83a;padding:9px}
.motion-enabled .integrations[data-reveal] li{transition:opacity .6s ease,transform .6s ease,border-color .3s ease,box-shadow .3s ease}
.motion-enabled .integrations[data-reveal]:not(.is-visible) li{opacity:0;transform:translateY(10px)}
.integrations.is-visible li:nth-child(1){transition-delay:.05s}.integrations.is-visible li:nth-child(2){transition-delay:.1s}.integrations.is-visible li:nth-child(3){transition-delay:.15s}.integrations.is-visible li:nth-child(4){transition-delay:.2s}.integrations.is-visible li:nth-child(5){transition-delay:.25s}.integrations.is-visible li:nth-child(6){transition-delay:.3s}
.contact-grid .integrations>.fineprint{display:table;margin:16px auto 0;padding:7px 15px;border:1px solid #d9b26f55;border-radius:20px;background:#03121bd6;color:#e0d2ae;letter-spacing:.05em}
/* gouden archief */
.contact-grid .faq{counter-reset:faqn}
.contact-grid .faq details{counter-increment:faqn;border:1px solid #b7a06333;border-radius:5px;background:linear-gradient(130deg,#0a2127b8,#00141aad);transition:border-color .3s ease,box-shadow .3s ease}
.contact-grid .faq details[open]{border-color:#e7c078a8;box-shadow:0 0 16px #e7c07826,inset 0 1px 0 #ffe9b826;background:linear-gradient(130deg,#0e262cd6,#02161cd9)}
.contact-grid .faq summary{gap:13px}
.contact-grid .faq summary::before{content:counter(faqn,decimal-leading-zero);flex:none;font:400 13px/1 var(--serif);letter-spacing:.06em;color:#eecd87;background:linear-gradient(178deg,#fff3cf,#cf9f52 70%,#a3763a);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 1px 1px #000c)}
.contact-grid .faq summary .icon{margin-left:auto;color:#eecd87;transition:transform .35s cubic-bezier(.23,1,.32,1)}
.contact-grid .faq details[open] summary .icon{transform:rotate(45deg)}
.contact-grid .faq details p{color:#efe9d8;font-size:12.5px;line-height:1.65;padding:2px 13px 16px 40px}
.contact-grid .faq-signature{display:flex;flex-direction:column;align-items:center;gap:6px;border-top:1px solid #d3b57733;margin-top:20px;padding-top:24px;text-align:center}
.faq-seal{position:relative;display:inline-grid;place-items:center;width:86px;height:86px;border-radius:50%;border:1.5px solid #f0cd85;background:#04101ab8;box-shadow:0 0 0 1px #7a56209c,0 0 0 7px #04101a55,0 8px 22px #000b,inset 0 1px 0 #ffe9b845;margin-bottom:10px}
.faq-seal::before{content:'';position:absolute;inset:-9px;border-radius:50%;border:1px solid #e7c07836}
.faq-seal::after{content:'';position:absolute;inset:-4px;border-radius:50%;padding:2px;background:conic-gradient(from 0deg,transparent 0 68%,#ffe9b8cc 80%,transparent 93%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;opacity:0}
.motion-enabled .faq-seal::after{opacity:.9;animation:zegelglans 12s linear infinite}
.faq-seal .emblem{width:54px;height:auto}
.contact-grid .faq-signature p{font:400 10px/1.9 var(--sans);letter-spacing:.3em;text-transform:uppercase;color:#eecd87;background:linear-gradient(178deg,#fff3cf,#cf9f52 78%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
/* gouden balie */
.contact-grid .webcheck .field label{font:600 12px/1.3 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:#e7c98b}
.contact-grid .webcheck .field input,.contact-grid .webcheck .field textarea{background:linear-gradient(160deg,#071d24d9,#02141acc);border:1px solid #caa76a52;border-radius:5px;color:#f4f2e9;box-shadow:inset 0 1px 2px #0009,inset 0 -1px 0 #ffe9b81a;transition:border-color .25s ease,box-shadow .25s ease}
.contact-grid .webcheck .field input:focus-visible,.contact-grid .webcheck .field textarea:focus-visible{outline:0;border-color:#f0cd85;box-shadow:inset 0 1px 2px #0009,0 0 0 1px #f0cd8566,0 0 16px #e7c07833}
.contact-grid .webcheck .field input::placeholder,.contact-grid .webcheck .field textarea::placeholder{color:#9fb0ad8f}
.contact-grid .website-choice{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.contact-grid .website-choice input{appearance:none;-webkit-appearance:none;width:18px;height:18px;border:1px solid #caa76a8a;border-radius:4px;background:#04141a;display:grid;place-items:center;flex:none;margin:0;transition:border-color .2s ease,box-shadow .2s ease}
.contact-grid .website-choice input:checked{border-color:#f0cd85;box-shadow:0 0 10px #e7c07840}
.contact-grid .website-choice input:checked::before{content:'';width:10px;height:10px;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0,43% 62%);background:linear-gradient(178deg,#fff3cf,#cf9f52)}
.contact-grid .website-choice input:focus-visible{outline:2px solid var(--gold-bright);outline-offset:2px}
.contact-grid .webcheck .demo-notice{display:table;margin:16px auto 10px;padding:8px 16px;border:1px solid #d9b26f66;border-radius:20px;background:#03121bd6;color:#e9d9b4;font-size:11px;letter-spacing:.05em;text-align:center}
.contact-grid .webcheck .form-progress{position:relative;font:400 9.5px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#cfc7ae;text-align:center;padding-top:12px;margin:14px 0 4px;background:none}
.contact-grid .webcheck .form-progress::before{content:'';position:absolute;top:0;left:12%;right:12%;height:1px;background:#3a4a4acc}
.contact-grid .webcheck .form-progress::after{content:'';position:absolute;top:0;left:12%;width:calc(76% * var(--form-progress,0));height:1px;background:linear-gradient(90deg,#f4d18b,#caa05c);box-shadow:0 0 8px #f0c67f88;transition:width .4s ease}
@media(max-width:760px){.contact-grid .integrations li{min-height:88px}}

/* Contactsectie-altaarwand 2026-09-16 ("voer door"): gegraveerde titels, juwelenrek, gouden archief, gouden balie. */
.contact-grid>.glass-panel,.contact-grid>.webcheck{position:relative;border-radius:7px}
.contact-grid>.glass-panel::before,.contact-grid>.webcheck::before{content:'';position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,#f0cd85b8 28% 72%,transparent);pointer-events:none}
.contact-grid>.glass-panel::after,.contact-grid>.webcheck::after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:radial-gradient(120% 55% at 50% 0%,#ffe9b80c,transparent 55%)}
.contact-grid .eyebrow{font:600 11px/1.4 var(--sans);letter-spacing:.34em;text-transform:uppercase;color:#c8b384;margin:0 0 12px}
.contact-grid .integrations>h2,.contact-grid .faq>h3,.contact-grid .webcheck>h3{letter-spacing:.04em;border-bottom:0;padding-bottom:0;margin-bottom:14px;color:#eecd87;background:linear-gradient(110deg,transparent 42%,#fff7dd 50%,transparent 58%) no-repeat,linear-gradient(178deg,#fff3cf 6%,#eecd87 36%,#e0b56e 62%,#c99a55 85%,#dcb475);background-size:250% 100%,100% 100%;background-position:-160% 0,0 0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 3px #000000d9) drop-shadow(0 0 14px #d9a95720)}
.motion-enabled .contact-grid .integrations>h2,.motion-enabled .contact-grid .faq>h3,.motion-enabled .contact-grid .webcheck>h3{animation:dienst-titelglans 11s cubic-bezier(.4,.1,.3,1) infinite}
.contact-grid .integrations>.gold-rule,.contact-grid .faq>.gold-rule,.contact-grid .webcheck>.gold-rule{display:block;width:46px;height:2px;margin:0 0 18px;background:linear-gradient(90deg,#f4d18b,#8a6527);box-shadow:0 0 9px #f0c67f55}
/* juwelenrek */
.contact-grid .integrations ul{display:grid;grid-template-columns:1fr 1fr;gap:10px;border-top:0;padding-top:2px}
.contact-grid .integrations li{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:98px;padding:14px 8px;border:1px solid #d5b26f4d;border-radius:6px;background:linear-gradient(150deg,#12282ecf,#03161cd9);box-shadow:inset 0 1px 0 #ffe9b826,0 6px 14px #0006;text-align:center;transition:border-color .3s ease,box-shadow .3s ease,transform .3s ease}
.contact-grid .integrations li:hover{border-color:#f0cd85;box-shadow:inset 0 1px 0 #ffe9b83a,0 10px 20px #0008,0 0 18px #e7c07822;transform:translateY(-2px)}
.contact-grid .integrations .mark-name{font:400 9.5px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#e9d9b4}
.contact-grid .integrations .integration-mark{width:44px;height:44px;border-radius:50%;border:1px solid #e7c07866;background:#04101ab8;box-shadow:0 0 0 4px #04101a4d,inset 0 1px 0 #ffe9b83a;padding:9px}
.motion-enabled .integrations[data-reveal] li{transition:opacity .6s ease,transform .6s ease,border-color .3s ease,box-shadow .3s ease}
.motion-enabled .integrations[data-reveal]:not(.is-visible) li{opacity:0;transform:translateY(10px)}
.integrations.is-visible li:nth-child(1){transition-delay:.05s}.integrations.is-visible li:nth-child(2){transition-delay:.1s}.integrations.is-visible li:nth-child(3){transition-delay:.15s}.integrations.is-visible li:nth-child(4){transition-delay:.2s}.integrations.is-visible li:nth-child(5){transition-delay:.25s}.integrations.is-visible li:nth-child(6){transition-delay:.3s}
.contact-grid .integrations>.fineprint{display:table;margin:16px auto 0;padding:7px 15px;border:1px solid #d9b26f55;border-radius:20px;background:#03121bd6;color:#e0d2ae;letter-spacing:.05em}
/* gouden archief */
.contact-grid .faq{counter-reset:faqn}
.contact-grid .faq details{counter-increment:faqn;border:1px solid #b7a06333;border-radius:5px;background:linear-gradient(130deg,#0a2127b8,#00141aad);transition:border-color .3s ease,box-shadow .3s ease}
.contact-grid .faq details[open]{border-color:#e7c078a8;box-shadow:0 0 16px #e7c07826,inset 0 1px 0 #ffe9b826;background:linear-gradient(130deg,#0e262cd6,#02161cd9)}
.contact-grid .faq summary{gap:13px}
.contact-grid .faq summary::before{content:counter(faqn,decimal-leading-zero);flex:none;font:400 13px/1 var(--serif);letter-spacing:.06em;color:#eecd87;background:linear-gradient(178deg,#fff3cf,#cf9f52 70%,#a3763a);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 1px 1px #000c)}
.contact-grid .faq summary .icon{margin-left:auto;color:#eecd87;transition:transform .35s cubic-bezier(.23,1,.32,1)}
.contact-grid .faq details[open] summary .icon{transform:rotate(45deg)}
.contact-grid .faq details p{color:#efe9d8;font-size:12.5px;line-height:1.65;padding:2px 13px 16px 40px}
.contact-grid .faq-signature{display:flex;flex-direction:column;align-items:center;gap:6px;border-top:1px solid #d3b57733;margin-top:20px;padding-top:24px;text-align:center}
.faq-seal{position:relative;display:inline-grid;place-items:center;width:86px;height:86px;border-radius:50%;border:1.5px solid #f0cd85;background:#04101ab8;box-shadow:0 0 0 1px #7a56209c,0 0 0 7px #04101a55,0 8px 22px #000b,inset 0 1px 0 #ffe9b845;margin-bottom:10px}
.faq-seal::before{content:'';position:absolute;inset:-9px;border-radius:50%;border:1px solid #e7c07836}
.faq-seal::after{content:'';position:absolute;inset:-4px;border-radius:50%;padding:2px;background:conic-gradient(from 0deg,transparent 0 68%,#ffe9b8cc 80%,transparent 93%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;opacity:0}
.motion-enabled .faq-seal::after{opacity:.9;animation:zegelglans 12s linear infinite}
.faq-seal .emblem{width:54px;height:auto}
.contact-grid .faq-signature p{font:400 10px/1.9 var(--sans);letter-spacing:.3em;text-transform:uppercase;color:#eecd87;background:linear-gradient(178deg,#fff3cf,#cf9f52 78%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
/* gouden balie */
.contact-grid .webcheck .field label{font:600 12px/1.3 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:#e7c98b}
.contact-grid .webcheck .field input,.contact-grid .webcheck .field textarea{background:linear-gradient(160deg,#071d24d9,#02141acc);border:1px solid #caa76a52;border-radius:5px;color:#f4f2e9;box-shadow:inset 0 1px 2px #0009,inset 0 -1px 0 #ffe9b81a;transition:border-color .25s ease,box-shadow .25s ease}
.contact-grid .webcheck .field input:focus-visible,.contact-grid .webcheck .field textarea:focus-visible{outline:0;border-color:#f0cd85;box-shadow:inset 0 1px 2px #0009,0 0 0 1px #f0cd8566,0 0 16px #e7c07833}
.contact-grid .webcheck .field input::placeholder,.contact-grid .webcheck .field textarea::placeholder{color:#9fb0ad8f}
.contact-grid .website-choice{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.contact-grid .website-choice input{appearance:none;-webkit-appearance:none;width:18px;height:18px;border:1px solid #caa76a8a;border-radius:4px;background:#04141a;display:grid;place-items:center;flex:none;margin:0;transition:border-color .2s ease,box-shadow .2s ease}
.contact-grid .website-choice input:checked{border-color:#f0cd85;box-shadow:0 0 10px #e7c07840}
.contact-grid .website-choice input:checked::before{content:'';width:10px;height:10px;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0,43% 62%);background:linear-gradient(178deg,#fff3cf,#cf9f52)}
.contact-grid .website-choice input:focus-visible{outline:2px solid var(--gold-bright);outline-offset:2px}
.contact-grid .webcheck .demo-notice{display:table;margin:16px auto 10px;padding:8px 16px;border:1px solid #d9b26f66;border-radius:20px;background:#03121bd6;color:#e9d9b4;font-size:11px;letter-spacing:.05em;text-align:center}
.contact-grid .webcheck .form-progress{position:relative;font:400 9.5px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#cfc7ae;text-align:center;padding-top:12px;margin:14px 0 4px;background:none}
.contact-grid .webcheck .form-progress::before{content:'';position:absolute;top:0;left:12%;right:12%;height:1px;background:#3a4a4acc}
.contact-grid .webcheck .form-progress::after{content:'';position:absolute;top:0;left:12%;width:calc(76% * var(--form-progress,0));height:1px;background:linear-gradient(90deg,#f4d18b,#caa05c);box-shadow:0 0 8px #f0c67f88;transition:width .4s ease}
@media(max-width:760px){.contact-grid .integrations li{min-height:88px}}

.contact-grid .integrations>.fineprint{font-size:11px;line-height:1.5}
.contact-grid .webcheck .form-progress{display:block}
.contact-grid .webcheck .form-progress::before{width:auto}

/* Luxe monitor + schuifrichting 2026-09-16 (eigenaaropdracht foto 1). */
/* Richtingsfix: de onzichtbare slider volgt nu de sleeprichting (rechts = divider rechts); toetsen volgen automatisch mee. */
.comparison-stage input[type=range]{direction:rtl}
/* Titanium-goud beeldscherm */
.monitor-body{position:relative;background:linear-gradient(160deg,#16191b,#07090b 45%,#0b0e10 72%,#111416);border:1px solid #23282b;padding:12px 12px 15px;border-radius:14px;box-shadow:0 0 0 1px #000,0 0 0 2px #d9b26f42,inset 0 1px 0 #ffe9b824,inset 0 -1px 0 #00000090,0 32px 65px #000d,0 12px 26px #000a,-20px 26px 55px #00000066}
.monitor-body::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,#ffffff0d,transparent 32%),linear-gradient(295deg,#f0cd8516,transparent 38%)}
.monitor-body::after{content:'';position:absolute;top:5px;left:50%;translate:-50% 0;width:4px;height:4px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#41606c,#0a1116 70%);box-shadow:0 0 3px #000c}
.monitor-labels{border-bottom:0;padding:9px 0 13px;margin-bottom:5px}
.monitor-labels span{border:1px solid #9aa4a04a;border-radius:30px;background:#0b1416c4;color:#cfd6cd;padding:6px 22px;letter-spacing:.24em;font-size:9.5px;transition:opacity .3s ease}
.monitor-labels span:last-child{background:linear-gradient(140deg,#ffedc1,#d29b52);color:#0a1013;border-color:#f5d9a4;box-shadow:0 0 16px #edbd6338,inset 0 1px 0 #fff7dd7a;font-weight:600}
.comparison-stage{border:1px solid #000;border-radius:9px;box-shadow:0 0 0 1px #2c3336,inset 0 0 0 1px #ffffff0a}
/* Slanke sokkel met marmerreflectie en warme ondergloed */
.monitor-foot{height:82px;width:15%;background:linear-gradient(90deg,#1a1e20,#0a0d0e 30%,#282b2d 50%,#0a0d0e 70%,#191d1f);clip-path:polygon(37% 0,63% 0,69% 72%,100% 82%,100% 100%,0 100%,0 82%,31% 72%);filter:drop-shadow(0 7px 7px #000c)}
.comparison{isolation:isolate}
.comparison::before{content:'';position:absolute;left:26%;right:26%;bottom:-14px;height:26px;background:radial-gradient(50% 100% at 50% 0%,#000000b8,transparent 72%);filter:blur(5px);z-index:-1;pointer-events:none}
.comparison::after{content:'';position:absolute;left:10%;right:10%;bottom:-30px;height:64px;background:radial-gradient(50% 100% at 50% 0%,#e7c0781f,transparent 70%);filter:blur(7px);z-index:-1;pointer-events:none}
@media(max-width:760px){.monitor-foot{height:48px;width:24%}.comparison::after{bottom:-18px;height:40px}}

/* Fotorealistisch luxescherm 2026-09-16 (JA_RUNWAY_GENEREER luxescherm): gegenereerd frame (nano-banana-pro, taak 37e8d888) met uitgesneden schermgat; de werkende VOOR/NA-stage ligt exact in het gat (gemeten: scherm 720x407px in crop 770x604). */
.monitor-body{background:none;border:0;box-shadow:none;padding:0;border-radius:0;aspect-ratio:770/604;position:relative}
.monitor-body::before{content:none}
.monitor-body::after{content:'';position:absolute;inset:0;width:auto;height:auto;translate:none;border-radius:0;box-shadow:none;background:url('monitor-frame.png') center/100% 100% no-repeat;pointer-events:none;z-index:5;filter:drop-shadow(0 26px 45px #000c) drop-shadow(-14px 18px 38px #00000059)}
.comparison-stage{position:absolute;left:3.25%;top:3.81%;width:93.51%;height:67.38%;aspect-ratio:auto;border:0;border-radius:2px;box-shadow:none;overflow:hidden}
.monitor-labels{position:absolute;left:0;right:0;top:-52px;z-index:6;display:flex;justify-content:space-between;padding:0 5%;margin:0;border:0}
.monitor-foot{display:none}
.comparison::before{left:30%;right:30%;bottom:6px;height:22px}
.comparison::after{left:14%;right:14%;bottom:-12px;height:52px}
@media(max-width:760px){.monitor-labels{top:-46px}}

/* Cinematic zwenk 2026-09-17 (eigenaar: kwartslag/zwenk): duidelijk zichtbare 3D-draai; stage en frame draaien mee als een echt object. */
.comparison{perspective:1150px}
.monitor-body{transform:rotateY(-13deg) rotateZ(-1.2deg);transform-origin:52% 78%}
@media(max-width:1100px){.monitor-body{transform:rotateY(-9deg)}}
@media(max-width:760px){.monitor-body{transform:none}}

/* 2026-09-17: sectorvensters langer (eigenaar-annotatie foto 1 vs 2) + vier transformatie-verfijningen naar 9,4. */
.sector-card>picture{height:330px}
.sector-card .sector-loop{height:330px}
@media(max-width:1100px){.sector-card>picture{height:300px}.sector-card .sector-loop{height:300px}}
@media(max-width:760px){.sector-card>picture{height:235px}.sector-card .sector-loop{height:235px}}
/* 1. VOOR/NA-chips verankerd aan het scherm: vlak boven de schermhoeken, draaien mee in de 3D-laag */
.monitor-labels{top:calc(3.81% - 42px);padding:0 3.25%}
.monitor-labels span{padding:5px 16px;font-size:10px;letter-spacing:.26em}
/* 2. glasreflectie die meeschuift met de schuifpositie */
.comparison-stage::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(105deg,transparent 34%,#ffffff0e 46%,#ffe9bd12 50%,#ffffff07 54%,transparent 66%) no-repeat;background-size:230% 100%;background-position:calc((100 - var(--split,55)) * 1%) 0;transition:background-position .25s ease}
/* 3. royaler handvat met adem-puls tot de eerste aanraking */
.comparison-divider span{width:52px;height:52px;font-size:21px}
@keyframes handvat-adem{0%,100%{box-shadow:0 0 18px #ebbc6766,inset 0 0 9px #f7d99c22}50%{box-shadow:0 0 34px #ebbc67b8,inset 0 0 12px #f7d99c33}}
.motion-enabled .comparison:not(.is-touched) .comparison-divider span{animation:handvat-adem 2.6s ease-in-out infinite}
/* 4. steviger voetcontact op het marmer */
.comparison::before{left:24%;right:24%;bottom:2px;height:26px;background:radial-gradient(50% 100% at 50% 0%,#000000d6,transparent 74%)}

.sector-content{z-index:2}

/* Capability-plaquette 2026-09-17 (eigenaar foto 1): gloeiende gouden glasbalk met ring-iconen en diamant-scheiders. */
.capability-rail{padding:20px 14px 16px;border-radius:18px;border:1px solid #f0cd8566;background:linear-gradient(160deg,#f7e3b41f,#c89a5a12 45%,#03141a55),radial-gradient(130% 150% at 50% -30%,#ffe9b83d,#ffe9b80d 45%,transparent 72%),#04141aa8;box-shadow:0 0 0 1px #7a562030,0 20px 55px #000b,0 0 48px #e7c07830,inset 0 1px 0 #fff3cf45,inset 0 -1px 0 #6b481838;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.capability-rail>div{position:relative;border-right:0;gap:11px;padding:2px 10px}
.capability-rail>div+div::before{content:'';position:absolute;left:0;top:50%;width:7px;height:7px;translate:-50% -50%;rotate:45deg;background:linear-gradient(135deg,#ffe9b8,#a3763a);box-shadow:0 0 9px #f0c67f99}
.capability-rail .icon{width:52px;height:52px;padding:13px;color:#f2d492;border:1.5px solid #e7c078cc;border-radius:50%;background:#04101a94;box-shadow:0 0 0 1px #7a562070,0 0 0 5px #ffe9b80f,0 6px 16px #0008,inset 0 1px 0 #ffe9b83d;margin:0 auto}
.capability-rail h3{color:#f6e3b8;letter-spacing:.14em;text-shadow:0 1px 6px #000}
.capability-rail .gold-rule{display:none!important}
.capability-rail::after{content:'';position:absolute;left:6%;right:6%;bottom:-26px;height:46px;background:radial-gradient(50% 100% at 50% 0%,#e7c07830,transparent 70%);filter:blur(8px);pointer-events:none;z-index:-1}
@media(max-width:1100px){.capability-rail>div+div::before{display:none}.capability-rail::after{bottom:-16px;height:30px}}

/* Plaquette v2 2026-09-17 — 1:1 met eigenaarreferentie: lichtgevend goudglas, donkere bronzen labels, hairlines+diamant op de icoonas, rise+gloed-entree. */
.capability-rail{padding:22px 12px 18px;border:1px solid #ffe9b8d9;border-radius:18px;background:linear-gradient(170deg,#f9e7bfd9,#e9c98cc9 38%,#caa263bd 70%,#b89052c4),radial-gradient(120% 170% at 50% -30%,#fff6ddd9,transparent 62%);box-shadow:0 0 0 1px #8a652761,0 0 34px #f2cd8a8c,0 0 90px #e7c0784d,0 24px 60px #000b,inset 0 1px 0 #fff9e8,inset 0 -2px 7px #8a652752;backdrop-filter:blur(8px) saturate(1.08);-webkit-backdrop-filter:blur(8px) saturate(1.08)}
.capability-rail>div{justify-content:flex-start}
.capability-rail>div+div::before{content:'';position:absolute;left:0;top:10%;bottom:10%;width:1px;translate:-50% 0;rotate:none;background:linear-gradient(180deg,transparent,#8a652799 22% 78%,transparent);box-shadow:none;height:auto}
.capability-rail>div+div::after{content:'';position:absolute;left:0;top:30px;width:8px;height:8px;translate:-50% -50%;rotate:45deg;background:linear-gradient(135deg,#fff3cf,#a3763a);box-shadow:0 0 8px #fff3cf99,0 0 3px #8a6527}
.capability-rail .icon{color:#f2d492;background:#241a0cd9;border:1.5px solid #6b4818;box-shadow:0 0 0 1px #ffe9b866,0 4px 12px #6b481866,inset 0 1px 0 #ffe9b83d}
.capability-rail h3{color:#2b2010;min-height:30px;text-shadow:0 1px 0 #fff3cf59;font-weight:600}
/* entree: zachte rise + gloed die even aanzwelt (sectie-in-view, motion-gated) */
.motion-enabled .capability-rail{transition:opacity .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1)}
.motion-enabled .possibilities-section:not(.in-view) .capability-rail{opacity:0;transform:translateY(26px)}
@keyframes plaquette-bloei{0%{box-shadow:0 0 0 1px #8a652761,0 0 10px #f2cd8a30,0 0 24px #e7c07820,0 24px 60px #000b,inset 0 1px 0 #fff9e8,inset 0 -2px 7px #8a652752}45%{box-shadow:0 0 0 1px #8a652761,0 0 52px #f2cd8ac9,0 0 130px #e7c07880,0 24px 60px #000b,inset 0 1px 0 #fff9e8,inset 0 -2px 7px #8a652752}100%{box-shadow:0 0 0 1px #8a652761,0 0 34px #f2cd8a8c,0 0 90px #e7c0784d,0 24px 60px #000b,inset 0 1px 0 #fff9e8,inset 0 -2px 7px #8a652752}}
.motion-enabled .possibilities-section.in-view .capability-rail{animation:plaquette-bloei 1.9s cubic-bezier(.23,1,.32,1) .25s 1 both}
@media(max-width:1100px){.capability-rail>div+div::before,.capability-rail>div+div::after{display:none}}

/* Micro-loops 2026-09-17 (integreer alles): levende werelden achter goudglas in plaquettevakken en pijlers; labels blijven HTML erbovenop. */
.micro-loop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:0;transition:opacity .9s ease;pointer-events:none}
.has-video>.micro-loop{opacity:1}
/* plaquettevakken: video onder een goudglas-sluier zodat bronzen tekst leesbaar blijft */
.capability-rail>div{overflow:hidden;border-radius:12px}
.cap-front{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:11px;width:100%;padding:2px 0}
.cap-front::before{content:'';position:absolute;inset:-6px -12px;z-index:-1;background:linear-gradient(168deg,#f7e3b4b0,#e2be83a6 45%,#bc945acc);transition:background .4s ease}
.capability-rail>div:hover .cap-front::before{background:linear-gradient(168deg,#f7e3b48c,#e2be8380 45%,#bc945aa8)}
.cap-front .gold-rule{display:none!important}
/* pijlers: donkere vitrines met de wereld erin, lichte tekst erbovenop */
.mini-pillars>div{position:relative;overflow:hidden;border-radius:9px;border:1px solid #d5b26f40;background:#03141a9c;padding:12px 13px;box-shadow:inset 0 1px 0 #ffe9b81f,0 8px 18px #0007}
.pillar-front{position:relative;z-index:2;display:flex;align-items:flex-start;gap:11px}
.pillar-front::before{content:'';position:absolute;inset:-12px -13px;z-index:-1;background:linear-gradient(120deg,#021016a6,#021016e0 70%)}
.pillar-front>.icon{flex:none;color:#f2d492;margin-top:2px}
@media(max-width:760px){.mini-pillars>div{padding:10px 11px}}

/* Micro-afwerking v2: sluier dekt het hele vak; scheiders vervallen (vakken zijn nu eigen vitrines); klein gap. */
.capability-rail{gap:10px}
.capability-rail>div{display:flex;align-items:stretch;padding:0}
.capability-rail>div+div::before,.capability-rail>div+div::after{display:none}
.cap-front{flex:1;justify-content:center;padding:16px 8px 14px}
.cap-front::before{inset:0}

@media(max-width:760px){.mini-pillars{gap:8px}.mini-pillars>div{flex:1 1 31%;padding:9px 7px}.pillar-front{gap:7px}}

/* Plaquette klikbaar 2026-09-17 (voer door): stille funnel-links over de vitrines. */
.cap-link{position:absolute;inset:0;z-index:3;border-radius:12px}
.cap-link:focus-visible{outline:2px solid var(--gold-bright);outline-offset:3px}
.capability-rail>div:has(.cap-link){cursor:pointer}
.capability-rail>div:hover .cap-front h3{filter:brightness(1.15)}

/* Liquid gold glass 2026-09-17 (eigenaar: 21st.dev liquid glass): doorschijnend lensglas i.p.v. dekkend goud — scène vloeit erdoorheen, randen buigen licht, trage specular over het oppervlak. */
.capability-rail{border-radius:26px;border:1px solid #ffffff59;background:linear-gradient(165deg,#fff6dd3d,#e9c98c2e 40%,#b8905226),radial-gradient(130% 170% at 50% -30%,#fff6dd66,transparent 60%);backdrop-filter:blur(20px) saturate(1.45) brightness(1.06);-webkit-backdrop-filter:blur(20px) saturate(1.45) brightness(1.06);box-shadow:0 0 0 1px #8a65273d,inset 0 1.5px 0 #ffffffb8,inset 0 -14px 28px -18px #4a300ea6,inset 2px 0 2px -1px #ffffff40,inset -2px 0 2px -1px #ffffff30,0 0 40px #f2cd8a4d,0 0 110px #e7c07833,0 30px 70px #000b}
.capability-rail::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg,#ffffff45,transparent 22%),radial-gradient(60% 30% at 22% 0%,#ffffff59,transparent 70%);mix-blend-mode:screen}
/* trage specular die over het glas glijdt */
@keyframes liquid-sheen{0%,55%{transform:translateX(-130%) skewX(-18deg)}100%{transform:translateX(240%) skewX(-18deg)}}
.capability-rail::after{background:radial-gradient(50% 100% at 50% 0%,#e7c07830,transparent 70%)}
.motion-enabled .possibilities-section.in-view .capability-rail .cap-sheen{animation:liquid-sheen 13s cubic-bezier(.4,.1,.3,1) infinite}
/* vitrines: dunner glas, wereld zichtbaarder, lensranden */
.cap-front::before{background:linear-gradient(168deg,#fff6dd6b,#e2be8352 45%,#bc945a70);transition:background .45s ease}
.capability-rail>div{border-radius:18px;border:1px solid #ffffff4d;box-shadow:inset 0 1.5px 0 #ffffffa6,inset 0 -12px 22px -14px #4a300e99,0 10px 26px #0008,0 0 18px #e7c07826}
.capability-rail>div:hover{border-color:#ffffff8c;box-shadow:inset 0 1.5px 0 #ffffffd9,inset 0 -12px 22px -14px #4a300e99,0 16px 34px #000a,0 0 30px #f2cd8a55}
.capability-rail>div:hover .cap-front::before{background:linear-gradient(168deg,#fff6dd47,#e2be8338 45%,#bc945a52)}
/* iconringen als glas */
.capability-rail .cap-front .icon,.capability-rail .cap-front svg{background:#1b140acc}
.cap-front>.icon{backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-color:#ffe9b8d9;box-shadow:0 0 0 1px #8a652799,inset 0 1px 0 #fff3cf59,0 6px 14px #0009}
/* labels: iets dieper brons voor contrast op dunner glas */
.capability-rail h3{color:#241a0c;text-shadow:0 1px 0 #fff6dd80}
/* pijlers meegenomen in dezelfde lens-familie */
.mini-pillars>div{border-radius:14px;border:1px solid #ffffff30;box-shadow:inset 0 1px 0 #ffffff4d,inset 0 -10px 18px -12px #000c,0 10px 22px #0008}
.pillar-front::before{background:linear-gradient(120deg,#02101680,#021016cc 70%)}

.cap-sheen{position:absolute;top:0;bottom:0;left:0;width:30%;z-index:1;pointer-events:none;background:linear-gradient(90deg,transparent,#ffffff30 45%,#fff6dd4d 50%,#ffffff26 55%,transparent);transform:translateX(-130%) skewX(-18deg)}
.capability-rail{overflow:hidden}

/* Liquid gold glass 2026-09-17 (eigenaar: 21st.dev liquid glass): doorschijnend lensglas i.p.v. dekkend goud — scène vloeit erdoorheen, randen buigen licht, trage specular over het oppervlak. */
.capability-rail{border-radius:26px;border:1px solid #ffffff59;background:linear-gradient(165deg,#fff6dd3d,#e9c98c2e 40%,#b8905226),radial-gradient(130% 170% at 50% -30%,#fff6dd66,transparent 60%);backdrop-filter:blur(20px) saturate(1.45) brightness(1.06);-webkit-backdrop-filter:blur(20px) saturate(1.45) brightness(1.06);box-shadow:0 0 0 1px #8a65273d,inset 0 1.5px 0 #ffffffb8,inset 0 -14px 28px -18px #4a300ea6,inset 2px 0 2px -1px #ffffff40,inset -2px 0 2px -1px #ffffff30,0 0 40px #f2cd8a4d,0 0 110px #e7c07833,0 30px 70px #000b}
.capability-rail::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg,#ffffff45,transparent 22%),radial-gradient(60% 30% at 22% 0%,#ffffff59,transparent 70%);mix-blend-mode:screen}
/* trage specular die over het glas glijdt */
@keyframes liquid-sheen{0%,55%{transform:translateX(-130%) skewX(-18deg)}100%{transform:translateX(240%) skewX(-18deg)}}
.capability-rail::after{background:radial-gradient(50% 100% at 50% 0%,#e7c07830,transparent 70%)}
.motion-enabled .possibilities-section.in-view .capability-rail .cap-sheen{animation:liquid-sheen 13s cubic-bezier(.4,.1,.3,1) infinite}
/* vitrines: dunner glas, wereld zichtbaarder, lensranden */
.cap-front::before{background:linear-gradient(168deg,#fff6dd6b,#e2be8352 45%,#bc945a70);transition:background .45s ease}
.capability-rail>div{border-radius:18px;border:1px solid #ffffff4d;box-shadow:inset 0 1.5px 0 #ffffffa6,inset 0 -12px 22px -14px #4a300e99,0 10px 26px #0008,0 0 18px #e7c07826}
.capability-rail>div:hover{border-color:#ffffff8c;box-shadow:inset 0 1.5px 0 #ffffffd9,inset 0 -12px 22px -14px #4a300e99,0 16px 34px #000a,0 0 30px #f2cd8a55}
.capability-rail>div:hover .cap-front::before{background:linear-gradient(168deg,#fff6dd47,#e2be8338 45%,#bc945a52)}
/* iconringen als glas */
.capability-rail .cap-front .icon,.capability-rail .cap-front svg{background:#1b140acc}
.cap-front>.icon{backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-color:#ffe9b8d9;box-shadow:0 0 0 1px #8a652799,inset 0 1px 0 #fff3cf59,0 6px 14px #0009}
/* labels: iets dieper brons voor contrast op dunner glas */
.capability-rail h3{color:#241a0c;text-shadow:0 1px 0 #fff6dd80}
/* pijlers meegenomen in dezelfde lens-familie */
.mini-pillars>div{border-radius:14px;border:1px solid #ffffff30;box-shadow:inset 0 1px 0 #ffffff4d,inset 0 -10px 18px -12px #000c,0 10px 22px #0008}
.pillar-front::before{background:linear-gradient(120deg,#02101680,#021016cc 70%)}

/* Liquid glass leesbaarheid: ivoren labels + ondervignet per vitrine. */
.capability-rail h3{color:#fdf3d9;font-weight:600;text-shadow:0 1px 2px #000e,0 0 14px #00000091}
.cap-front::after{content:'';position:absolute;left:-12px;right:-12px;bottom:-14px;height:58%;z-index:-1;background:linear-gradient(180deg,transparent,#140c0357 45%,#140c03a1);pointer-events:none}

/* Ultra-godmode pass 2026-09-17 - bewegingslaag. Regie: entree-choreografie met stagger,
   filmkorrel die ademt, speculaire lichtstreep over primaire knoppen en verdiepte kaarthovers.
   Alles poort op .motion-enabled (toggle + reduced-motion + save-data + hidden-tab). */
.motion-enabled [data-reveal]{transition:opacity .9s var(--ease-enter),transform .9s var(--ease-enter)}
.motion-enabled [data-reveal]:not(.is-visible){opacity:.14;transform:translateY(18px)}
.motion-enabled [data-reveal]:nth-child(2){transition-delay:.1s}
.motion-enabled [data-reveal]:nth-child(3){transition-delay:.2s}
.motion-enabled [data-reveal]:nth-child(4){transition-delay:.3s}
.motion-enabled [data-reveal]:nth-child(n+5){transition-delay:.38s}
.motion-enabled body::after{animation:film-grain 1.4s steps(1) infinite}
@keyframes film-grain{0%{transform:translate3d(0,0,0)}12.5%{transform:translate3d(-38px,26px,0)}25%{transform:translate3d(28px,-44px,0)}37.5%{transform:translate3d(-52px,-18px,0)}50%{transform:translate3d(44px,38px,0)}62.5%{transform:translate3d(-24px,52px,0)}75%{transform:translate3d(36px,-30px,0)}87.5%{transform:translate3d(-46px,-42px,0)}100%{transform:translate3d(0,0,0)}}
.button{position:relative;overflow:hidden}
.button::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(112deg,transparent 30%,#ffffff8f 47%,#ffe9bd59 51%,transparent 70%);transform:translateX(-120%);opacity:0}
.motion-enabled .header-actions .button::after{animation:cta-idle-sweep 7s cubic-bezier(.4,.1,.3,1) infinite}
@keyframes cta-idle-sweep{0%,74%{transform:translateX(-120%);opacity:0}80%{opacity:.7}93%,100%{transform:translateX(120%);opacity:0}}
.motion-enabled .button:hover::after,.motion-enabled .button:focus-visible::after{animation:gold-sweep .7s var(--ease-standard)}
.price-card{transition:translate var(--motion-base) var(--ease-premium),border-color var(--motion-base),box-shadow var(--motion-base)}
.product-grid article{transition:border-color var(--motion-base),box-shadow var(--motion-base)}
@media(hover:hover) and (pointer:fine){
 .motion-enabled .price-card:hover{translate:0 -5px;border-color:#e9c282;box-shadow:0 18px 40px #0006,0 0 22px #e8bf7826}
 .motion-enabled .product-grid article:hover{border-color:#e9c282;box-shadow:inset 0 0 0 1px #e8c58b33,0 0 26px #e8bf7820}
}
@media(forced-colors:active){.button::after{display:none}.motion-enabled [data-reveal]:not(.is-visible){opacity:1;transform:none}}
/* === ULTRA-polijstlaag fase 1+2 (eigenaaropdracht 2026-09-17) === */
/* 3. Cinematische sectieovergangen: scenes smelten in elkaar via gradientbruggen boven de scene-laag, onder de inhoud. */
.cinematic::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#020b0ee0 0px,transparent 150px),linear-gradient(0deg,#020b0ed4 0px,transparent 130px)}
.finale.cinematic::after{background:linear-gradient(180deg,#020b0ee0 0px,transparent 150px)}
/* 4. Typografische labeltokens; toegepast op geconstateerde uitschieter */
:root{--ls-label:.16em;--ls-caps:.22em}
.agenda-head>span{letter-spacing:var(--ls-label)}
/* (5. sectienummering verwijderd op eigenaarverzoek 2026-09-17) */
/* 6. Gouden cursor-gloed (alleen fine pointer; native cursor blijft; motion-policy-gated in JS) */
.cursor-orb{position:fixed;left:0;top:0;width:14px;height:14px;border-radius:50%;pointer-events:none;z-index:200;background:radial-gradient(circle,#ffe2a4d9,#eab86b55 55%,transparent 72%);mix-blend-mode:screen;transition:width .3s,height .3s,opacity .4s;opacity:0}
.cursor-orb.is-on{opacity:.9}
.cursor-orb.is-active{width:38px;height:38px;opacity:1}
@media(hover:none),(pointer:coarse){.cursor-orb{display:none}}
/* 8. Subtiele paneelkanteling richting de aanwijzer */
.motion-enabled .gold-border-reveal.is-pointer{transform:perspective(950px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg))}
.gold-border-reveal{transition:transform .5s var(--ease-premium),translate var(--motion-base) var(--ease-premium),border-color var(--motion-base),box-shadow var(--motion-base)}
/* 9. Signature-opening: embleem uit gouddeeltjes (eenmalig per sessie, overslaanbaar, reduced-motion + webdriver slaan over) */
.signature-intro{position:fixed;inset:0;z-index:300;background:#010b10;display:grid;place-items:center;transition:opacity .7s ease}
.signature-intro.is-leaving{opacity:0;pointer-events:none}
.signature-intro canvas{width:min(46vmin,340px);height:min(46vmin,340px)}

/* ULTRA-ronde 2026-09-17 (voer door alle 5): match-cuts, cursor-diepte, kinetische titels, ademende vitrines, film-finish + zegel-CTA. */
/* 1. Match-cuts: elke scene bloedt 90px de vorige sectie in met een lange maskfade — één doorlopende film. */
@media(min-width:761px){
 main .section.cinematic>picture.scene{top:-90px;bottom:auto;height:calc(100% + 90px);mask-image:linear-gradient(180deg,transparent,#000 220px,#000 calc(100% - 110px),transparent);-webkit-mask-image:linear-gradient(180deg,transparent,#000 220px,#000 calc(100% - 110px),transparent)}
}
/* 2. Cursor-diepte: plaat en waterlaag bewegen als één geheel (vars erven van de sectie). */
.motion-enabled .scene[data-parallax] img{transform:translate3d(var(--pan-x,0%),calc(var(--parallax-y,0%) + var(--pan-y,0%)),0) scale(1.07);will-change:transform}
.motion-enabled .cinematic.has-video>video.scene-loop{transform:translate3d(var(--pan-x,0%),calc(var(--parallax-y,0%) + var(--pan-y,0%)),0) scale(1.07);will-change:transform;transition:opacity 1.2s cubic-bezier(.23,1,.32,1)}
/* 3. Kinetische titelonthulling: woorden stijgen uit hun masker met 60ms-cascade. */
.motion-enabled .kinetic .kw{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.12em;margin-bottom:-.12em}
.motion-enabled .kinetic .ki{display:inline-block;opacity:1;transform:none;transition:opacity .55s ease var(--kd,0ms),transform .7s cubic-bezier(.22,1,.36,1) var(--kd,0ms)}
.motion-enabled [data-reveal].is-visible .kinetic .ki{opacity:1;transform:none}
/* 4. Ademende vitrines: ring lift + glint, per capaciteit een eigen microgebaar. */
.cap-ring{position:relative;display:inline-grid;place-items:center;transition:transform .45s cubic-bezier(.22,1,.36,1)}
.capability-rail>div:hover .cap-ring{transform:translateY(-4px)}
.cap-ring::after{content:'';position:absolute;inset:0;border-radius:50%;pointer-events:none;background:linear-gradient(120deg,transparent 32%,#fff7dd73 50%,transparent 66%);opacity:0}
.motion-enabled .capability-rail>div:hover .cap-ring::after{animation:ring-glint .85s ease}
@keyframes ring-glint{0%{opacity:0;transform:translateX(-55%)}30%{opacity:1}100%{opacity:0;transform:translateX(55%)}}
.cap-ring .icon{transition:transform .4s cubic-bezier(.22,1,.36,1)}
.motion-enabled .capability-rail>div:nth-of-type(1):hover .cap-ring .icon{transform:translateY(-2px) rotate(-5deg)}
.motion-enabled .capability-rail>div:nth-of-type(2):hover .cap-ring .icon{transform:perspective(220px) rotateX(16deg)}
.motion-enabled .capability-rail>div:nth-of-type(3):hover .cap-ring .icon{transform:translateX(3px)}
.motion-enabled .capability-rail>div:nth-of-type(4):hover .cap-ring .icon{transform:scaleY(1.12);transform-origin:bottom}
.motion-enabled .capability-rail>div:nth-of-type(5):hover .cap-ring .icon{transform:rotate(10deg) scale(1.06)}
.cap-front .icon{background:#1b140acc}
.cap-front .cap-ring .icon{width:52px;height:52px;padding:13px;color:#f2d492;border:1.5px solid #ffe9b8d9;border-radius:50%;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:0 0 0 1px #8a652799,inset 0 1px 0 #fff3cf59,0 6px 14px #0009;margin:0 auto}
/* 5a. Film-finish: grain + dieper vignet over alles. Compose-fix 2026-09-17: inset -120px als
   bleed zodat de film-grain-ademanimatie (ultra-blok) de laag mag verschuiven zonder randbanden;
   visueel identiek in rust. Dit is de ENIGE grain/vignet-laag (cinematic blok 08 droeg een
   eerdere versie die door de laadvolgorde dood was en is opgeruimd). */
body::after{content:'';position:fixed;inset:-120px;z-index:60;pointer-events:none;opacity:.028;mix-blend-mode:overlay;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>")}
body::before{content:'';position:fixed;inset:0;z-index:59;pointer-events:none;background:radial-gradient(120% 90% at 50% 45%,transparent 64%,#00000047 100%)}
/* 5b. Het gouden zegel: stille verkoper rechtsonder na 55% scroll. */
.seal-cta{position:fixed;right:22px;bottom:22px;z-index:30;display:flex;align-items:center;gap:11px;padding:10px 18px 10px 12px;border-radius:40px;border:1px solid #f0cd85cc;background:linear-gradient(150deg,#14100acc,#03141aee),radial-gradient(120% 160% at 30% 0%,#ffe9b826,transparent 60%);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#f6e3b8;font:600 10px/1.2 var(--sans);letter-spacing:.22em;text-transform:uppercase;box-shadow:0 0 0 1px #7a562055,0 14px 34px #000b,0 0 26px #e7c07833,inset 0 1px 0 #fff3cf33;opacity:0;translate:0 14px;pointer-events:none;transition:opacity .5s ease,translate .5s cubic-bezier(.22,1,.36,1)}
.seal-cta.is-on{opacity:1;translate:0 0;pointer-events:auto}
.seal-cta .seal-dot{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid #f0cd85;background:linear-gradient(140deg,#ffedc1,#d29b52);color:#0a1013}
.seal-cta .seal-dot .icon{width:13px;height:13px}
.seal-cta:hover{box-shadow:0 0 0 1px #7a562088,0 18px 40px #000c,0 0 40px #e7c07855,inset 0 1px 0 #fff3cf4d}
.seal-cta:focus-visible{outline:2px solid var(--gold-bright);outline-offset:3px}
.seal-cta{bottom:80px}
@media(max-width:760px){.seal-cta{right:14px;bottom:14px;padding:9px 14px 9px 10px;font-size:9px}.seal-cta{bottom:72px}}
/* 2. Integratielogo's: monochroom goud in rust, merkkleur bij hover/focus. */
.integration-mark img{filter:grayscale(1) sepia(.6) hue-rotate(-14deg) saturate(2.2) brightness(.94);opacity:.82;transition:filter .45s ease,opacity .45s ease}
.integrations li:hover .integration-mark img,.integrations li:focus-within .integration-mark img{filter:none;opacity:1}

/* Finale-live 2026-09-17: leesbaarheidsborg voor de kop boven de waterval — zachte scrim achter de copy. */
.finale.cinematic>video.scene-loop{mask-image:linear-gradient(180deg,transparent,#000 130px,#000 calc(100% - 120px),transparent);-webkit-mask-image:linear-gradient(180deg,transparent,#000 130px,#000 calc(100% - 120px),transparent)}
.finale .container.centered{position:relative;isolation:isolate}
.finale .container.centered::before{content:'';position:absolute;inset:-6% -14%;z-index:-1;background:radial-gradient(58% 62% at 50% 46%,#02101699,#02101655 55%,transparent 78%);pointer-events:none}
.finale h2,.finale>.container>p{text-shadow:0 2px 10px #000c,0 0 30px #00000080}

/* Finale-lotus vrijstaand 2026-09-17: alpha-embleem boven de waterval met gouden aura in plaats van het zwarte assetvlak. */
.finale .monument-emblem{filter:drop-shadow(0 0 26px #e7c07866) drop-shadow(0 0 60px #e7c07833) drop-shadow(0 8px 22px #000c)}

/* Detailpagina's fase 1 — 2026-09-17: intro-kinetiek + vitrine-stijl voor procesarchief, detail-grid en story-panelen. */
.motion-enabled .kinetic.k-go .ki{opacity:1;transform:none}
/* procesarchief (werkwijze) */
.process-details{display:grid;gap:22px;max-width:920px;margin-inline:auto}
.process-detail{position:relative;display:flex;gap:28px;align-items:flex-start;padding:28px 30px;border:1px solid #d5b26f42;border-radius:9px;background:linear-gradient(130deg,#0a2127b0,#02141ae0);box-shadow:inset 0 1px 0 #ffe9b824,0 14px 30px #0007}
.process-detail .step-number{border:0;box-shadow:none;width:auto;height:auto;min-width:74px;border-radius:0;font:400 clamp(36px,3vw,48px)/1 var(--serif);letter-spacing:.04em;color:#eecd87;background:linear-gradient(178deg,#fff3cf 6%,#eecd87 36%,#e0b56e 62%,#c99a55 85%,#dcb475);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 2px #000c) drop-shadow(0 0 12px #d9a95726)}
.process-detail h2{font-size:clamp(22px,2vw,30px);margin-bottom:8px}
.process-detail p{color:#e6e3d8;line-height:1.6}
/* detail-grid (diensten) */
.detail-grid article{position:relative;padding:28px 26px;border:1px solid #d5b26f42;border-radius:9px;background:linear-gradient(150deg,#0a2127b0,#02141ae0);box-shadow:inset 0 1px 0 #ffe9b824,0 14px 30px #0007}
.detail-grid article h2{margin-bottom:10px}
/* story-panelen (investering/over) */
.section .container.story{position:relative;padding:34px 38px;border:1px solid #d5b26f3d;border-radius:10px;background:linear-gradient(140deg,#0a2127a6,#02141adb);box-shadow:inset 0 1px 0 #ffe9b820,0 16px 34px #0007}
@media(max-width:760px){.process-detail{gap:18px;padding:20px 18px}.section .container.story{padding:24px 20px}}

/* Aankomstchoreografie 2026-09-17: sluit de merkintro, dan stapt de hero geensceneerd binnen
   (kop, tekst, knoppen en signatuur na elkaar). Alleen na een echte intro (html.intro-finale)
   en alleen met motion-enabled; andere paginas en reduced-motion blijven ongewijzigd. */
.motion-enabled.intro-finale .hero-copy>*{animation:hero-arrive 1s var(--ease-enter) both}
.motion-enabled.intro-finale .hero-copy>*:nth-child(2){animation-delay:.14s}
.motion-enabled.intro-finale .hero-copy>*:nth-child(3){animation-delay:.28s}
.motion-enabled.intro-finale .hero-copy>*:nth-child(n+4){animation-delay:.42s}
.motion-enabled.intro-finale .hero-signature{animation:hero-arrive 1.4s var(--ease-enter) .5s both}
.motion-enabled.intro-finale .hero-qualities{animation:hero-arrive 1.2s var(--ease-enter) .65s both}
@keyframes hero-arrive{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media(forced-colors:active){.motion-enabled.intro-finale .hero-copy>*,.motion-enabled.intro-finale .hero-signature,.motion-enabled.intro-finale .hero-qualities{animation:none}}

/* Aankomstchoreografie 2026-09-17: sluit de merkintro, dan stapt de hero geensceneerd binnen
   (kop, tekst, knoppen en signatuur na elkaar). Alleen na een echte intro (html.intro-finale)
   en alleen met motion-enabled; andere paginas en reduced-motion blijven ongewijzigd. */
.motion-enabled.intro-finale .hero-copy 1s var(--ease-enter) both}
.motion-enabled.intro-finale .hero-copy .hero-copy .hero-copy .hero-signature{animation:hero-arrive 1.4s var(--ease-enter) .5s both}
.motion-enabled.intro-finale .hero-qualities{animation:hero-arrive 1.2s var(--ease-enter) .65s both}
@keyframes hero-arrive{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media(forced-colors:active){.motion-enabled.intro-finale .hero-copy,.motion-enabled.intro-finale .hero-signature,.motion-enabled.intro-finale .hero-qualities{animation:none}}

/* Detailpagina's fase 2 — 2026-09-17 (9,3-ronde): levende intro's, match-cut rond intro's en plain-secties, gerichte intro-shade, voortgangsdraad werkwijze, detail-grid ringen, story-zegels. */
/* Levende intro-loops: zelfde poorten en budgetten als de sectie-loops, achter de scene-shade. */
.page-intro--image>.scene-loop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-2;opacity:0;transition:opacity 1.2s cubic-bezier(.23,1,.32,1);pointer-events:none}
.page-intro--image.has-video>.scene-loop{opacity:1}
.motion-enabled .page-intro--image.has-video>video.scene-loop{transform:translate3d(var(--pan-x,0%),calc(var(--parallax-y,0%) + var(--pan-y,0%)),0) scale(1.07);will-change:transform;transition:opacity 1.2s cubic-bezier(.23,1,.32,1)}
@media(max-width:760px){.page-intro--image>.scene-loop{display:none}}
/* Match-cut: de intro-plaat vloeit onderaan uit zodat de volgende scène erin kan landen. */
main .page-intro--image>picture.scene,main .page-intro--image>.scene-loop{mask-image:linear-gradient(180deg,#000,#000 calc(100% - 90px),transparent);-webkit-mask-image:linear-gradient(180deg,#000,#000 calc(100% - 90px),transparent)}
/* Match-cut: geen harde naadlijn onder een beeld-intro; de overgang komt uit de maskfade. */
.page-intro--image{border-bottom:0}
/* Gerichte intro-shade: donkere tekstflank links, de wereld blijft rechts zichtbaar (was vlak #03101bb8). */
.page-intro--image .scene-shade{background:linear-gradient(90deg,#03101bd6 0%,#03101b99 46%,#03101b40 100%),linear-gradient(0deg,#03101b8c,transparent 55%)}
/* Plain-secties dragen de paleisgradiënt zodat de scène-bleeds kunnen landen. */
main>.section:has(>.container.process-details),main>.section:has(>.container.detail-grid),main>.section:has(>.container.story){background:linear-gradient(168deg,#04141c 0%,#020a10 58%,#03111a 100%)}
/* Voortgangsdraad werkwijze: hairline per vitrine die goud oplicht zodra de stap onthult. */
@media(min-width:761px){
.process-detail::before{content:'';position:absolute;left:-26px;top:0;bottom:-22px;width:1px;background:#d5b26f1c}
.process-detail::after{content:'';position:absolute;left:-26px;top:0;bottom:-22px;width:1px;background:linear-gradient(180deg,#ffe9b8,#f0cd85 30%,#8a662e);box-shadow:0 0 12px #d9a95740;transform:scaleY(0);transform-origin:top;transition:transform .9s cubic-bezier(.22,1,.36,1) .15s}
.process-detail:last-child::before,.process-detail:last-child::after{bottom:0}
.motion-enabled .process-detail.is-visible::after{transform:none}
@media(prefers-reduced-motion:reduce){.process-detail::after{transform:none;transition:none}}
}
/* Detail-grid vitrines: gouden ring + aansluiting op de licht-volgt-cursor familie. */
.detail-grid article .gold-ring{width:52px;height:52px;min-width:0;min-height:0;margin-bottom:16px;border-width:1.5px;background:#04101ab8;box-shadow:0 0 0 1px #7a56209c,0 8px 22px #000b,inset 0 1px 0 #ffe9b845,inset 0 -1px 0 #6b48187a;color:#f2d492}
.detail-grid article .gold-ring .icon{width:22px;height:22px}
.motion-enabled .detail-grid article:hover .gold-ring{transform:translateY(-3px)}
/* Story-zegel: het lotusembleem als afzender boven het verhaal. */
.story-seal{display:block;width:96px;height:66px;object-fit:contain;margin:0 0 20px;filter:drop-shadow(0 2px 6px #000c) drop-shadow(0 0 20px #d9a95733)}

/* Wauw-laag werkwijze 2026-09-17 — cameraregie per stap, gouden draad met lichtpuls, zegel-stations, ringveeg. */
/* Cameraregie: de levende kamer glijdt naar het focuspunt van de actieve stap (alleen desktop + motion). */
@media(min-width:1101px){
.motion-enabled .process-section>picture.scene img,.motion-enabled .process-section>video.scene-loop{transform-origin:var(--focus-origin,50% 40%);transition:transform-origin 1.7s cubic-bezier(.22,1,.36,1)}
.motion-enabled .process-section>.scene[data-parallax] img{transform:translate3d(var(--pan-x,0%),calc(var(--parallax-y,0%) + var(--pan-y,0%)),0) scale(1.13)}
.motion-enabled .process-section.has-video>video.scene-loop{transform:translate3d(var(--pan-x,0%),calc(var(--parallax-y,0%) + var(--pan-y,0%)),0) scale(1.13)}
}
/* Gouden draad: rijkere vulling met gloed en trage premium-groei. */
.process-section .section-progress{background:#edc47b22}
.motion-enabled .process-section .section-progress::before{background:linear-gradient(90deg,#8a662e,#f0cd85 55%,#ffe9b8);box-shadow:0 0 12px #d9a95740;transition:transform 1.1s cubic-bezier(.22,1,.36,1)}
/* Lichtpuls: reist bij iedere stapwissel over de draad. */
.process-section .section-progress{position:relative;overflow:visible}
.process-section .section-progress::after{content:'';position:absolute;inset:-4px 0;background:radial-gradient(closest-side,#fff3cf,#ffd98a55 60%,transparent) no-repeat -70px 50%/64px 10px;opacity:0;pointer-events:none}
.motion-enabled .process-section .section-progress.is-pulse::after{animation:naxDraadPuls 1s cubic-bezier(.45,0,.25,1)}
@keyframes naxDraadPuls{0%{opacity:0;background-position-x:-70px}10%{opacity:1}90%{opacity:1}100%{opacity:0;background-position-x:calc(100% + 70px)}}
/* Zegel-stations: gegraveerde gouden dubbelring met rollende glans op de actieve stap. */
.process-grid .step-number{position:relative;border:1.5px solid #f0cd85;background:#04101ab8;color:#f2d492;box-shadow:0 0 0 1px #7a56209c,0 6px 16px #000a,inset 0 1px 0 #ffe9b845,inset 0 -1px 0 #6b48187a}
.process-grid .step-number::before{content:'';position:absolute;inset:-6px;border-radius:50%;border:1px solid #e7c07836;pointer-events:none}
.process-grid .step-number::after{content:'';position:absolute;inset:-3px;border-radius:50%;padding:1.5px;background:conic-gradient(from 0deg,transparent 0 68%,#ffe9b8cc 80%,transparent 93%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;opacity:0;pointer-events:none}
.motion-enabled .process-grid li.is-current .step-number::after{opacity:.9;animation:zegelglans 12s linear infinite}
/* Leesring: gouden lichtveeg bij iedere stapwissel. */
.process-ring{position:relative;overflow:hidden}
.process-ring::after{content:'';position:absolute;inset:0;border-radius:50%;background:linear-gradient(115deg,transparent 30%,#fff3cf55 48%,transparent 62%);opacity:0;pointer-events:none}
.motion-enabled .process-ring.is-sweep::after{animation:naxRingSweep .8s ease-out}
@keyframes naxRingSweep{0%{opacity:0;transform:translateX(-70%)}25%{opacity:1}100%{opacity:0;transform:translateX(70%)}}
@media(prefers-reduced-motion:reduce){.process-section .section-progress.is-pulse::after,.process-grid .step-number::after,.process-ring.is-sweep::after{animation:none!important}.process-grid .step-number::after{opacity:0}}

/* Wauw-laag werkwijze 2026-09-17 — cameraregie per stap, gouden draad met lichtpuls, zegel-stations, ringveeg. */
/* Cameraregie: de levende kamer glijdt naar het focuspunt van de actieve stap (alleen desktop + motion). */
@media(min-width:1101px){
.motion-enabled .process-section>picture.scene img,.motion-enabled .process-section>video.scene-loop{transform-origin:var(--focus-origin,50% 40%);transition:transform-origin 1.7s cubic-bezier(.22,1,.36,1)}
.motion-enabled .process-section>.scene[data-parallax] img{transform:translate3d(var(--pan-x,0%),calc(var(--parallax-y,0%) + var(--pan-y,0%)),0) scale(1.13)}
.motion-enabled .process-section.has-video>video.scene-loop{transform:translate3d(var(--pan-x,0%),calc(var(--parallax-y,0%) + var(--pan-y,0%)),0) scale(1.13)}
}
/* Gouden draad: rijkere vulling met gloed en trage premium-groei. */
.process-section .section-progress{background:#edc47b22}
.motion-enabled .process-section .section-progress::before{background:linear-gradient(90deg,#8a662e,#f0cd85 55%,#ffe9b8);box-shadow:0 0 12px #d9a95740;transition:transform 1.1s cubic-bezier(.22,1,.36,1)}
/* Lichtpuls: reist bij iedere stapwissel over de draad. */
.process-section .section-progress{position:relative;overflow:visible}
.process-section .section-progress::after{content:'';position:absolute;inset:-4px 0;background:radial-gradient(closest-side,#fff3cf,#ffd98a55 60%,transparent) no-repeat -70px 50%/64px 10px;opacity:0;pointer-events:none}
.motion-enabled .process-section .section-progress.is-pulse::after{animation:naxDraadPuls 1s cubic-bezier(.45,0,.25,1)}
@keyframes naxDraadPuls{0%{opacity:0;background-position-x:-70px}10%{opacity:1}90%{opacity:1}100%{opacity:0;background-position-x:calc(100% + 70px)}}
/* Zegel-stations: gegraveerde gouden dubbelring met rollende glans op de actieve stap. */
.process-grid .step-number{position:relative;border:1.5px solid #f0cd85;background:#04101ab8;color:#f2d492;box-shadow:0 0 0 1px #7a56209c,0 6px 16px #000a,inset 0 1px 0 #ffe9b845,inset 0 -1px 0 #6b48187a}
.process-grid .step-number::before{content:'';position:absolute;inset:-6px;border-radius:50%;border:1px solid #e7c07836;pointer-events:none}
.process-grid .step-number::after{content:'';position:absolute;inset:-3px;border-radius:50%;padding:1.5px;background:conic-gradient(from 0deg,transparent 0 68%,#ffe9b8cc 80%,transparent 93%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;opacity:0;pointer-events:none}
.motion-enabled .process-grid li.is-current .step-number::after{opacity:.9;animation:zegelglans 12s linear infinite}
/* Leesring: gouden lichtveeg bij iedere stapwissel. */
.process-ring{position:relative;overflow:hidden}
.process-ring::after{content:'';position:absolute;inset:0;border-radius:50%;background:linear-gradient(115deg,transparent 30%,#fff3cf55 48%,transparent 62%);opacity:0;pointer-events:none}
.motion-enabled .process-ring.is-sweep::after{animation:naxRingSweep .8s ease-out}
@keyframes naxRingSweep{0%{opacity:0;transform:translateX(-70%)}25%{opacity:1}100%{opacity:0;transform:translateX(70%)}}
@media(prefers-reduced-motion:reduce){.process-section .section-progress.is-pulse::after,.process-grid .step-number::after,.process-ring.is-sweep::after{animation:none!important}.process-grid .step-number::after{opacity:0}}

/* Luxe footer 2026-09-18 — 1:1 naar eigenaarmock: omlijst goudpaneel met nebula-diepte, lotus-lockup, ring-regels met chevrons, zegelregel onderin met socials. */
.site-footer.lux-footer{background:#000305;border-top:0;padding:0}
.lux-footer-frame{position:relative;width:100%;border-radius:0;border:0;background:linear-gradient(180deg,#b0783226 0,#6a451c16 70px,transparent 155px),radial-gradient(130% 90% at 8% 0%,#12202b66,transparent 55%),radial-gradient(120% 100% at 95% 100%,#2a1d0d55,transparent 60%),linear-gradient(160deg,#050d13,#01070c 55%,#03080d);box-shadow:0 24px 60px #000c,inset 0 1px 0 #ffe9b81f,inset 0 -1px 0 #d9a9571f;overflow:hidden;isolation:isolate}
.lux-footer-frame::before{content:'';position:absolute;inset:0;background:radial-gradient(60% 90% at 0% 0%,#f0cd8514,transparent 55%),radial-gradient(55% 80% at 100% 100%,#f0cd8511,transparent 55%);pointer-events:none;z-index:-1}
.lux-footer-frame::after{content:'';position:absolute;left:5%;right:5%;bottom:0;height:2px;background:linear-gradient(90deg,transparent,#ffd98a99 28%,#fff3cf 50%,#ffd98a99 72%,transparent);box-shadow:0 0 24px #e7c078a8;pointer-events:none}
.lux-footer-grid{display:grid;grid-template-columns:1.24fr 1.07fr 1.15fr 1.14fr;gap:26px;padding:44px 4% 28px}
.lux-footer-grid>div:not(.lux-footer-brand){border-left:1px solid #c59e6042;padding-left:30px}
.lux-footer-grid h2{font:400 14px/1 var(--serif);letter-spacing:.3em;text-transform:uppercase;color:#eecd87;margin-bottom:22px}
.lux-footer-brand{display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:9px;padding-top:2px}
.lux-footer-lockup{display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;align-self:flex-start;margin-left:6px}
.lux-footer-emblem{width:150px;height:106px;object-fit:contain;filter:drop-shadow(0 4px 10px #000c) drop-shadow(0 0 24px #d9a95738)}
.lux-footer-lockup .brand-wordmark{font-size:42px;letter-spacing:.2em;background:linear-gradient(178deg,#fff3cf 6%,#eecd87 36%,#e0b56e 62%,#c99a55 85%,#dcb475);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 2px #000c)}
.lux-footer-lockup .brand-wordmark small{font-size:12px;letter-spacing:.85em;margin-top:8px;-webkit-text-fill-color:transparent}
.lux-footer-brand .gold-rule{width:46px;margin:10px 0 0 2px!important}
.lux-footer-brand p{font-size:15.5px;line-height:1.55;color:#e9eae2;margin-top:6px}
.lux-footer-motto{font-family:var(--serif);text-transform:uppercase;letter-spacing:.42em;font-size:12px;color:#eecd87;margin-top:9px}
.lux-footer .f-row{display:grid;grid-template-columns:48px 1fr 13px;align-items:center;gap:15px;padding:8px 0;color:#f0f1ea;font-size:15px;text-decoration:none}
.lux-footer .f-ic{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1px solid #e2ba73a1;background:#03141c99;color:#f2d492;box-shadow:inset 0 1px 0 #ffe9b833,inset 0 -1px 0 #6b481860,0 4px 10px #0009;transition:box-shadow .5s var(--ease-premium),transform .5s var(--ease-premium)}
.lux-footer .f-ic .icon{width:19px;height:19px}
.lux-footer .f-row>.icon{width:13px;height:13px;color:#eecd87;justify-self:end;transition:transform .5s var(--ease-premium)}
.lux-footer .f-label{line-height:1.35}
.lux-footer a.f-row:hover .f-label,.lux-footer a.f-row:focus-visible .f-label{color:#ffe9b8}
.lux-footer a.f-row:hover .f-ic{box-shadow:inset 0 1px 0 #ffe9b845,0 0 16px #e7c07850,0 4px 10px #0009;transform:translateY(-1px)}
.lux-footer a.f-row:hover>.icon{transform:translateX(3px)}
.lux-footer .f-static{cursor:default}
.lux-footer-bottom{display:flex;align-items:center;gap:22px;padding:15px 4.5% 18px;border-top:1px solid #c59e6038}
.lux-footer-bottom small{font-size:12.5px;color:#d9dad2;white-space:nowrap}
.lux-footer-line{flex:1;height:1px;background:linear-gradient(90deg,#c59e6045,#c59e6016)}
.lux-footer-claim{display:flex;align-items:center;gap:14px;font-family:var(--serif);text-transform:uppercase;letter-spacing:.34em;font-size:11px;color:#eecd87;white-space:nowrap}
.lux-footer-claim::after{content:'';width:28px;height:1px;background:#c59e6055}
.lux-footer-social{display:flex;gap:12px}
.lux-footer-social a{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid #e2ba73a1;color:#f2d492;background:#03141c99;transition:box-shadow .5s var(--ease-premium),transform .5s var(--ease-premium)}
.lux-footer-social .icon{width:16px;height:16px}
.lux-footer-social a:hover{box-shadow:0 0 16px #e7c07850;transform:translateY(-2px)}
@media(max-width:1100px){.lux-footer-grid{grid-template-columns:1fr 1fr;padding-inline:30px}.lux-footer-brand{grid-column:1/-1;margin-bottom:6px}.lux-footer-grid>div:not(.lux-footer-brand){border-left:0;padding-left:0}.lux-footer-bottom{flex-wrap:wrap;padding-inline:30px;gap:14px}.lux-footer-line{display:none}}
@media(max-width:640px){.lux-footer-grid{grid-template-columns:1fr;gap:24px}.lux-footer-bottom small{white-space:normal}}
@media(prefers-reduced-motion:reduce){.lux-footer .f-ic,.lux-footer .f-row>.icon,.lux-footer-social a{transition:none}}

/* Hoekbogen + kosmische diepte (mock-correctie 2026-09-18): lichtboog linksboven en rechtsonder, sterrennevel in de hoek. */
.lux-arc{position:absolute;width:620px;height:620px;border-radius:50%;padding:2px;background:conic-gradient(from 118deg,transparent 0 56%,#ffd98ab3 71%,#fff3cf 79%,#ffd98ab3 87%,transparent 97%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;pointer-events:none;filter:drop-shadow(0 0 18px #e7c07899)}
.lux-arc--tl{top:-330px;left:-190px}
.lux-arc--br{right:-190px;bottom:-330px;transform:rotate(180deg)}
.lux-footer-frame::before{background:radial-gradient(340px 240px at 3% 4%,#2b3d5230,transparent 70%),radial-gradient(2px 2px at 6% 9%,#e8f1ff86,transparent 100%),radial-gradient(1.5px 1.5px at 11% 4%,#e8f1ff66,transparent 100%),radial-gradient(1.5px 1.5px at 3% 16%,#cfe0f455,transparent 100%),radial-gradient(2px 2px at 15% 12%,#e8f1ff40,transparent 100%),radial-gradient(55% 80% at 100% 100%,#f0cd8511,transparent 55%)}

/* Footerlive-integratie 2026-09-18 — levende wereld onder de footer: video onderop (strook 56%), topmasker voor de overloopzone, sterren erboven, content bovenop. */
.lux-footer-frame>video.footer-loop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 56%;z-index:0;opacity:0;transition:opacity 1.2s cubic-bezier(.23,1,.32,1);pointer-events:none;mask-image:linear-gradient(180deg,transparent,#000 150px);-webkit-mask-image:linear-gradient(180deg,transparent,#000 150px)}
.lux-footer-frame.has-video>video.footer-loop{opacity:1}
.lux-footer-frame::before{z-index:1}
.lux-arc{z-index:1}
.lux-footer-grid,.lux-footer-bottom{position:relative;z-index:2}
@media(max-width:760px){.lux-footer-frame>video.footer-loop{display:none}}

/* Footerlive leesbaarheidslaag 2026-09-18 — wereld aan de flanken, rust achter de content. */
.lux-footer-frame>video.footer-loop{filter:brightness(.78) saturate(1.05)}
.lux-footer-grid{background:radial-gradient(115% 95% at 50% 46%,#020a1096 0,#020a1055 45%,transparent 78%)}
.lux-footer-bottom{background:linear-gradient(180deg,#020a1077,#020a10a6)}
.lux-footer-grid h2,.lux-footer .f-label,.lux-footer-brand p,.lux-footer-motto,.lux-footer-claim,.lux-footer-bottom small{text-shadow:0 1px 3px #020a10e6,0 0 14px #020a10b3}
.lux-footer .f-ic,.lux-footer-social a{background:#03141cd9}

/* Footer-gladstrijkers 2026-09-18 — vrije grond voor zwevende knoppen op mobiel; SPACE-subregel helder goud. */
.lux-footer-lockup .brand-wordmark small{background:none;-webkit-text-fill-color:#e7c078;color:#e7c078;text-shadow:0 1px 3px #020a10e6}
@media(max-width:760px){.lux-footer-bottom{padding-bottom:122px}}

/* Fase 1 2026-09-18: mobiel pillen-dock. De zwevende zegel wordt icoon-only en compact zodat
   lopende tekst, bullets en disclaimers nooit meer bedekt raken; label blijft voor schermlezers. */
@media(max-width:620px){
.seal-cta{padding:7px 13px 7px 8px;gap:8px;right:12px;bottom:64px;font-size:9px;letter-spacing:.16em}
.seal-cta .seal-dot{width:26px;height:26px}
.motion-global{right:12px;bottom:12px}
}

/* Fase 2 2026-09-18 (eindreview): contrastvangnet en leesbaarheid.
   1. Herotitels krijgen een lokale scrim-schaduw zodat lichte videoframes/reflecties de
      leesbaarheid nooit raken (WCAG 1.4.3-vangnet, geen visueel verlies op donker beeld). */
.hero-copy h1,.page-intro h1{text-shadow:0 2px 24px #020b0ec9,0 1px 4px #020b0e8c}
/* 2. Gegraveerde triptiek: de betekenisdragende subregel wordt ivoor; gravure blijft in de titel. */
.service-item p{background:none;-webkit-background-clip:initial;background-clip:initial;-webkit-text-fill-color:currentColor;color:#f0e8d5;filter:none;text-shadow:0 1px 3px #000c,0 2px 10px #0009}
/* 3. Baaititels op spelende hologrammen: zwaardere drop-shadow zodat DESIGN & BUILD nooit wegzakt. */
.services-section.has-video .service-item h3{filter:drop-shadow(0 2px 3px #000) drop-shadow(0 2px 10px #000d) drop-shadow(0 0 24px #000c)}

/* Trede 1 2026-09-19: brugsecties zijn overgangsscenes, geen lege banden — compacte hoogte,
   eigen scene-still met leesbaarheidssluier, en data-reveal zodat de kinetic-koppen vuren. */
.booking-bridge,.transform-bridge{min-height:0;padding:110px 0 120px;position:relative;isolation:isolate}
.booking-bridge::after,.transform-bridge::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#020b0eea 0%,#020b0ea8 46%,#020b0e60 100%)}
.booking-bridge .scene img,.transform-bridge .scene img{object-position:72% center}
.booking-bridge .section-heading,.transform-bridge .section-heading{max-width:640px;margin-bottom:26px}

/* ===== Trede 1+2 eindreview-batch 2026-09-19 ===== */
/* Zegel: volledig label op desktop, kort label op mobiel (tekst blijft zichtbaar, nooit een anoniem pijltje). */
.seal-cta .seal-short{display:none}
@media(max-width:620px){.seal-cta .seal-full{display:none}.seal-cta .seal-short{display:inline}}
/* Interesse-chip op de websitecheck (zelfde patroon als creative). */
.form-interest{font:600 11px/1.4 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#f3cf8c;margin:0 0 16px}
.form-result [data-mail-summary]{margin-top:18px}
.form-mail-note{margin-top:9px}
/* Vakmanschap-kaarten: labels mogen nooit meer afkappen (TECHNOLOG-fix). */
.pillar-front{min-width:0}
.pillar-front>span{min-width:0;flex:1}
.pillar-front b{letter-spacing:.04em;white-space:normal}
.mini-pillars>div{min-width:0}
.mini-pillars b{letter-spacing:.02em}
/* Triptiek: lokale radiale scrim achter elk tekstblok — ook op het helderste lotuspunt leesbaar. */
.services-section .service-item{position:relative}
.services-section .service-item::after{content:'';position:absolute;inset:32% -12% -10%;z-index:-1;background:radial-gradient(62% 66% at 50% 40%,#020b0e82,#020b0e00 74%);pointer-events:none}
/* Typografische vloeren: geen betekenisdragende letters meer onder 10px. */
html .hero-copy .eyebrow{font-size:clamp(11px,.85vw,12.5px)}
html .deck-label{font-size:11px}
html .deck-subtitle{font-size:10px}
html .trust-label{font-size:11px}
[data-industry-tabs] button{font-size:11px}
html .creative-gallery p{font-size:10px;letter-spacing:.1em}
@media(max-width:760px){html .creative-gallery p{font-size:10px}}
/* Conceptfilm-caption als leesbare pill (transparantieclaim hoort leesbaar te zijn). */
[data-page="over-naxara"] figcaption.fineprint{font-size:11px;background:#020b0e94;padding:6px 13px;border-radius:20px;width:max-content;max-width:92%;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
/* Kophiërarchie: sectiekoppen schreeuwen niet meer even hard als de paginakop. */
[data-page="over-naxara"] .section-heading h2,[data-page="websitecheck"] .section-heading h2,[data-page="privacy"] .section-heading h2{font-size:clamp(34px,3.2vw,46px)}
/* Prijskaartnamen worden echte koppen (Editorial), niet 12px-microlabels. */
html .price-card h3{font:400 21px/1.25 var(--serif);letter-spacing:.02em;text-transform:none;color:#f7ecd7}
/* Leesbare regellengtes. */
.process-details p,.process-detail p{max-width:62ch}
[data-page="over-naxara"] .story p{max-width:62ch}
/* Cases: link-CTA op de kaartvoet zodat baselines gelijk eindigen. */
.case-caption{display:flex;flex-direction:column}
.case-caption .text-link{margin-top:auto;padding-top:10px}
/* Micro-loops lezen als iconen: gezamenlijke demping haalt de stijlbreuk uit c2/c3. */
video[data-micro-loop]{filter:saturate(.74) brightness(.9)}
/* Intro: pauze- en geluidsknop krijgen dezelfde donkere pill als de skip-knop (contrastvast op elk filmmoment). */
.brand-intro-controls [data-intro-pause],.brand-intro-controls [data-intro-sound]{background:#020b0e8a;border:1px solid #f0cd8536;border-radius:26px;padding:9px 16px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
/* Hero-scrim één stap dieper achter het titelblok (AA-marge geborgd bij elke toekomstige clipwissel). */
.cinematic-hero .hero-shade{background:linear-gradient(90deg,#00080b3f,transparent 52%)}
/* Creative-tarievenregel op home (teaser; kaarten staan op investering). */
.creative-rates{max-width:72ch;margin:28px auto 0;text-align:center;font-size:13px;line-height:1.75;color:#eee7d6;background:#020b0e99;padding:13px 22px;border-radius:14px;border:1px solid #d9b36f3d;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
.creative-rates .text-link{margin-left:6px}
/* TECHNOLOGIE-afkap definitief: in de smalle mini-kaarten staat het icoon boven het label,
   zodat de volledige kaartbreedte beschikbaar is voor het woord. */
.mini-pillars .pillar-front{flex-direction:column;align-items:flex-start;gap:6px}

/* ===== Liquid-glass agenda (home, eigenaarwens 2026-09-19) =====
   De échte, klikbare demo in een compact glaspaneel rechts van de copy: wizard-modus
   (één stap tegelijk) zodat alles leesbaar blijft — geen video, alle tools werken. */
.booking-section--glass .booking-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(400px,620px);gap:44px 58px;align-items:start}
.booking-section--glass .booking-copy{grid-column:1;grid-row:1}
.booking-section--glass .booking-tools{grid-column:1;grid-row:2;margin:0}
.booking-section--glass .booking-demo{grid-column:2;grid-row:1/span 2;margin:0;position:relative;isolation:isolate;
 background:radial-gradient(150% 95% at 16% 0%,#ffe9b81c,transparent 55%),linear-gradient(152deg,#12242b57,#04131a85 44%,#020a0dae);
 backdrop-filter:blur(22px) saturate(1.18);-webkit-backdrop-filter:blur(22px) saturate(1.18);
 border:1px solid #f0cd854d;border-radius:26px;
 box-shadow:0 34px 80px #000000b3,0 0 0 1px #7a562033,inset 0 1px 0 #fff3cf42,inset 0 -1px 0 #00000073;overflow:hidden}
.booking-section--glass .booking-demo::before{content:'';position:absolute;inset:0 0 auto;height:46%;z-index:0;pointer-events:none;
 background:linear-gradient(178deg,#ffffff14,#ffffff00 60%);mask:linear-gradient(#000,transparent)}
.booking-section--glass .booking-demo>*{position:relative;z-index:1}
/* Wizard-gedrag (gelijk aan mobiel, maar dan in de glaskolom): één paneel tegelijk. */
.booking-section--glass .agenda-grid{grid-template-columns:minmax(0,1fr);gap:16px}
.booking-section--glass .agenda-grid>.agenda-panel{display:none;padding:16px 14px}
.booking-section--glass .agenda-grid>.agenda-panel.is-mobile-active,.booking-section--glass .agenda-grid>.agenda-panel--confirm.is-mobile-companion{display:block}
.booking-section--glass .agenda-panel--calendar{grid-row:auto}
.booking-section--glass .agenda-stage:not([data-booking-step="4"]) .agenda-submit-row{display:none}
.booking-section--glass .agenda-wizard{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:16px}
.booking-section--glass .agenda-wizard p{font-size:12px;color:#e6e9e2}
.booking-section--glass .agenda-wizard div{display:flex;gap:9px}
.booking-section--glass .agenda-wizard button{min-height:44px;padding:10px 18px;border:1px solid #d3b77e95;border-radius:9px;background:#04101772;color:var(--text);font-size:12px}
.booking-section--glass .agenda-head{flex-direction:column;align-items:flex-start;gap:6px}
.booking-section--glass .agenda-hint{margin:5px 0 14px 43px}
@media(max-width:1100px){
.booking-section--glass .booking-layout{grid-template-columns:1fr}
.booking-section--glass .booking-demo{grid-column:1;grid-row:auto;max-width:640px}
.booking-section--glass .booking-tools{grid-row:auto}
}

/* Cinematische glaslaag (eigenaarwens 2026-09-19): de film leeft dóór het paneel.
   Lichtstraal trekt periodiek over het glas (pointer-events:none, boven de UI zoals
   licht over een scherm in film) en het paneel ademt traag — alles achter de
   motion-enabled-poort, dus reduced-motion/save-data/pauzeknop leggen het stil. */
.motion-enabled .booking-section--glass .booking-demo{animation:glass-float 12s ease-in-out infinite}
@keyframes glass-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.booking-section--glass .booking-demo::after{content:'';position:absolute;inset:-30% -55%;z-index:3;pointer-events:none;opacity:0;
 background:linear-gradient(115deg,transparent 42%,#fff3cf12 48%,#ffe9b824 52%,#fff3cf12 56%,transparent 62%);transform:translateX(-72%)}
.motion-enabled .booking-section--glass .booking-demo::after{opacity:1;animation:glass-sheen 9.5s cubic-bezier(.45,0,.25,1) infinite}
@keyframes glass-sheen{0%,52%{transform:translateX(-72%)}88%,100%{transform:translateX(72%)}}
@media(prefers-reduced-motion:reduce){.booking-section--glass .booking-demo,.booking-section--glass .booking-demo::after{animation:none!important}}

/* ===== CINEMA-GLAS v2 — eigenaarmandaat 2026-09-19 (Gemini-review 6,2 + MotionSites-randtechniek) =====
   Het paneel wordt een object van geslepen glas en messing ín de scène: directioneel randlicht
   (mask-composite, dooft per zijde uit), dieper materiaal, back-glow, vloerglow-grounding,
   3D-tilt (bestaand gold-border-reveal-mechanisme), entree-choreografie, en haute-horlogerie
   binnenwerk. Alles policy-gated; wizard-interactie blijft volledig echt. */
.booking-section--glass .booking-demo{
 background:linear-gradient(155deg,#ffffff08,#ffffff02 30%,#020a0d73 60%,#020a0daa);
 backdrop-filter:blur(28px) saturate(1.3) brightness(.86);-webkit-backdrop-filter:blur(28px) saturate(1.3) brightness(.86);
 border:0;border-radius:28px;
 box-shadow:0 40px 100px -20px #000000e6,0 0 60px -10px #d4af3718,inset 0 1px 0 #fff3cf2e}
.motion-enabled .booking-section--glass .booking-demo{animation:none}
.booking-section--glass .booking-demo::before{inset:0;height:auto;border-radius:inherit;padding:1.4px;z-index:4;
 background:linear-gradient(135deg,#e5c378a8 0%,#ffffff14 38%,#0000001f 62%,#e5c37855 100%);
 -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude}
.motion-enabled .booking-section--glass [data-reveal].is-visible .booking-demo{animation:glass-arrive 1s cubic-bezier(.22,1,.36,1) backwards}
@keyframes glass-arrive{from{opacity:0;transform:translateY(34px) scale(.985)}to{opacity:1;transform:none}}
/* Grounding: warme lichtplas op de marmervloer onder het glas */
.booking-section--glass .booking-layout::after{content:'';grid-column:2;grid-row:3;height:72px;margin:-26px 9% 0;border-radius:50%;
 background:radial-gradient(50% 92% at 50% 0%,#e7c07838,transparent 72%);filter:blur(10px);pointer-events:none}
/* Branchetabs: één regel, luxe selectiestaat (gouden onderlijn + inner-glow i.p.v. gevulde pil) */
.booking-section--glass .industry-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;
 -webkit-mask:linear-gradient(90deg,#000 90%,transparent);mask:linear-gradient(90deg,#000 90%,transparent)}
.booking-section--glass .industry-tabs::-webkit-scrollbar{display:none}
.booking-section--glass .industry-tabs [role=tab]{flex:none;font-size:11px;letter-spacing:.18em;text-transform:uppercase;
 background:transparent;border:0;color:#cfd9d6;padding:11px 14px;border-radius:0;position:relative}
.booking-section--glass .industry-tabs [role=tab][aria-selected="true"]{color:var(--gold-bright);background:transparent;box-shadow:inset 0 0 14px #e5c37822}
.booking-section--glass .industry-tabs [role=tab][aria-selected="true"]::after{content:'';position:absolute;left:12%;right:12%;bottom:4px;height:1px;
 background:linear-gradient(90deg,transparent,var(--gold-bright),transparent)}
/* Disclaimersanering: één kalme voetregel; badge weg; .ics alleen bij de bevestigingsstap */
.booking-section--glass .demo-notice{display:none}
.booking-section--glass .agenda-demo>.fineprint{text-align:center;font:300 11px/1.6 var(--sans);letter-spacing:.05em;color:#ffffff5c;max-width:none;margin:16px 0 0}
.booking-section--glass .agenda-demo [data-download-preference]{display:none}
.booking-section--glass .agenda-demo:has(.agenda-stage[data-booking-step="4"]) [data-download-preference]{display:inline-flex}
/* Haute horlogerie binnenwerk: rokerige selectie met gouden bies, micro-caps stapindicator, serif-panelkoppen */
.booking-section--glass .demo-services input:checked+span,.booking-section--glass .demo-times input:checked+span{
 background:linear-gradient(90deg,#e5c37815,#00000066 80%);border-color:#e5c37842;border-left:2px solid var(--gold-bright);
 box-shadow:inset 0 0 18px #e5c37820;color:#f6edd9}
.booking-section--glass .agenda-wizard p{font:600 10px/1 var(--sans);letter-spacing:.25em;text-transform:uppercase;color:var(--gold-bright)}
.booking-section--glass .agenda-panel h3{font:400 21px/1.25 var(--serif);letter-spacing:.01em}
.booking-section--glass .agenda-panel h3 .agenda-step-num{font:600 10px/1 var(--sans);letter-spacing:.18em;color:var(--gold-bright)}
.booking-section--glass .agenda-wizard button{background:#02090d66;border:1px solid #e5c37838;border-radius:24px;padding:11px 22px;
 letter-spacing:.12em;text-transform:uppercase;font-size:10px}
.booking-section--glass .agenda-wizard button:not(:disabled):hover{border-color:var(--gold-bright);box-shadow:0 0 18px #e5c37828}
/* Linkerkolom: tools als randloze dock op één as; CTA als amber zwaartepunt */
.booking-section--glass .booking-tools{background:transparent;border:0;box-shadow:none;border-radius:0;padding:26px 0 0;border-top:1px solid #d9b36f2e;display:block;min-height:0}
.booking-section--glass .booking-tools h3{font:600 11px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:#c8b384;margin:0 0 18px;max-width:none}
.booking-section--glass .booking-tools ul{display:flex;flex-wrap:wrap;gap:20px 30px;margin:0}
.booking-section--glass .booking-tools li{opacity:.72;transition:opacity .3s;font-size:12px}
.booking-section--glass .booking-tools li:hover{opacity:1}
.booking-section--glass .booking-tools p{font-size:11px;color:#ffffff55;margin-top:16px;max-width:none}
.booking-section--glass .booking-copy .button{box-shadow:0 10px 30px #e5c37842}
/* Selectiestaat in de glas-wizard: rokerig glas met vlijmscherpe gouden bies (choice-list gebruikt aria-pressed). */
.booking-section--glass .choice-list button[aria-pressed="true"]{
 background:linear-gradient(90deg,#e5c37816,#00000066 80%);border-color:#e5c37845;border-left:2px solid var(--gold-bright);
 box-shadow:inset 0 0 18px #e5c37822;color:#f6edd9}
.booking-section--glass .choice-list button{transition:border-color .25s,box-shadow .25s,background .25s}
.booking-section--glass .choice-list button:hover{border-color:#e5c37852}

/* ============================================================================
   NAX-SPOORA-COUTURE-20260919 — Spoor A: van template naar couture.
   Bronnen: eigen regie + onderzoekssweep (MotionSites/Brandmotion/21st/Motion),
   principes herschreven naar Naxara-tokens. Alle decoratieve beweging is
   gegated op html.motion-enabled (pauzeknop + reduced-motion + save-data). */

/* -- 0. Tokens & fundament ------------------------------------------------ */
:root{--ease-lux:cubic-bezier(.22,1,.36,1);--ease-exit:cubic-bezier(.33,0,.67,1);--ease-sweep:cubic-bezier(.4,0,.2,1)}
::selection{background:#e7c078;color:#04101c}

/* Gegraveerd goud: vierstaps gradient + gravureschaduw die de letters volgt. */
.nx-engraved{background:linear-gradient(180deg,#f4dda4 0%,#eecd87 34%,#d5a94f 62%,#8a6a2f 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 1px 0 rgba(0,0,0,.42)) drop-shadow(0 0 16px rgba(231,192,120,.13))}

/* Hoekboog-ornament (familie van de footer-arcs, kaartformaat). */
.nx-arc{position:absolute;width:58px;height:58px;pointer-events:none;border:1px solid transparent;z-index:2}
.nx-arc--tl{top:-1px;left:-1px;border-top-color:#e7c07873;border-left-color:#e7c07873;border-top-left-radius:22px;mask-image:linear-gradient(135deg,#000 34%,transparent 62%);-webkit-mask-image:linear-gradient(135deg,#000 34%,transparent 62%)}
.nx-arc--br{bottom:-1px;right:-1px;border-bottom-color:#e7c07873;border-right-color:#e7c07873;border-bottom-right-radius:22px;mask-image:linear-gradient(315deg,#000 34%,transparent 62%);-webkit-mask-image:linear-gradient(315deg,#000 34%,transparent 62%)}

/* Ambient goudlicht dat de muis volgt + filmkorrel: 'gefilmd, niet gerenderd'. */
.nx-ambient,.nx-grain{position:fixed;inset:0;pointer-events:none;display:none}
.motion-enabled .nx-ambient{display:block;z-index:130;background:radial-gradient(ellipse at var(--mx,50%) var(--my,42%),rgba(231,192,120,.042),transparent 55%)}
.motion-enabled .nx-grain{display:block;inset:-100px;z-index:140;opacity:.028;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E")}
@media(prefers-reduced-motion:no-preference){.motion-enabled .nx-grain{animation:nx-grain .9s steps(4) infinite}}
@keyframes nx-grain{0%{transform:translate(0,0)}25%{transform:translate(-36px,22px)}50%{transform:translate(24px,-30px)}75%{transform:translate(-18px,-14px)}100%{transform:translate(30px,18px)}}

/* -- 1. Herohandoff-rail: kalme uiteinden (melding eigenaar) --------------- */
.handoff-deck{box-shadow:0 5px 16px #cda45a30,0 18px 38px #000b,0 34px 58px -28px #000d,inset 0 1px #ffe4a63a,inset 0 -1px #57c4ff22,inset 30px 0 40px -22px #04101cd9,inset -30px 0 40px -22px #04101cd9}

/* -- 2. Capability-rail: van vijf stickers naar een vitrine ---------------- */
.capability-rail{border:1px solid #e7c07852;background:linear-gradient(160deg,#0b1e30d9,#04101ce8 55%,#0e2a3ecc);box-shadow:inset 0 1px 0 #ffe9b826,inset 0 -1px 0 #57c4ff14,0 30px 60px -28px #000d,0 6px 18px #b9892916}
.capability-rail>div{border:1px solid #e7c07830;background:linear-gradient(165deg,#ffffff12,#ffffff05 38%,#03121973);box-shadow:inset 0 1px 0 #ffffff24,inset 0 -1px 0 #03121980;transition:transform .45s var(--ease-lux),opacity .45s ease,border-color .3s ease}
.capability-rail>div video{filter:saturate(.88) contrast(1.1) brightness(.74)}
.capability-rail .cap-front::before{background:linear-gradient(178deg,#04101c30 8%,#04101c9e 58%,#04101cd6)}
.capability-rail h3{color:#f6ecd6;font-weight:500;letter-spacing:.15em;text-shadow:0 1px 3px #000e,0 0 12px #00000088}
.capability-rail .cap-ring{box-shadow:0 0 0 1px #e7c0784d,inset 0 0 10px #57c4ff12,0 6px 14px #0008}
.capability-rail>div:hover,.capability-rail>div:focus-within{transform:translateY(-6px);border-color:#eecd8780}
.capability-rail:has(>div:hover)>div:not(:hover):not(:focus-within){opacity:.7}
.motion-paused .capability-rail>div:hover,.motion-paused .capability-rail>div:focus-within{transform:none}

/* -- 3. Mini-pijlers: van opsomming naar gegraveerd specificatieplaatje ---- */
.mini-pillars>div{border:0;background:none;box-shadow:none;border-radius:0;padding:6px 2px;overflow:visible}
.mini-pillars>div+div{border-left:1px solid #e7c0781f;padding-left:20px}
.mini-pillars>div>video{display:none}
.pillar-front::before{display:none}
.pillar-front{gap:13px;align-items:center}
.pillar-front>.icon{width:44px;height:44px;flex:none;margin:0;padding:11px;border-radius:50%;color:#eecd87;background:radial-gradient(circle at 32% 28%,#eecd8722,#04101ce6 68%);box-shadow:inset 0 0 0 1px #e7c07859,0 0 16px -6px #e7c07866}
.pillar-front b{font:600 13px/1.3 var(--sans);letter-spacing:.13em;text-transform:uppercase;background:linear-gradient(180deg,#f4dda4,#d5a94f 78%);-webkit-background-clip:text;background-clip:text;color:transparent}
.pillar-front small{color:#c8d0d2;opacity:.82;font-size:12.5px;letter-spacing:.02em}
.motion-enabled .pillar-front>.icon{transition:transform .45s var(--ease-lux)}
.motion-enabled .mini-pillars>div:hover .pillar-front>.icon{transform:translateY(-2px) scale(1.05)}

/* -- 4. Marmerpanelen: koninklijk leesbare titelplaten ---------------------- */
.services-section .service-item::before{background:radial-gradient(58% 46% at 50% 46%,#04101cc7,#04101c66 55%,transparent 78%)}
.services-section .service-item h3{background:linear-gradient(180deg,#f6e2ab 0%,#eecd87 36%,#d5a94f 66%,#96742f 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 1px 0 rgba(0,0,0,.55)) drop-shadow(0 0 20px rgba(231,192,120,.16));letter-spacing:.04em}
.services-section .service-item p{text-shadow:0 1px 8px #000c,0 0 22px #000a}

/* -- 5. Prijskaarten: vijfsterrenprijslijst -------------------------------- */
.pricing-section .price-card{position:relative;overflow:visible;border:1px solid #e7c0782e;background:linear-gradient(158deg,#0c2033f2,#04101cf6 55%,#0a1c30ea),radial-gradient(120% 80% at 85% -10%,#e7c07812,transparent 60%);box-shadow:inset 0 1px 0 #ffe9b822,0 30px 60px -30px #000d,0 6px 16px #00000059}
.pricing-section .price-card::before{content:'';position:absolute;inset:-1px;border-radius:inherit;border:1px solid #eecd8766;box-shadow:0 26px 60px -24px rgba(231,192,120,.3);opacity:0;pointer-events:none;transition:opacity .45s var(--ease-lux)}
.pricing-section .price-card:hover::before,.pricing-section .price-card:focus-within::before{opacity:1}
.motion-enabled .pricing-section .price-card{transition:transform .45s var(--ease-lux)}
.motion-enabled .pricing-section .price-card:hover{transform:translateY(-6px)}
.pricing-section .price-card .price{font-variant-numeric:oldstyle-nums;background:linear-gradient(180deg,#f4dda4,#eecd87 40%,#cfa452 78%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 1px 0 rgba(0,0,0,.4))}
.pricing-section .price-card .check-list{gap:0;margin:18px 0 24px}
.pricing-section .price-card .check-list li{padding-block:11px}
.pricing-section .price-card .check-list li+li{border-top:1px solid #e7c07817}
.pricing-section .price-card .check-list .icon{width:20px;height:20px;padding:4px;border-radius:50%;background:#eecd870f;box-shadow:inset 0 0 0 1px #eecd873d;margin-top:1px}
.pricing-section .price-card--featured{border-color:#e7c07866;background:linear-gradient(158deg,#0e2438f4,#061524f8 55%,#0c2033ee),radial-gradient(120% 80% at 50% -10%,#e7c0781f,transparent 62%)}
.pricing-section .price-card--featured .nx-arc{width:64px;height:64px}

/* -- 6. Creative-prijzen: van voetnoot naar grootboek ----------------------- */
.creative-prices{position:relative;overflow:hidden;border:1px solid #e7c0782e;border-radius:20px;background:linear-gradient(160deg,#07192bd9,#04101cea 60%,#0a1c30d9);box-shadow:inset 0 1px 0 #ffe9b820,0 26px 54px -26px #000d}
.creative-prices article{position:relative;border:0;background:none;box-shadow:none}
.creative-prices article+article{border-left:1px solid #e7c0781c}
.creative-prices article h3{font:500 11.5px/1.4 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:#e8c887}
.creative-prices article h3{color:#e8c887}
.creative-prices article p{color:#c9d1d3}
.creative-prices article strong{font-family:var(--serif);font-weight:400;font-variant-numeric:oldstyle-nums;background:linear-gradient(180deg,#f4dda4,#d5a94f 82%);-webkit-background-clip:text;background-clip:text;color:transparent}
.creative-prices::before{content:'';position:absolute;top:0;left:8%;right:8%;height:1px;background:linear-gradient(90deg,transparent,#ffe9b859,transparent);pointer-events:none}
.creative-prices::after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(238,205,135,.13) 50%,transparent 60%);transform:translateX(-120%);pointer-events:none}
@media(prefers-reduced-motion:no-preference){.motion-enabled .creative-section.in-view .creative-prices::after{animation:nx-sweep 1200ms var(--ease-sweep) 400ms 1 both}}
@keyframes nx-sweep{to{transform:translateX(120%)}}

/* -- 7. Werkwijze op de homepage: de helft van de ruimte, twee keer de klasse */
/* Compactie via de rail zelf; kop blijft erboven zodat de scèdichtheid binnen de
   governor-cap van 8 gelijktijdige grote loops blijft (sector-live bewijs 2026-09-19). */
.process-section .process-copy{margin-bottom:34px}.process-section .process-copy h2{font-size:clamp(34px,2.9vw,52px)}
.process-section .process-grid{gap:0;border:1px solid #e7c0782e;border-radius:24px;background:linear-gradient(160deg,#07192bd6,#04101ce8);box-shadow:inset 0 1px 0 #ffe9b820,0 26px 54px -26px #000c;padding:4px 0}
.process-section .process-grid li{padding:22px 26px;margin:0}
.process-section .process-grid li+li{border-left:1px solid #e7c0781c;border-top:0}
.process-section .process-grid .step-top{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.process-section .process-grid .step-number{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;font-variant-numeric:lining-nums;color:#e7c078;background:radial-gradient(circle at 35% 30%,#12283c,#04101c);box-shadow:0 0 0 1px #e7c07859,inset 0 0 0 1px #e7c07821,0 0 20px -8px #e7c07873;margin:0}
.process-section .process-grid h3{font-size:16.5px;letter-spacing:.1em;text-transform:uppercase;color:#f2e7cd;margin-bottom:8px}
.process-section .process-grid p{font-size:13px;line-height:1.55;color:#b9c2c7;max-width:30ch}
@media(max-width:1149px){.process-section .process-grid{grid-template-columns:repeat(2,1fr)}.process-section .process-grid li:nth-child(even){border-left:1px solid #e7c0781c}.process-section .process-grid li:nth-child(n+3){border-top:1px solid #e7c0781c}.process-section .process-grid li+li{border-left:0}.process-section .process-grid li:nth-child(even){border-left:1px solid #e7c0781c}}
@media(max-width:640px){.process-section .process-grid{grid-template-columns:1fr}.process-section .process-grid li{border-left:0!important}.process-section .process-grid li+li{border-top:1px solid #e7c0781c}}

/* -- 8. Pauzeknop: van cookiepil naar goud-glascapsule ----------------------- */
.motion-toggle{background:#04101cd9;border:1px solid #e7c07845;color:#efd6a3;font-size:10px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;border-radius:999px;padding:9px 18px;gap:10px;box-shadow:inset 0 1px 0 #ffe9b821,0 8px 20px #0009;opacity:.85;transition:opacity .3s ease,border-color .3s ease,transform .45s var(--ease-lux)}
.motion-toggle::before{content:'';width:4px;height:4px;flex:none;border-radius:50%;background:#e7c078;box-shadow:0 0 8px #e7c078}
.motion-toggle[aria-pressed=true]::before{background:#e7c07859;box-shadow:none}
.motion-toggle .icon{color:#e7c078;width:13px;height:13px}
.motion-toggle:hover{opacity:1;border-color:#e7c078a6;transform:translateY(-1px)}
.motion-toggle:active{transform:scale(.96);transition-duration:90ms}
.motion-toggle:focus-visible{outline:2px solid #e7c078;outline-offset:3px;opacity:1}

/* -- 9. Dienstenkaarten (detail-grid): zelfde couture-familie ----------------- */
.detail-grid article{position:relative;border:1px solid #e7c07828;border-radius:22px;background:linear-gradient(158deg,#0b1e30cc,#04101ce8 60%),radial-gradient(120% 80% at 88% -8%,#e7c0780f,transparent 60%);box-shadow:inset 0 1px 0 #ffe9b81f,0 26px 54px -28px #000c;padding:34px 30px}
.detail-grid article::before{content:'';position:absolute;inset:-1px;border-radius:inherit;border:1px solid #eecd8759;box-shadow:0 24px 54px -24px rgba(231,192,120,.26);opacity:0;pointer-events:none;transition:opacity .45s var(--ease-lux)}
.detail-grid article:hover::before,.detail-grid article:focus-within::before{opacity:1}
.motion-enabled .detail-grid article{transition:transform .45s var(--ease-lux)}
.motion-enabled .detail-grid article:hover{transform:translateY(-5px)}
.detail-grid article .check-list .icon{width:20px;height:20px;padding:4px;border-radius:50%;background:#eecd870f;box-shadow:inset 0 0 0 1px #eecd873d;margin-top:1px}

/* -- 10. Hovergrammatica sitebreed ------------------------------------------- */
.button{transition:transform .45s var(--ease-lux),box-shadow .3s ease,border-color .3s ease,background-color .3s ease,color .3s ease}
.button:active{transform:scale(.97);transition-duration:90ms}
.text-link{position:relative;text-decoration:none}
.text-link::after{content:'';position:absolute;left:0;bottom:-2px;width:100%;height:1px;background:#e7c078;transform:scaleX(0);transform-origin:right;transition:transform .7s var(--ease-lux)}
.text-link:hover::after,.text-link:focus-visible::after{transform:scaleX(1);transform-origin:left}
/* ==================== einde NAX-SPOORA-COUTURE-20260919 ==================== */

/* NAX-SPOORA-VERFIJNING2-20260919: eigen keuring ronde 2.
   (a) Marmerpaneel-titels: graveren op heldere film verlaagde leesbaarheid -
   terug naar ivoor met diepe gravure-halo en een sterker medaillonveil.
   (b) Vitrine-rail: vierkant restrandje om de iconen weg; vaste tweeregel-zone
   zodat alle vijf labels op dezelfde baseline hangen. (c) Procesrail: vaste
   titelzone tegen ragged baselines. (d) Hoekbogen featured kaart voller. */
.services-section .service-item h3{background:none;-webkit-background-clip:initial;background-clip:initial;color:#f7f0df;filter:none;text-shadow:0 1px 2px #000,0 2px 16px #000d,0 0 30px #000b,0 0 52px #0009}
.services-section .service-item::before{background:radial-gradient(62% 52% at 50% 46%,#04101cd9,#04101c80 55%,transparent 80%)}
.services-section .service-item p{color:#e9e4d6;text-shadow:0 1px 3px #000,0 2px 12px #000d,0 0 26px #000b}
.capability-rail .cap-front .icon,.capability-rail .cap-front svg{border:0!important;outline:0!important;background:none;box-shadow:none}
.capability-rail h3{min-height:33px;display:block}
.capability-rail .cap-ring{background:#0316209e}
.process-section .process-grid h3{min-height:44px}
.pricing-section .price-card--featured .nx-arc--tl{border-top-color:#eecd87b3;border-left-color:#eecd87b3}
.pricing-section .price-card--featured .nx-arc--br{border-bottom-color:#eecd87b3;border-right-color:#eecd87b3}

/* NAX-SPOORA-VERFIJNING3-20260919: computed-style bewijs ronde 3.
   (a) Oudere laag liet -webkit-text-fill-color:transparent achter op de
   paneeltitels; expliciet ivoor gezet. (b) .cap-ring bleek vierkant (radius 0):
   de ring wordt nu zelf het ronde medaillon, het losse icoonrandje blijft weg. */
.services-section .service-item h3{-webkit-text-fill-color:#f7f0df}
.capability-rail .cap-ring{border-radius:50%;overflow:hidden}

/* NAX-SPOORA-VERFIJNING4-20260919: (a) procesrail dieper glas boven de heldere
   scene zodat het instrument leest als een geheel; (b) creative-tarievenbalk
   in dezelfde grootboektaal als de prijzen. */
.process-section .process-grid{background:linear-gradient(160deg,#081a2cf0,#04101cf4 60%,#0a1c30ec);box-shadow:inset 0 1px 0 #ffe9b826,inset 0 -1px 0 #57c4ff12,0 26px 54px -26px #000d}
.creative-rates{position:relative;max-width:940px;margin-inline:auto;border:1px solid #e7c0782e;border-radius:18px;background:linear-gradient(160deg,#07192bd9,#04101cea);box-shadow:inset 0 1px 0 #ffe9b820,0 22px 46px -24px #000c;padding:26px 34px 22px}
.creative-rates::before{content:'';position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,#ffe9b855,transparent)}
.creative-rates .text-link{color:#e7c078;letter-spacing:.08em;text-transform:uppercase;font-size:12px}

/* ============================================================================
   NAX-SPOORA-VERFIJNING5-20260919 — juryronde 1 (7,81) volledig verwerkt.
   Drie batches van het verdict + per-blok restpunten. Bronnen: juryrapporten
   materialiteit/typografie/consistentie, wf_82729b5f. */

/* -- Tokens: één goudmateriaal, één muntschaduw ---------------------------- */
:root{--nx-gold-stroke:linear-gradient(135deg,#e9d8a6,#b08d3f)}

/* -- INGREEP 1: marmerpanelen — echte titelplaquette, één typografie ------- */
/* Plaquette (geen backdrop-filter: flikkerrisico boven spelende loops). */
.services-section .service-item{position:relative}
.services-section .service-item::before{left:8%;right:8%;top:32%;bottom:5%;width:auto;height:auto;transform:none;background:linear-gradient(180deg,#060a16d9,#060a16aa 60%,#060a16c4);border:1px solid #c9a86a4d;border-radius:18px;box-shadow:0 18px 40px -18px #000c,inset 0 1px 0 #ffe9b81f}
.services-section .service-item h3,.services-section .service-item .gold-rule,.services-section .service-item p{position:relative;z-index:1}
/* Eén dienstnaam-typografie (referentie: dienstenkaarten): zinskapitaal display-serif. */
.services-section .service-item h3{font:400 clamp(30px,2.2vw,40px)/1.15 var(--serif);text-transform:none;letter-spacing:-.02em;color:#f7f0df;-webkit-text-fill-color:#f7f0df;background:none;filter:none;animation:none!important;text-shadow:0 1px 2px #000c;display:block;gap:0}
.services-section .service-item h3::before,.services-section .service-item h3::after{display:none!important;content:none!important;animation:none!important}
.services-section .service-item p{text-shadow:0 1px 2px #000a;color:#e6e1d3;filter:none}
/* Vaste muntpositie per paneel, boven de plaquette. */
.services-section .service-item .gold-ring{position:absolute;top:22px;left:22px;z-index:2;margin:0}

/* -- INGREEP 3a: homepage-werkwijze = alleen de compacte rail --------------
   Het wauw-focuspaneel (process-reading) hoort bij de werkwijzepagina; op home
   veroorzaakte het dubbele copy, een concurrerende CTA en (via de focus-zoom)
   de half afgesneden 01-chip. */
body[data-page=home] .process-section .process-reading{display:none!important}
body[data-page=home] .process-section .process-grid{transform:none!important}
body[data-page=home] .process-section .section-progress{display:none}
.process-section .process-grid li:first-child{padding-left:30px}

/* -- Hero-dienstenrail: bevel, kalme rechterkap, dividers, baseline-slots -- */
.handoff-deck{box-shadow:0 5px 16px #cda45a30,0 18px 38px #000b,0 34px 58px -28px #000d,inset 0 1.5px 0 #ffe9b84d,inset 0 -1px #57c4ff22,inset 34px 0 44px -22px #04101ce0,inset -52px 0 56px -24px #04101cee}
.handoff-deck .deck-zone+.deck-zone::before{opacity:1;background:linear-gradient(transparent,#ddb85e55 14%,#ecc873 50%,#ddb85e55 86%,transparent)}
.handoff-deck .deck-zone>video{filter:saturate(.8) contrast(1.12) brightness(.66)}
.handoff-deck .deck-copy{min-height:46px;justify-content:center}
.handoff-deck .deck-zone:not(:nth-child(2)) .deck-copy::after{content:'';display:block;height:13px}
.handoff-deck .deck-subtitle{font-size:clamp(9.5px,.68vw,12px);letter-spacing:.1em;color:#dfe4e0}

/* -- Vitrine-rail: gedeelde grade, muntschaduw, één labelkleur ------------- */
.capability-rail>div video{filter:saturate(.78) contrast(1.12) brightness(.66)}
.capability-rail>div:nth-child(4) video{filter:saturate(.7) contrast(1.1) brightness(.52)}
.capability-rail .cap-front::before{background:linear-gradient(178deg,#04101c24 4%,#04101c30 40%,#04101cb8 62%,#04101ce8)}
.capability-rail .cap-ring{box-shadow:0 6px 14px rgba(4,8,18,.45),0 0 0 1px #e7c0786b,inset 0 1px 0 rgba(233,216,166,.35),inset 0 0 10px #57c4ff12}
.capability-rail h3{color:#f3ecd9;align-content:start}
.capability-rail>div{border:1px solid #e7c07836}

/* -- Mini-pijlers: één as, rustige regelval, groter titelcontrast ---------- */
.pillar-front{align-items:flex-start}
.pillar-front>.icon{box-shadow:0 6px 14px rgba(4,8,18,.45),inset 0 0 0 1px #e7c07859,inset 0 1px 0 rgba(233,216,166,.35)}
.pillar-front b{font-size:14.5px}
.pillar-front small{font-size:12.5px;white-space:nowrap}
@media(max-width:1250px){.pillar-front small{white-space:normal}}

/* -- Prijskaarten: labelslot-reservering, microlabel-taal, p/m-baseline,
      gradient-rand featured, boog-echo op de zusterkaarten ----------------- */
.pricing-section .price-card .price{margin-bottom:4px}
.pricing-section .price-card .price small{font-size:15px;letter-spacing:.04em;vertical-align:baseline;margin-left:3px}
.pricing-section .price-card .price-label{font:500 10.5px/1.9 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:#e8c887;margin:0 0 6px}
.pricing-section .price-card:not(.price-card--featured) .price::after{content:'';display:block;height:26px}
.pricing-section .price-card{background:linear-gradient(158deg,#0c2033f6,#04101cfa 55%,#0a1c30f2),#061524;border-color:#e7c07836;box-shadow:inset 0 1px 0 #ffe9b828,0 34px 56px -26px #02060ecc,0 8px 18px #0006}
.pricing-section .price-card--featured{border-color:transparent;background:linear-gradient(#0e2438,#061524) padding-box,var(--nx-gold-stroke) border-box;border:1px solid transparent;box-shadow:inset 0 1px 0 #ffe9b833,0 36px 60px -26px #02060ed9,0 8px 18px #b9892922}
.pricing-section .price-card--featured::after{content:none}
.pricing-section .price-card:not(.price-card--featured)::after{content:'';position:absolute;top:-1px;left:-1px;width:38px;height:38px;border:1px solid transparent;border-top-color:#e7c07866;border-left-color:#e7c07866;border-top-left-radius:18px;pointer-events:none;mask-image:linear-gradient(135deg,#000 30%,transparent 60%);-webkit-mask-image:linear-gradient(135deg,#000 30%,transparent 60%)}
.pricing-section .price-card--featured .nx-arc--tl{border-top-color:#ecd393;border-left-color:#ecd393}
.pricing-section .price-card--featured .nx-arc--br{border-bottom-color:#ecd393;border-right-color:#ecd393}

/* -- Creative-grootboek: munten, capsules, gebonden voetnoot --------------- */
.creative-prices article>.icon{width:46px;height:46px;padding:12px;border-radius:50%;color:#eecd87;background:radial-gradient(circle at 32% 28%,#eecd8722,#04101ce6 68%);box-shadow:0 6px 14px rgba(4,8,18,.45),inset 0 0 0 1px #e7c07859,inset 0 1px 0 rgba(233,216,166,.35);margin-bottom:14px}
.creative-prices .button{border-radius:999px}
.creative-prices article+article{border-left:1px solid #e7c07826}
.creative-prices>.fineprint{border-top:1px solid #e7c0781f;margin-top:12px;padding-top:14px}

/* -- Creative-tarievenbalk homepage: van tekstmuur naar vier chips --------- */
.creative-rates{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 14px;padding:24px 30px 20px}
.rate-chip{white-space:nowrap;display:inline-flex;align-items:baseline;gap:7px;padding:9px 16px;border:1px solid #e7c07830;border-radius:999px;background:#04101c99;box-shadow:inset 0 1px 0 #ffe9b81a;font-size:12.5px;letter-spacing:.04em;color:#cfd6d6}
.rate-chip strong{font-family:var(--serif);font-weight:400;font-variant-numeric:oldstyle-nums;font-size:17px;background:linear-gradient(180deg,#f4dda4,#d5a94f 82%);-webkit-background-clip:text;background-clip:text;color:transparent}
.rate-note{flex-basis:100%;text-align:center;font-size:11.5px;letter-spacing:.06em;color:#9fb0b4;margin-top:2px}
.creative-rates .text-link{flex-basis:100%;text-align:center;margin-top:4px}

/* -- Pauzeknop: goudgradient-rand, gecentreerde gloeidot, sneller leesbaar - */
.motion-toggle{border:1px solid transparent;background:linear-gradient(#04101cd9,#04101cd9) padding-box,var(--nx-gold-stroke) border-box;color:#f3dfae;letter-spacing:.15em;box-shadow:inset 0 1px 0 #ffe9b830,inset 0 -6px 12px -8px #0009,0 8px 20px #0009}
.motion-toggle::before{width:5px;height:5px;align-self:center;box-shadow:0 0 9px #e7c078,0 0 3px #e7c078}
.motion-toggle[aria-pressed=true]::before{background:#e7c07845;box-shadow:none}

/* -- Trust-strip: begrenzing, gravure, gedeelde baseline ------------------- */
.trust-strip{border-block:1px solid #e7c0781a;padding-block:16px}
.trust-names span{color:#f0e6cf;text-shadow:0 1px 0 #000}
.trust-label{letter-spacing:.22em;align-self:baseline}

/* -- Dienstenkaarten: rand-continuïteit, gelaagdheid, warme slagschaduw ---- */
.detail-grid article{border-color:#e7c07836;box-shadow:inset 0 1px 0 #ffe9b824,0 30px 54px -26px #02060ec9,0 8px 18px #0005}
.detail-grid article .check-list{border-top:1px solid #e7c07817;padding-top:16px;margin-top:18px}

/* -- Werkwijze-rail: subtiel diepere zitting --------------------------------*/
.process-section .process-grid .step-number{box-shadow:0 6px 14px rgba(4,8,18,.45),0 0 0 1px #e7c07859,inset 0 0 0 1px #e7c07821,inset 0 1px 0 rgba(233,216,166,.3)}
/* ================== einde NAX-SPOORA-VERFIJNING5-20260919 ================== */



/* NAX-SPOORA-VERFIJNING5B-20260919: plaquette lag op z-1 onder de sectiescene-
   compositing; expliciet op z:0 binnen het geisoleerde paneel. */
.services-section .service-item::before{z-index:0}
.creative-rates{max-width:1180px}
.creative-rates .text-link{display:inline-flex;justify-content:center;width:100%}

/* NAX-SPOORA-VERFIJNING5C-20260919: het oude veil droeg een radial mask-image
   die de nieuwe plaquette tot blob maskeerde; mask expliciet uit. */
.services-section .service-item::before{mask-image:none;-webkit-mask-image:none}

/* NAX-SPOORA-VERFIJNING5D-20260919: plaquettebodem voller zodat de waterval de
   bodyregels nergens meer aanvecht; zachte binnenglans bovenrand. */
.services-section .service-item::before{background:linear-gradient(180deg,#060a16dd,#060a16bd 58%,#060a16d2);box-shadow:0 18px 40px -18px #000c,inset 0 1px 0 #ffe9b826}

/* NAX-SPOORA-VERFIJNING5E-20260919: zonder focuspaneel is een gevulde
   actieve-stap-munt op home betekenisloos; vier identieke munten. */
body[data-page=home] .process-section .process-grid .step-number{background:radial-gradient(circle at 35% 30%,#12283c,#04101c)!important;color:#e7c078!important}

/* ============================================================================
   NAX-SPOORA-VERFIJNING6-20260919 — juryronde 2 (8,64) volledig verwerkt.
   Bewuste afwijking: geen backdrop-filter op het werkwijzepaneel (de jury
   suggereerde blur, maar backdrop-filter boven spelende loops is exact de
   flikkerklasse die we vandaag hebben uitgebannen); alpha-verlaging volstaat.
   Bewust behouden: subregel-slots op de hero-rail (baseline-lock uit ronde 1)
   en het eigenaarslabel "STRATEGIE + DESIGN" (goedgekeurde tekst). */

/* -- 1. Marmerpaneel-plaquette: van geplakt vlak naar gemonteerd materiaal -- */
.services-section .service-item::before{top:29%;bottom:2.5%;background:radial-gradient(120% 60% at 50% 0%,#12203466,transparent 55%),linear-gradient(180deg,#070c19dd,#060a16bd 58%,#060a16d4);border:1px solid #c8a55a66;box-shadow:0 18px 40px -18px #000c,inset 0 1px 0 rgba(255,255,255,.07),inset 0 0 0 1px #06101c66}
.services-section .service-item h3{padding-top:10px}
.services-section .service-item p{margin-bottom:34px;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.services-section>.scene img,.services-section>video.scene-loop{filter:brightness(.82) saturate(.92)}

/* -- 2. Railgrade-unificatie: luminantieband per clipsegment ---------------- */
.handoff-deck .deck-zone[data-service=maatwerk]>video{filter:saturate(.72) contrast(1.1) brightness(.5)}
.handoff-deck .deck-zone[data-service=strategie-design]>video{filter:saturate(.8) contrast(1.12) brightness(.68)}
.handoff-deck .deck-zone[data-service=technisch-beheer]>video{filter:saturate(.72) contrast(1.1) brightness(.58)}
.handoff-deck .deck-zone[data-service=persoonlijke-regie]>video{filter:saturate(.75) contrast(1.1) brightness(.52)}
.handoff-deck{--warm:1}
.handoff-deck>.deck-zone::after{background:linear-gradient(90deg,#04101c99,#04101c59 42%,#04101c14),linear-gradient(#5c431b17,#5c431b17)}
.handoff-deck{box-shadow:0 5px 16px #cda45a30,0 18px 38px #000b,0 34px 58px -28px #000d,inset 0 1.5px 0 #ffe9b84d,inset 0 -1.5px 0 #d5a94f45,inset 34px 0 44px -22px #04101ce0,inset -52px 0 56px -24px #04101cee}
.capability-rail>div:nth-child(1) video{filter:saturate(.75) contrast(1.1) brightness(.58)}
.capability-rail>div:nth-child(2) video{filter:saturate(.72) contrast(1.1) brightness(.56)}
.capability-rail>div:nth-child(3) video{filter:saturate(.8) contrast(1.08) brightness(.8)}
.capability-rail>div:nth-child(4) video{filter:saturate(.68) contrast(1.08) brightness(.48)}
.capability-rail>div:nth-child(5) video{filter:saturate(.8) contrast(1.08) brightness(.76)}

/* -- 3. Goudtaal-unificatie: warm goud op alle randen en schaduwen ---------- */
.pricing-section .price-card{border-color:#c8a55a5c;box-shadow:inset 0 1px 0 #ffe9b828,0 34px 56px -26px rgba(10,6,2,.88),0 8px 18px rgba(12,7,2,.45)}
.pricing-section .price-card:not(.price-card--featured)::after{border-top-color:#e7c078a6;border-left-color:#e7c078a6}
.detail-grid article{border-color:#c8a55a52;box-shadow:inset 0 1px 0 #ffe9b824,0 30px 54px -26px rgba(10,6,2,.82),0 8px 18px rgba(12,7,2,.4)}
.trust-strip{border-block:1px solid #c8a55a4d}
.trust-names span{color:#ecdfbf}
.rate-chip{border-color:#c8a55a52}

/* -- 4. Creative-grootboek: echte capsules, dragende rand, munt-ademruimte -- */
.creative-prices article>.button{border-radius:999px;border-width:1.5px;border-color:#c8a55a8c}
.creative-prices article>.icon{margin-bottom:12px}
.creative-prices article h3{margin-top:2px;margin-bottom:10px}

/* -- 5. Mini-pijlers: ruimte, serif-naamgeving, voelbare munten ------------- */
.mini-pillars{gap:40px}
.mini-pillars>div+div{padding-left:26px}
.pillar-front>.icon{transform:translateX(-2px);box-shadow:0 6px 14px rgba(4,8,18,.45),inset 0 0 0 1px #e7c07859,inset 0 1px 0 rgba(233,216,166,.4),inset 0 -6px 10px -8px #000c}
.pillar-front b{font:400 19px/1.2 var(--serif);text-transform:none;letter-spacing:0;background:none;-webkit-background-clip:initial;background-clip:initial;color:#f3ecd9;-webkit-text-fill-color:#f3ecd9}
.pillar-front small{color:#dbe2e3}

/* -- 6. Microfixes verspreid ------------------------------------------------ */
.capability-rail>div:nth-child(3) h3{font-size:11px;letter-spacing:.12em;white-space:nowrap;min-height:33px}
.pricing-section .price-card .price small{position:relative;top:1px}
.process-section .process-copy .section-lead{text-shadow:0 1px 3px #000,0 2px 12px #000b}
.process-section .process-grid .step-top .icon{width:34px;height:34px;padding:8px;border-radius:50%;background:#0616246e;box-shadow:inset 0 0 0 1px #e7c07840}
.process-section .process-grid{background:linear-gradient(160deg,#081a2ce3,#04101cec 60%,#0a1c30e0)}
/* ================== einde NAX-SPOORA-VERFIJNING6-20260919 ================== */

/* ============================================================================
   NAX-SPOORA-VERFIJNING7-20260919 — juryronde 3 (8,97): twee geverifieerde
   regressies hersteld + laatste CSS-pakket richting het CSS-plafond.
   Restgat is asset-/contentniveau (clipregrade Spoor B + eigenaarsbesluiten). */

/* -- REGRESSIE 1: .cap-sheen is het eerste railkind; alle nth-tellingen op
      type (div) i.p.v. child, anders verschuiven de per-tegel grades. ------- */
.capability-rail>div:nth-child(1) video,.capability-rail>div:nth-child(2) video,.capability-rail>div:nth-child(3) video,.capability-rail>div:nth-child(4) video,.capability-rail>div:nth-child(5) video{filter:saturate(.78) contrast(1.1) brightness(.66)}
.capability-rail>div:nth-of-type(1) video{filter:saturate(.75) contrast(1.1) brightness(.58)}
.capability-rail>div:nth-of-type(2) video{filter:saturate(.66) contrast(1.08) brightness(.5) hue-rotate(8deg)}
.capability-rail>div:nth-of-type(3) video{filter:saturate(.8) contrast(1.08) brightness(.82)}
.capability-rail>div:nth-of-type(4) video{filter:saturate(.68) contrast(1.08) brightness(.48)}
.capability-rail>div:nth-of-type(5) video{filter:saturate(.8) contrast(1.08) brightness(.76)}
.capability-rail>div:nth-child(3) h3{font-size:inherit;letter-spacing:inherit;white-space:inherit}
.capability-rail>div:nth-of-type(3) h3{font-size:11px;letter-spacing:.12em;white-space:nowrap;min-height:33px}

/* -- REGRESSIE 2: p/m viel buiten de background-clip-paint en werd transparant. */
.pricing-section .price-card .price small{position:static;top:auto;background:none;-webkit-background-clip:initial;background-clip:initial;color:#eecd87;-webkit-text-fill-color:#eecd87}

/* -- Vitrine-rail: donkere lak-bezel met warme goudhairline, één muntgoud --- */
.capability-rail{border:1px solid #c8a55a66;background:linear-gradient(160deg,#0b1e30e8,#04101cf0 55%,#0e2a3ee2)}
.capability-rail::before{background:linear-gradient(118deg,transparent 24%,#e7c07816 40%,transparent 58%)}
.capability-rail .cap-ring{background:#061624cc}
.capability-rail .cap-ring,.capability-rail .cap-ring .icon{color:#f2d492}

/* -- Hero-rail: segment 2 rechterhelft dempen, segment 3 warmer, subregel ink */
.handoff-deck .deck-zone[data-service=strategie-design]::after{background:linear-gradient(90deg,#04101c99,#04101c59 42%,#04101c14),linear-gradient(270deg,#04101c73,transparent 42%),linear-gradient(#5c431b17,#5c431b17)}
.handoff-deck .deck-zone[data-service=technisch-beheer]::after{background:linear-gradient(90deg,#04101c99,#04101c59 42%,#04101c14),linear-gradient(#6b4d1f2b,#6b4d1f2b)}
.handoff-deck .deck-subtitle{color:#e9ece8;font-weight:500}

/* -- Processectie: oplopende scrim, lichtere icooncirkels, sterkere subkopscrim */
.process-section .process-grid{background:linear-gradient(100deg,#0a1f33f0,#04101cf2 55%,#071626ec)}
.process-section .process-grid .step-top .icon{background:#0d223a8f;box-shadow:inset 0 0 0 1px #e7c0784d}
.process-section .process-copy .section-lead{text-shadow:0 1px 3px #000,0 2px 14px #000d,0 0 26px #000a}

/* -- Servicepanels: kernzone iets voller, body lichter -------------------- */
.services-section .service-item::before{background:radial-gradient(120% 60% at 50% 0%,#12203466,transparent 55%),linear-gradient(180deg,#070c19e0,#060a16c9 58%,#060a16d9)}
.services-section .service-item p{color:#efe9da}

/* -- Grootboek en kaarten: plaquettefamilie sluiten ------------------------ */
.creative-prices{background:radial-gradient(120% 60% at 50% 0%,#12203455,transparent 55%),linear-gradient(160deg,#07192bd9,#04101cea 60%,#0a1c30d9)}
.creative-prices article p{color:#d3dad9}
.detail-grid article{background:radial-gradient(120% 60% at 50% 0%,#12203450,transparent 55%),linear-gradient(158deg,#0b1e30cc,#04101ce8 60%),radial-gradient(120% 80% at 88% -8%,#e7c0780f,transparent 60%)}

/* -- Klein grut ------------------------------------------------------------ */
.motion-toggle{color:#f6e6bd}
.pillar-front small{color:#e3e0d4}
.trust-label{color:#cbb98f}
.rate-chip{font-size:12px}
.rate-chip strong{font-size:16px}
/* ================== einde NAX-SPOORA-VERFIJNING7-20260919 ================== */

/* NAX-SPOORA-VERFIJNING7B-20260919: (a) alle vijf vitrinelabels op één regel
   en één korps (ONLINE AFSPRAKEN kreeg per abuis het grote korps terug);
   (b) bezel donkerder aangezet en de buitenring warm i.p.v. bruingrijs. */
.capability-rail h3,.capability-rail>div:nth-of-type(3) h3{white-space:nowrap;font-size:clamp(10px,.68vw,12.5px);letter-spacing:.13em;min-height:0}
@media(max-width:1100px){.capability-rail h3,.capability-rail>div:nth-of-type(3) h3{white-space:normal;min-height:33px}}
.capability-rail{background:linear-gradient(160deg,#081727ec,#04101cf2 55%,#0c2233e6)}
.capability-rail{box-shadow:0 0 0 1px #c8a55a42,inset 0 1px 0 #ffe9b822,inset 0 -1px 0 #57c4ff12,0 30px 60px -28px #000d,0 6px 18px #b9892914}

/* NAX-SPOORA-VERFIJNING7C-20260919: de eerdere nth-child(3)-reset erfde het
   grote cap-front-korps op ONLINE AFSPRAKEN; nu winnen deze regels van alle
   eerdere nth-varianten en dragen alle vijf labels exact hetzelfde korps. */
.capability-rail>div:nth-child(3) h3,.capability-rail>div:nth-of-type(3) h3,.capability-rail>div h3{font-size:clamp(9.5px,.6vw,11.5px);letter-spacing:.1em;white-space:nowrap;min-height:0;font-weight:600}
@media(max-width:1100px){.capability-rail>div:nth-child(3) h3,.capability-rail>div:nth-of-type(3) h3,.capability-rail>div h3{white-space:normal;min-height:30px}}

/* NAX-SPOORA-VERFIJNING8-20260919: de drie chargeable slotpunten (jury r4, 9,2).
   (a) grootboek: vaste munt-labelclearance; (b) plaquette kerndekking + halo;
   (c) scrimnaden hero 2->3 en processtap 4 gesloten. */
.creative-prices article{padding-top:6px}
.creative-prices article>.icon{margin-bottom:20px;display:inline-grid}
.creative-prices article h3{margin-top:0;clear:both;line-height:1.5}
.services-section .service-item::before{background:radial-gradient(120% 60% at 50% 0%,#12203466,transparent 55%),linear-gradient(180deg,#070c19e6,#060a16d2 58%,#060a16de)}
.services-section .service-item p{text-shadow:0 1px 2px rgba(0,0,0,.3)}
.handoff-deck .deck-zone[data-service=technisch-beheer]::after{background:linear-gradient(90deg,#04101cb3,#04101c59 46%,#04101c1f),linear-gradient(#6b4d1f2b,#6b4d1f2b)}
.process-section .process-grid{background:linear-gradient(100deg,#0a1f33f0,#04101cf2 52%,#050f1df2 88%,#04101cf4)}

/* NAX-SPOORA-VERFIJNING8B-20260919: munt als blok boven het pakketlabel
   (een inline-grid bleef naast de caps hangen); één verticale as, vaste 14px
   clearance. */
.creative-prices article>.icon{display:grid;float:none;margin:0 0 14px}
.creative-prices article h3{display:block}

/* NAX-SPOORA-VERFIJNING8C-20260919: de munt stond absoluut gepositioneerd uit
   een oudere laag en sneed daardoor onder het label; terug in de flow. */
.creative-prices article>.icon{position:static}

/* ===== CINEMA-GLAS v4 — juryronde (7,5 -> lat 9,4) 2026-09-19 ===== */
/* J1: binnenwerk couture. Optierijen als hairline-divider-regels i.p.v. SaaS-kaartjes; serif-titels. */
.booking-section--glass .choice-list button{background:transparent;border:0;border-bottom:1px solid #d9b36f26;border-radius:0;padding:15px 44px 15px 8px;text-align:left}
.booking-section--glass .choice-list button strong{font:400 17px/1.3 var(--serif);letter-spacing:.01em;color:#f2ecdd;display:block}
.booking-section--glass .choice-list button small{font:600 9.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#c8b384;margin-top:5px;display:block}
.booking-section--glass .choice-list button[aria-pressed="true"]{background:linear-gradient(90deg,#e5c37811,transparent 78%);border-bottom-color:#e5c37845;border-left:2px solid var(--gold-bright);padding-left:14px;box-shadow:none}
.booking-section--glass .choice-list button[aria-pressed="true"] strong{color:var(--gold-bright)}
.booking-section--glass .choice-list button[aria-pressed="true"]::after{width:15px;height:15px;border-color:#e5c378a6;background:transparent;color:var(--gold-bright);font-size:9px;top:50%;transform:translateY(-50%);right:10px}
/* J1: één disclaimer — headerregel en statusregel visueel stil (blijven beschikbaar voor schermlezers). */
.booking-section--glass .agenda-sub{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.booking-section--glass [data-booking-status]{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* J1: koppellogo's in het palet; feature-labels leesbaar tegen fel licht. */
.booking-section--glass .booking-tools img{filter:grayscale(1) sepia(.9) saturate(1.6) hue-rotate(-12deg) brightness(1.15);opacity:.85}
.booking-section--glass .booking-copy .booking-benefits span,.booking-section--glass .booking-benefits li>span:last-child{color:#f2ecdd;text-shadow:0 1px 4px #020b0ecc,0 2px 12px #020b0e99}
/* J2: tabs — geen half afgesneden woorden; fade alleen op het uiterste randje. */
.booking-section--glass .industry-tabs{-webkit-mask:linear-gradient(90deg,#000 96%,transparent);mask:linear-gradient(90deg,#000 96%,transparent);gap:2px}
.booking-section--glass .industry-tabs [role=tab]{font-size:10.5px;padding:11px 11px}
/* J2: mobiel — wizard direct onder de copy, kop direct leesbaar, ruimte voor de pillen. */
.booking-section--glass .kinetic .ki{opacity:1!important;transform:none!important;filter:none!important}
@media(max-width:1100px){
.booking-section--glass .booking-demo{order:2}
.booking-section--glass .booking-tools{order:3}
.booking-section--glass{padding-bottom:96px}
}
/* J3: fysieke verankering — contactschaduw, warme gebroken vloerreflectie, randlicht volgt het setlicht (rechts). */
.booking-section--glass .booking-demo{box-shadow:0 7px 20px -8px #000000d9,0 40px 100px -20px #000000e6,0 0 60px -10px #d4af3718,inset 0 1px 0 #fff3cf2e}
.booking-section--glass .booking-demo::before{background:linear-gradient(300deg,#e5c378b0 0%,#ffffff12 32%,#00000026 58%,#e5c37842 100%)}
.booking-section--glass .booking-layout::before{content:'';grid-column:2;grid-row:3;height:52px;margin:-14px 14% 0;
 background:linear-gradient(180deg,#f0cd853d,#e5c37814 45%,transparent);filter:blur(7px);border-radius:32px;pointer-events:none;
 -webkit-mask:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent);mask:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent)}
/* Eén disclaimer: de duplicaatregel in de agenda-head wordt sr-only in de glasvariant. */
.booking-section--glass .agenda-head>span:not([class]){position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* ===== CINEMA-GLAS v6 — juryronde 2 (8,97 -> lat 9,4) ===== */
/* Alle zes branchetabs binnen de glasrand: eigen rij op volle breedte, geen afkap, geen mask. */
.booking-section--glass .booking-demo{display:flex;flex-direction:column}
.booking-section--glass .industry-tabs{position:static;width:100%;max-width:none;flex-wrap:nowrap;justify-content:space-between;gap:0;margin-top:14px;padding:5px;border-color:#d5ac6640;-webkit-mask:none;mask:none;overflow:visible}
.booking-section--glass .industry-tabs [role=tab]{flex:1 1 0;text-align:center;font-size:10px;letter-spacing:.1em;padding:10px 4px;white-space:nowrap;min-width:0}
/* Glas is glas: binnenvlakken translucent en warm — de (geblurde) film schemert in de body. */
.booking-section--glass .agenda-stage{background:linear-gradient(125deg,#0b1c1f8a,#14100a4d 55%,#04121782);border-color:#e5c37836}
.booking-section--glass .agenda-panel{background:linear-gradient(160deg,#10202666,#1a140a40 60%,#07131750);border-color:#c8a25f30;box-shadow:inset 0 1px 0 #f5d69b10}
/* Contactschaduw leest ook op de lichte vloerglans: strakke donkere voet + warme gloed eronder. */
.booking-section--glass .booking-demo{box-shadow:0 3px 10px -2px #000e,0 14px 30px -10px #000c,0 44px 100px -22px #000000e0,0 0 60px -10px #d4af3716,inset 0 1px 0 #fff3cf2c}
.booking-section--glass .booking-layout::after{background:radial-gradient(40% 58% at 50% 0%,#000000ad,transparent 68%),radial-gradient(52% 95% at 50% 10%,#e7c0782e,transparent 76%)}

/* ===== CINEMA-GLAS v7 — mobiele tabrij (juryronde 3) =====
   Op smal scherm géén geperste rij: horizontaal scrollende snap-rij met vaste tussenruimte
   en zachte edge-fade; desktop behoudt de volledige rij binnen de glasrand. */
@media(max-width:760px){
.booking-section--glass .industry-tabs{justify-content:flex-start;gap:6px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding:5px 12px;
 -webkit-mask:linear-gradient(90deg,transparent,#000 5%,#000 93%,transparent);mask:linear-gradient(90deg,transparent,#000 5%,#000 93%,transparent)}
.booking-section--glass .industry-tabs::-webkit-scrollbar{display:none}
.booking-section--glass .industry-tabs [role=tab]{flex:0 0 auto;min-width:max-content;padding:10px 13px;scroll-snap-align:center;font-size:10px;letter-spacing:.12em}
.motion-global{font-size:9px;padding:8px 12px}
}

/* ===== v8 — juryronde 4 (3x 9,1): de pauzeknop dekt op mobiel nooit meer content af.
   Op smal scherm wordt hij een klein rond icoon (?? in goud); de naam blijft volledig
   beschikbaar voor schermlezers en de aria-pressed-status blijft ongewijzigd. */
@media(max-width:620px){
.motion-global{width:40px;height:40px;padding:0;border-radius:50%;display:grid;place-items:center;opacity:.94}
.motion-global span{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.motion-global::before{content:'\275A\275A';font-size:9px;letter-spacing:2.5px;color:#f0cd85;padding-left:2px}
.motion-global[aria-pressed="true"]::before{content:'\25B6';font-size:11px;letter-spacing:0;padding-left:3px}
}
/* Stapindicator breekt nooit: één regel, ook op smal scherm. */
.booking-section--glass .agenda-wizard p{white-space:nowrap}
@media(max-width:620px){.booking-section--glass .agenda-wizard{gap:10px}.booking-section--glass .agenda-wizard p{font-size:9px;letter-spacing:.2em}.booking-section--glass .agenda-wizard button{padding:10px 16px}}

/* ===== v9 — slotpunten juryronde 5 (9,33): mobiele scroll-affordance + atriumlicht ===== */
@media(max-width:760px){
/* Duidelijke fade rechts: de tabstrip toont voelbaar dat er meer branches zijn. */
.booking-section--glass .industry-tabs{-webkit-mask:linear-gradient(90deg,transparent,#000 4%,#000 78%,transparent 99%);mask:linear-gradient(90deg,transparent,#000 4%,#000 78%,transparent 99%)}
/* Warm atriumlicht achter de kaart: de mobiele kaart hangt in dezelfde ruimte als desktop. */
.booking-section--glass .booking-demo{box-shadow:0 3px 10px -2px #000e,0 14px 30px -10px #000c,0 0 120px -8px #e7c0783a,0 44px 100px -22px #000000dd,inset 0 1px 0 #fff3cf2c}
.booking-section--glass .booking-layout::after{grid-column:1;height:64px;margin:-22px 7% 0}
}
/* Slotdetail (jury unaniem): de "Interactieve demo"-badge in maison-toon — gouden gespatieerde
   caps met warme hairline, geen generieke outline-box meer. */
.booking-section--glass .demo-label{border:0;background:transparent;padding:0;font:600 10px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--gold-bright)}
.booking-section--glass .demo-label::before{content:'';display:inline-block;width:20px;height:1px;background:linear-gradient(90deg,var(--gold-bright),transparent);margin-right:9px;vertical-align:middle}

/* NAX-SPOORA-GEMINI9-20260919: onbetwiste punten uit de Gemini-second-opinion
   (6,9; sanitized/gecomprimeerde beelden - zie audit). (a) radiale goudglow
   achter de vitrine-medaillons tegen het lage icooncontrast; (b) ademruimte
   onder de vitrinelabels; (c) plaquette-body naar licht champagne;
   (d) p/m als verfijnd superscript met vaste relatie tot het bedrag. */
.capability-rail .cap-ring{position:relative}
.capability-rail .cap-ring::before{content:'';position:absolute;inset:-16px;border-radius:50%;background:radial-gradient(circle,#e7c07821 0%,transparent 68%);pointer-events:none}
.capability-rail .cap-front{padding-bottom:14px}
.services-section .service-item p{color:#e9edef}
.pricing-section .price-card .price small{font-size:14px;letter-spacing:.08em;opacity:.85;vertical-align:super}

/* ============================================================================
   NAX-SPOORA-CONVERGENTIE10-20260919 — spoor 1: alle punten waar minstens twee
   van de drie jury's (intern / Gemini / Codex) elkaar raken, in één ronde.
   Bewust NIET overgenomen (2-tegen-1 of eigenaarskeuze): hoekradius 8-12px op
   CTA's (capsule-taal is huisstijl), cirkelchips van de vinkjes verwijderen
   (alleen Codex), accentkaart verleggen (eigenaarsbesluit: Website Build). */

/* -- A. Marmerpanelen: titel en tekst worden één verhaal ------------------- */
/* Meting: h3 EN p droegen beide margin-top:auto (elk ~99px) - vandaar de kloof. */
.services-section .service-item p{margin-top:20px;margin-bottom:34px}
.services-section .service-item::before{top:42%;bottom:3%}
/* Body in de leestaal van de rest van de site (intern r2 + Gemini): sans,
   licht champagne, geen zware schaduw (Codex). */
.services-section .service-item p{font:400 16px/1.55 var(--sans);color:#e2ddce;text-shadow:0 1px 2px rgba(0,0,0,.3)}
.services-section .service-item p br{display:none}
.services-section .service-item p{max-width:30ch;margin-inline:auto}
/* Eén verfijnd ornament: 40x1 haarlijnverloop zonder gloed (Gemini+Codex). */
.services-section .service-item .gold-rule{width:40px;height:1px;background:linear-gradient(90deg,transparent,#e7c078,transparent);box-shadow:none;margin:14px auto 0}

/* -- B. Vitrine-rail: ontstapelen, kleinere medaillons, groter label ------- */
.capability-rail{padding:16px;border-radius:18px}
.capability-rail>div{border:0;border-radius:10px;box-shadow:none;background:linear-gradient(165deg,#ffffff0a,#ffffff03 38%,#03121966)}
.capability-rail::after{display:none}
.capability-rail .cap-ring{width:56px;height:56px}
.capability-rail .cap-ring .icon,.capability-rail .cap-ring svg{width:26px;height:26px}
.capability-rail>div h3,.capability-rail>div:nth-child(3) h3,.capability-rail>div:nth-of-type(3) h3{font-size:13px;letter-spacing:.04em;font-weight:600;color:#f7f4ec;padding-inline:16px}
.capability-rail .cap-front{padding-bottom:16px}

/* -- C. Creative-grootboek: één linker leesas + ontwarde prijsregel -------- */
.creative-prices article{text-align:left;padding-inline:32px}
.creative-prices article>.icon{margin-left:0}
.creative-prices article h3{justify-content:flex-start;text-align:left}
.creative-prices article p{display:flex;align-items:baseline;column-gap:7px;flex-wrap:wrap;font:500 11px/1.6 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#c9d1d3}
.creative-prices article p strong{font-size:30px;letter-spacing:0;text-transform:none}
.creative-prices article .button{margin-top:14px}

/* -- D. CTA-hierarchie: secundaire capsules als verfijnde outline ---------- */
.pricing-section .price-card .button--line,.creative-prices article>.button{background:rgba(231,192,120,.06);border-color:rgba(231,192,120,.4);color:#fff}
.pricing-section .price-card .button--line:hover,.creative-prices article>.button:hover{background:rgba(231,192,120,.12);border-color:rgba(231,192,120,.65)}
/* Featured: stille dominantie (Gemini): zachte buitengloed + gedimde buren. */
.pricing-section .price-card--featured{box-shadow:inset 0 1px 0 #ffe9b833,0 0 35px rgba(231,192,120,.12),0 36px 60px -26px #02060ed9}
.pricing-section .price-card:not(.price-card--featured){opacity:.94}

/* -- E. Micro-spacing en disclaimers --------------------------------------- */
.pricing-section .price-card .check-list .icon{width:18px;height:18px;min-width:18px;padding:3px;margin-right:2px}
.pricing-section .price-card .check-list li{gap:12px}
.pricing-section>.container>.fineprint,.pricing-section .fineprint.centered{font-size:12px;color:rgba(255,255,255,.5);letter-spacing:.02em;border-top:1px solid rgba(231,192,120,.08);padding-top:18px;margin-top:26px}

/* -- F. Mobiel: scroll-snap voor rail en grootboek (Gemini #12) ------------ */
@media(max-width:1023px){
 .capability-rail{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:14px;scrollbar-width:thin}
 .capability-rail>div{flex:0 0 auto;min-width:228px;scroll-snap-align:start}
 .creative-prices{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
 .creative-prices article{flex:0 0 auto;min-width:244px;scroll-snap-align:start;border-left:0}
 .creative-prices article+article{border-left:1px solid #e7c0781c}
 .creative-prices>.fineprint{min-width:100%}
}
/* ============ einde NAX-SPOORA-CONVERGENTIE10-20260919 ==================== */



/* NAX-SPOORA-CONVERGENTIE10B-20260919: (a) de nieuwe lijnfamilie draagt
   stroke="currentColor" als kenmerk - oude fill-CSS mag hem nooit vullen;
   (b) br-verwijdering plakte woorden aan elkaar - teruggedraaid;
   (c) vitrinelabel een fractie kleiner zodat de langste term past. */
svg.icon[stroke="currentColor"]{fill:none!important}
.services-section .service-item p br{display:inline}
.services-section .service-item p{max-width:none}
.capability-rail>div h3,.capability-rail>div:nth-child(3) h3,.capability-rail>div:nth-of-type(3) h3{font-size:12px;letter-spacing:.035em;padding-inline:10px}

/* NAX-SPOORA-CONVERGENTIE10C-20260919: oude laag gaf railiconen padding:13px,
   waardoor het 26px-tekenvlak vrijwel nul werd; padding uit. */
.capability-rail .cap-ring .icon,.capability-rail .cap-ring svg{padding:0;width:26px;height:26px}

/* NAX-SPOORA-CONVERGENTIE10D-20260919: grootboeklabel expliciet op de linker
   leesas (basislaag centreerde de h3 nog). */
.creative-prices article h3{display:block;text-align:left;margin-left:0;padding-left:0;justify-content:flex-start}

/* NAX-SPOORA-SLOTHARMONISATIE11-20260919: slotpunten externe herkeuring
   (Gemini 8,7 / Codex 7,4). Typografische micro-harmonisatie + luminantie. */
.capability-rail>div h3,.capability-rail>div:nth-child(3) h3,.capability-rail>div:nth-of-type(3) h3{font-weight:500;letter-spacing:.08em}
.capability-rail .cap-ring::before{background:radial-gradient(circle,#e7c0782b 0%,transparent 68%)}
.capability-rail::before{opacity:.6}
.services-section .service-item p{color:#f0ead9}
.services-section .service-item::before{box-shadow:0 18px 40px -18px #000c,inset 0 1px 0 #e7c07836}
.pillar-front small{color:#e9e6da}
.creative-prices article p{color:#d7dedd;padding-block:4px}
.pricing-section .price-card .button--line,.creative-prices article>.button{background:rgba(231,192,120,.09);border-color:rgba(231,192,120,.55)}
.process-section .process-grid .step-top .icon{background:none;box-shadow:none;padding:4px;width:28px;height:28px}

/* NAX-SPOORA-VIERBESLUITEN12-20260919: Care-kaarten dragen nu een echt
   Maandbedrag-label (lege spacer weg); alle vier herovakken dragen een
   subregel (spacer-slots weg). */
.pricing-section .price-card:not(.price-card--featured) .price::after{content:none}
.handoff-deck .deck-zone:not(:nth-child(2)) .deck-copy::after{content:none}

/* NAX-SPOORA-SLOT13-20260919: beide externe jury's: WEBSHOP & BETALINGEN
   nadert de tegelranden - alleen die tegel een fractie compacter gezet. */
.capability-rail>div:nth-of-type(3) h3{font-size:11px;letter-spacing:.05em;padding-inline:6px}

/* ===== NAX-BRANDFILMS14 (2026-09-19) — eigenaars-JA integreer: hero-sting (extern 9,35) en vitrine-merkfilm (extern 9,40) als laag 0; per-vak/per-tegel loops vervallen; panel-loop-poorten van motion.js (17s, budget, zichtbaarheid, reduced motion) gelden onverkort. ===== */
.handoff-deck{overflow:hidden}
.handoff-deck>video.deck-sting{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;z-index:0;border-radius:inherit;opacity:0;transition:opacity .9s var(--ease-lux,ease);pointer-events:none}
.handoff-deck.has-video>video.deck-sting{opacity:.94}
.handoff-deck>.deck-zone{position:relative;z-index:1}
.capability-rail{position:relative;overflow:hidden}
.capability-rail>video.rail-brand{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 27.2%;z-index:0;border-radius:inherit;opacity:0;transition:opacity .9s var(--ease-lux,ease);pointer-events:none}
.capability-rail.has-video>video.rail-brand{opacity:.94}
.capability-rail>div{position:relative;z-index:1}
.capability-rail>.cap-sheen{z-index:1}
@media(max-width:760px){.handoff-deck>video.deck-sting,.capability-rail>video.rail-brand{display:none}}

/* ===== NAX-BRANDFILMS15 (2026-09-20) — eigenaarsafkeuring live-integratie: vitrine wordt echte showcase (film draagt het monument vrij in beeld, tegels als glascapsules onderin); deck-sting is puur materiaal (goudader-lichtreis, geen tekst achter tekst). ===== */
@media(min-width:761px){
.capability-rail{min-height:400px;align-items:end}
.capability-rail>video.rail-brand{object-position:50% 36%}
.capability-rail>div{min-height:0;padding:10px 14px;border-radius:999px;background:linear-gradient(160deg,#07151ecc,#03101788);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid #e7c07845;box-shadow:0 8px 22px #0008,inset 0 1px 0 #ffe2a022}
.capability-rail .cap-front{flex-direction:row;align-items:center;justify-content:center;gap:10px;padding:2px 4px;flex:none}
.capability-rail .cap-ring{width:30px;height:30px;flex:none;padding:0}
.capability-rail .cap-front h3{font-size:11px;letter-spacing:.08em;white-space:nowrap;margin:0}
.capability-rail .cap-front .gold-rule{display:none}
}

/* ===== NAX-BRANDFILMS16 (2026-09-20) — live-jurypunten (Codex 8,8/8,3/9,0 + Gemini 8,9/9,1/8,4): capsule-contrast met onderscrim en vollere goudrand; EEN doorlopende deck-scrim i.p.v. vier per-vak 90-graden-verlopen (bron van de segmentatie); pauw ondergeschikt aan het monument; optische marges vak 01/04. ===== */
@media(min-width:761px){
.capability-rail::after{content:'';position:absolute;left:0;right:0;bottom:0;height:132px;background:linear-gradient(180deg,transparent,#020a10c9 78%);z-index:1;pointer-events:none;border-radius:inherit}
.capability-rail>div{z-index:2;background:linear-gradient(160deg,#081722df,#03101ab8);border-color:#e7c07866}
.handoff-deck>.deck-zone::after{background:linear-gradient(180deg,#04101c66,#04101c8f)}
.handoff-deck>.deck-zone,.handoff-deck>.deck-zone[data-service]:not(.has-video){background:none}
.handoff-deck>.deck-zone[data-service=strategie-design]:not(.has-video) .deck-art,.handoff-deck>.deck-zone[data-service=persoonlijke-regie]:not(.has-video) .deck-art{opacity:1}
body[data-page=home] .handoff-deck{background:linear-gradient(180deg,#081826,#04101c 55%,#0a2030)}
.handoff-deck{background:linear-gradient(180deg,#081826,#04101c 55%,#0a2030)}
.handoff-deck>.deck-zone:first-of-type .deck-select{padding-left:30px}
.handoff-deck>.deck-zone:last-of-type .deck-select{padding-right:30px}
.environment-region video[data-hero-loop="peacock"]{filter:brightness(.76) saturate(.82)}
.environment-region video[data-hero-loop="wand-rechts"]{filter:brightness(.9)}
}

/* ===== NAX-BRANDFILMS17 (2026-09-20) — Gemini-r2 kwalitatieve punten: capsulelabels ruimer gekalibreerd; deck-typografie geborgd tegen adertextuur; rechterflank hero verder ondergeschikt aan headline/CTA. ===== */
@media(min-width:761px){
.capability-rail .cap-front h3{font-size:12px;letter-spacing:.1em}
.capability-rail>div{padding:11px 18px}
.handoff-deck .deck-label,.handoff-deck .deck-subtitle,.handoff-deck .deck-index{text-shadow:0 1px 10px #04101ce6,0 0 2px #04101c}
.environment-region video[data-hero-loop="wand-rechts"]{filter:brightness(.82) saturate(.9)}
}

/* ===== NAX-BRANDFILMS18 (2026-09-20) — Codex-r2 wortelfixes: per-vak ::after-scrims (alpha 0,95/0,6/0,7/0,95 uit oudere rondes) waren de deck-breuk; een uniforme scrim met gedocumenteerde !important beslecht die cascade. Capsules: vollere rand + diepere ondergrond. Pauw definitief ondergeschikt. ===== */
@media(min-width:761px){
.handoff-deck>.deck-zone[data-service]::after{background:linear-gradient(90deg,#04101cf2 0 84%,#04101c66)!important}
.capability-rail::after{height:150px;background:linear-gradient(180deg,transparent,#020a10e6 80%)}
.capability-rail>div{border-color:#e7c078a1;box-shadow:0 10px 26px #000a,0 0 0 1px #e7c07836,inset 0 1px 0 #ffe2a028}
.environment-region video[data-hero-loop="peacock"]{filter:brightness(.66) saturate(.72)}
.capability-rail>div{outline:2px solid #e7c078d9;outline-offset:-2px}
.capability-rail>div.gold-border-reveal::before{opacity:0!important}
.handoff-copy h1 em{background-image:linear-gradient(178deg,#fff3d2 10%,#f4d492 52%,#eac67e 82%);filter:brightness(1.15) saturate(1.04);text-shadow:0 0 20px rgba(231,192,120,.3)}
}

/* ===== NAX-DOCX20 — eigenaarsdossier 2026-09-20 ronde 1: liquid glass, film zichtbaar, eigen kleuren ===== */
/* Deck: film weer aanwezig — scrim van 0,95 naar sfeerlaag, tekst op eigen glasplaat, strook ademt hoger. */
@media (min-width:761px){
  body[data-page=home] .handoff-deck{min-height:152px}
  body[data-page=home] .handoff-deck .deck-select{min-height:0;margin:94px 10px 10px;padding:6px 14px;border-radius:11px;background:#04101c85;backdrop-filter:blur(13px) saturate(1.12);border:1px solid #e7c07838;box-shadow:inset 0 1px 0 #ffe9b826,inset 0 0 30px #ffffff05,0 12px 26px #0007}
  body[data-page=home] .handoff-deck>.deck-zone[data-service]::after{background:linear-gradient(180deg,#04101c0f 0 44%,#04101ca6 92%)!important}
  body[data-page=home] .handoff-deck>.deck-sting{filter:brightness(1.34) contrast(1.08) saturate(1.06)}
  body[data-page=home] .handoff-deck .deck-art{display:none}
}
/* Partner-pijlers: chips weg (HTML), blokken als liquid glass met lichtrand en toplicht. */
.service-grid .service-item{position:relative;overflow:hidden;border-radius:22px;border:1px solid #e7c0783b;background:linear-gradient(165deg,#0b1e2c6b,#04101c8f 64%,#071a2870);backdrop-filter:blur(16px) saturate(1.18);box-shadow:inset 0 1px 0 #ffe9b82e,inset 0 0 44px #ffffff07,0 20px 44px #0008}
.service-grid .service-item{display:flex;flex-direction:column;justify-content:center;min-height:270px;padding:42px 28px 38px}
/* r3: het oude binnenpaneel (::before 42%-97%) was precies het 'blok' dat de eigenaar afkeurde; de hele kaart is nu het glas. */
.services-section .service-item::before,.services-section .service-item::after{content:none!important}
.services-section .service-grid .service-item{justify-content:center;min-height:280px;padding:44px 30px 40px}
.services-section .service-grid .service-item h3{margin-top:0;padding-top:0}
.services-section .service-grid .service-item p{margin-top:18px;margin-bottom:0}
.service-grid .service-item>.gold-ring{display:none}
/* CTA onder de pijlers: presence van een maison-knop. */
.service-action .button{padding:17px 34px;letter-spacing:.14em;border:1px solid #ffe9b855;box-shadow:0 0 0 1px #7a562060,0 14px 34px #000a,0 0 34px #e7c07830,inset 0 1px 0 #fff3d24d}
/* Cases: status als glaszegel, naamblok als stille plaquette. */
.case-status{display:inline-flex;align-items:center;gap:8px;padding:8px 18px;border-radius:999px;border:1px solid #e7c07845;background:#04101c7a;backdrop-filter:blur(10px) saturate(1.15);box-shadow:inset 0 1px 0 #ffe9b826,0 8px 20px #0007;letter-spacing:.16em;text-transform:uppercase;font-size:11px;color:#efdcae}
.case-status::before{content:'';width:5px;height:5px;border-radius:50%;background:linear-gradient(140deg,#ffedc1,#d29b52);box-shadow:0 0 8px #e7c078aa}
.case-caption{border-top:1px solid #e7c0782e;background:linear-gradient(180deg,#04101c66,#04101c17);backdrop-filter:blur(8px);border-radius:0 0 16px 16px;padding-top:16px}
.case-caption .case-discipline,.case-caption .case-role{letter-spacing:.05em}
/* Monitor-caption: fluisterend glas in plaats van een systeembalk. */
.transform-section .fineprint{display:inline-flex;align-items:center;gap:9px;padding:10px 22px;border-radius:999px;border:1px solid #e7c07850;background:#04101c78;backdrop-filter:blur(11px) saturate(1.12);box-shadow:inset 0 1px 0 #ffe9b829,0 10px 22px #0007;letter-spacing:.07em;color:#e7e4d8}
/* Vitrine-rail: merk-lockup vult de lege linkerflank — spiegelbeeld van het monument rechts. */
.capability-rail>.rail-lockup{position:absolute!important;inset:auto;left:4.6%;top:42%;transform:translateY(-50%)!important;z-index:1;display:grid;justify-items:start;gap:12px;margin:0;padding:28px 32px;border:1px solid #e7c07833;border-radius:20px;outline:0!important;background:linear-gradient(160deg,#0a1c2a52,#04101c80);backdrop-filter:blur(16px) saturate(1.1);box-shadow:inset 0 1px 0 #ffe9b824,0 16px 36px #0007;pointer-events:none}
.capability-rail>.rail-lockup::before,.capability-rail>.rail-lockup::after{content:none!important}
.rail-lockup .rl-word{font:400 clamp(30px,2.5vw,46px)/1.04 var(--serif);letter-spacing:.3em;background:linear-gradient(178deg,#fff3d2 8%,#f0cd8b 52%,#dcae66 88%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.rail-lockup .rl-word small{display:block;margin-top:9px;font-size:.34em;letter-spacing:.62em;font-weight:400}
.rail-lockup .rl-line{width:74px;height:1px;background:linear-gradient(90deg,#e7c078d9,transparent)}
.rail-lockup em{font:italic 400 19px/1.5 var(--serif);letter-spacing:.05em;color:#f0e9d8;text-shadow:0 1px 3px #000d,0 0 14px #0009;max-width:24ch;white-space:normal}
@media (max-width:760px){.capability-rail>.rail-lockup{display:none!important}}
/* Werkwijze: elke stap zijn eigen edelsteen — goud, saffier, jade, champagne; rondje klaar als toekomstig filmvenster. */
.process-grid>li{--stap:#e7c078;--stapzacht:#e7c07819;position:relative;background:radial-gradient(150% 100% at 16% 0%,var(--stapzacht),transparent 58%)}
.process-grid>li:nth-child(2){--stap:#6fc4f2;--stapzacht:#6fc4f226}
.process-grid>li:nth-child(3){--stap:#8fd8c8;--stapzacht:#8fd8c824}
.process-grid>li:nth-child(4){--stap:#f0b08a;--stapzacht:#f0b08a24}
.process-grid>li::before{content:'';position:absolute;left:0;right:30%;top:0;height:1.5px;background:linear-gradient(90deg,var(--stap),transparent)}
.process-grid>li .step-number{border-color:var(--stap);color:var(--stap);box-shadow:0 0 0 1px #7a56209c,0 6px 16px #000a,0 0 22px var(--stapzacht),inset 0 1px 0 #ffe9b845}
.process-grid>li .step-top .icon{color:var(--stap);filter:drop-shadow(0 0 8px var(--stapzacht))}
.process-grid>li.is-current .step-number{box-shadow:0 0 0 1px var(--stap),0 6px 16px #000a,0 0 30px var(--stapzacht)}
/* Prijzen: chips als geslepen glas. */
.creative-rates .rate-chip{background:linear-gradient(170deg,#0a1c2a80,#04101c96);backdrop-filter:blur(11px) saturate(1.15);border-color:#e7c0784d;box-shadow:inset 0 1px 0 #ffe9b826,0 10px 24px #0006}
.creative-rates .rate-note{font:italic 400 13px/1.6 var(--serif);letter-spacing:.05em;color:#cfd6d6d9}
/* AI-sectie: formele status draagt de sectie-lead, nu met couture-zetting. */
.products-section .section-lead{font:italic 400 clamp(16px,1.25vw,19px)/1.65 var(--serif);letter-spacing:.03em;color:#efe6cf;text-shadow:0 1px 3px #000b}
.products-section .product-grid h3{margin-bottom:10px}
/* Finale-kolommen: korter en rustiger; zegel krijgt halo. */
.contact-grid{align-items:stretch}
.contact-grid .integrations ul li{min-height:0;padding:10px 12px}
.contact-grid .faq details summary{padding-top:12px;padding-bottom:12px}
.contact-grid .faq .faq-signature{margin-top:14px;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:18px;text-align:left}
.contact-grid .faq .faq-signature .faq-seal{margin-bottom:0;flex:none}
.contact-grid .faq .faq-signature p{margin:0}
.contact-grid .faq .faq-signature>.gold-rule{display:none}
.contact-grid .webcheck textarea{min-height:84px}
.contact-grid .integrations ul{row-gap:10px}
.faq-seal{box-shadow:0 0 0 1px #7a56209c,0 0 0 7px #04101a55,0 8px 22px #000b,inset 0 1px 0 #ffe9b845,0 0 38px #e7c0783d}
.faq-seal .emblem{width:60px;filter:drop-shadow(0 0 12px #e7c07877)}
/* Footer: signatuurregel in coutureletter, iconen met gouden lichtrand. */
.lux-footer-brand p{font:italic 400 16.5px/1.65 var(--serif);letter-spacing:.045em;color:#f0e9d8;-webkit-text-fill-color:#f0e9d8;text-shadow:0 1px 3px #000d,0 2px 14px #000b;background:radial-gradient(130% 150% at 0% 50%,#04101cb8,#04101c00 74%);border-radius:12px;padding:8px 14px 8px 0}
.lux-footer-grid .f-ic{border:1px solid #e7c07852;box-shadow:inset 0 1px 0 #ffe9b826,0 0 16px #e7c0781f}
/* r5 — jurypunten Gemini: leesbaarder partnertekst, levende hover, fijnere deck-haarrand; mobiel strakker. */
.services-section .service-grid .service-item p{color:#efe8d9}
.service-grid .service-item{transition:transform .3s cubic-bezier(.23,1,.32,1),box-shadow .3s cubic-bezier(.23,1,.32,1)}
.service-grid .service-item:hover{transform:translateY(-3px);box-shadow:inset 0 1px 0 #ffe9b83a,inset 0 0 44px #ffffff09,0 26px 52px #0009,0 0 46px #e7c07822}
@media (min-width:761px){body[data-page=home] .handoff-deck{border-color:#e7c07840;box-shadow:0 18px 35px #0009,inset 0 1px 0 #ffe2a028}}
@media (max-width:760px){.services-section .service-grid .service-item{min-height:0;padding:38px 24px 34px}}
/* r6 — Codex-punten: brede slottegel in het AI-grid. */
.products-section .product-grid>article:last-child{grid-column:1/-1}
/* r8 — eigenaarsronde 2 (foto 1-5). */
/* (foto 4/5) WORTEL: cinematic.css zet de rail op desktop absoluut op left:44%/right:6% (oud smal
   rechterpaneel). De showcase-capsules hebben ~1000px minimum, dus de rail barstte uit dat vak en
   uit de viewport — de eigenaar zag hem afgesneden. Elementcaptures verborgen dit (meetles!).
   Nu: gewone volle strook in de flow, capsules mogen krimpen. */
@media (min-width:761px){
  .possibilities-section .capability-rail{position:relative;left:auto;right:auto;bottom:auto;top:auto;margin:48px 0 0;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;padding:0 16px 16px}
  .capability-rail>.rail-lockup{padding:22px 26px}
}
/* (foto 2) partner-kaarten: blur weg, glas bijna transparant met donkere kerngloed achter de tekst —
   de watervalfilm is weer zichtbaar door en naast de kaarten. */
.services-section .service-grid .service-item{backdrop-filter:none;background:radial-gradient(85% 72% at 50% 56%,#04101c8f,#04101c38 68%,#04101c1c)}
.services-section .service-grid .service-item h3{text-shadow:0 1px 2px #000,0 2px 16px #000d,0 0 34px #000b}
.services-section .service-grid .service-item p{text-shadow:0 1px 3px #000,0 2px 12px #000d}
/* (foto 3) beweging-pauzeknop: visueel weg op eigenaarsbesluit; blijft voor toetsenbord/AT bereikbaar
   (WCAG-pauzemechanisme) en verschijnt alleen bij focus. */
.motion-toggle{opacity:0;pointer-events:none;transition:opacity .2s ease}
.motion-toggle:focus-visible{opacity:1;pointer-events:auto}
/* r9 — decoratielagen (lux-arc, nx-grain, oversized scenes) rekten het document horizontaal op;
   clip op documentniveau: geen scrollbalk, geen verschuiving, decoratie blijft randloos doorlopen. */
html{overflow-x:clip}
.lux-footer-frame{overflow:hidden}
/* r10 — (foto 5) de drie vakmanschap-bijschriften overlapten: kolommen krijgen gelijke flexruimte
   en de regels mogen wikkelen binnen hun eigen kolom. */
div:has(>div>video[data-panel-loop^="pillar-"]){display:flex;gap:24px;align-items:stretch}
div:has(>video[data-panel-loop^="pillar-"]){flex:1 1 0;min-width:0}
.pillar-front>span{display:block;min-width:0}
.pillar-front small{display:block;white-space:normal}
/* r10 — fundament voor de vier eigenaars-deckclips (JA_GENEREER_OPENART deck-clips): film per vak
   als laag 0, glasplaat onderin blijft de tekstdrager; mobiel bewust uit. */
body[data-page=home] .handoff-deck{overflow:hidden}
.handoff-deck .deck-zone>video.deck-live{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 46%;z-index:0;opacity:0;transition:opacity .9s ease}
.handoff-deck .deck-zone>video.deck-live.is-playing,.handoff-deck .deck-zone.has-video>video.deck-live{opacity:1}
@media (max-width:760px){.handoff-deck .deck-zone>video.deck-live{display:none}}
/* r12 — eigenaars-laptopbreedte: de vakmanschap/vitrine-zone voelde te groot; kop en strook
   schalen mee en de filmcrop zakt iets zodat het veer-stilleven onderin weer zichtbaar is. */
@media (min-width:761px) and (max-width:1600px){
  .possibilities-section .section-heading h2{font-size:clamp(30px,3.2vw,46px)}
  .possibilities-section .section-heading p,.possibilities-section .section-lead{font-size:15px}
  .possibilities-section .capability-rail{min-height:296px;margin-top:32px}
  .capability-rail>video.rail-brand{object-position:50% 42%}
  .capability-rail>.rail-lockup{padding:18px 22px;gap:9px}
  .rail-lockup .rl-word{font-size:30px}
  .rail-lockup em{font-size:13px}
  .capability-rail::after{height:110px}
}
/* r13 — de pauw op de marmeren rand bij de waterval zit RECHTS in de possibilities-scene;
   sinds de sectie hoger is snijdt cover-crop die flank weg. Rechts verankeren: de pauw blijft
   in beeld, links verdwijnt alleen donker interieur (achter de sectiecopy). */
.possibilities-section .scene img,.possibilities-section video.scene-loop{object-position:84% 50%}
/* r14 — eigenaarsronde 3: de kunst is de held (doel 9,4 van team + Gemini). */
@media (min-width:761px){
  /* deck: films helder, 4K-gevoel; het lint draagt de tekst, de scene ademt erboven */
  .handoff-deck .deck-zone>video.deck-live{filter:brightness(1.18) contrast(1.06) saturate(1.14)}
  /* vitrine: film lichter en voller van kleur; boven 1600px iets compacter dan 400 */
  .possibilities-section .capability-rail{min-height:300px}
  .capability-rail>video.rail-brand{filter:brightness(1.06) contrast(1.05) saturate(1.1)}
  .rail-lockup .rl-word{font-size:clamp(28px,2.2vw,42px)}
}
@media (min-width:761px) and (max-width:1600px){
  .possibilities-section .capability-rail{min-height:248px}
}
/* werkwijze: elk van de vier stappen draagt zijn eigen deck-kunstwerk als cinematisch paneel */
.process-grid>li{isolation:isolate;overflow:hidden;border-radius:18px}
.process-grid>li>video.step-live{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 44%;z-index:0;opacity:0;transition:opacity .9s ease;filter:brightness(1.12) saturate(1.1)}
.process-grid>li.has-video>video.step-live{opacity:1}
.process-grid>li::after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,#04101c1f 0 30%,#04101cbd 60%,#04101ce3);pointer-events:none}
.process-grid>li::before{z-index:2}
.process-grid>li .step-top,.process-grid>li h3,.process-grid>li p,.process-grid>li .step-number{position:relative;z-index:2}
.process-grid>li h3{text-shadow:0 1px 3px #000c,0 2px 14px #000a}
.process-grid>li p{text-shadow:0 1px 3px #000c}
@media (max-width:760px){.process-grid>li>video.step-live{display:none}}
/* websitecheck-kolom: even beknopt als zijn buren */
.contact-grid .webcheck .field{margin-bottom:10px}
.contact-grid .webcheck .field label{font-size:10.5px;letter-spacing:.1em;margin-bottom:4px}
.contact-grid .webcheck .field input{padding:9px 12px}
.contact-grid .webcheck textarea{min-height:52px}
.contact-grid .webcheck .website-choice{margin-bottom:10px}
.contact-grid .webcheck form p,.contact-grid .webcheck>p{margin:8px 0;font-size:12.5px;line-height:1.5}
/* r15 — websitecheck-kolom in balans met zijn buren. */
.contact-grid .webcheck .eyebrow{margin-bottom:4px}
.contact-grid .webcheck h3{margin-bottom:6px}
.contact-grid .webcheck .gold-rule{margin:6px 0 10px}
.contact-grid .webcheck .field{margin-bottom:8px}
.contact-grid .webcheck .field input{padding:8px 11px;font-size:14px}
.contact-grid .webcheck textarea{min-height:44px}
.contact-grid .webcheck .website-choice{margin-bottom:8px}
.contact-grid .webcheck form .button{padding:12px 24px;margin-top:6px}
.contact-grid .webcheck form p,.contact-grid .webcheck>p{margin:6px 0;font-size:12px;line-height:1.45}
/* r16 — meting wees de ruimtevreters aan: spookmarge van de lege foutcontainer, dubbele
   niet-verzenden-notitie (fineprint blijft de drager), hoge textarea en keuzerij. */
.contact-grid .webcheck .form-errors[hidden]{display:none;margin:0}
.contact-grid .webcheck .demo-notice{display:none}
.contact-grid .webcheck textarea{min-height:36px}
.contact-grid .webcheck .website-choice{padding:6px 10px;margin-bottom:8px}
.contact-grid .webcheck .form-progress{font-size:11px;margin:4px 0 2px}
.contact-grid .webcheck{padding:22px 20px}
/* r17 — Gemini-rond3-punten letterlijk gebouwd. */
body[data-page=home] .handoff-deck .deck-subtitle{color:rgba(255,255,255,.85);font-size:10px;letter-spacing:.02em;white-space:nowrap}
.capability-rail>.rail-lockup{padding-top:26px;padding-bottom:26px}
.process-grid>li .step-top{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.contact-grid .integrations,.contact-grid .faq,.contact-grid .webcheck{display:flex;flex-direction:column}
.contact-grid .integrations>ul{flex:0 0 auto}
.contact-grid .faq .faq-signature{margin-top:18px;padding-top:0}
/* r18 — Gemini-herkeuringspunten: lucht onder de lockup, WCAG-randen en placeholders. */
.capability-rail>.rail-lockup{top:40%}
@media (min-width:761px){.capability-rail{padding-bottom:20px}}
.contact-grid .webcheck .field input,.contact-grid .webcheck textarea{border-color:rgba(255,255,255,.28)}
.contact-grid .webcheck .field input::placeholder,.contact-grid .webcheck textarea::placeholder{color:#a7b6bd}
/* r20 — ronde 4: lagere lijsten, de omgeving ademt weer om de kunst heen. */
@media (min-width:761px){
  .capability-rail>.rail-lockup{padding:16px 20px;gap:7px}
  .rail-lockup em{font-size:12px}
  .rail-lockup .rl-word small{margin-top:6px}
  .capability-rail::after{height:90px}
  /* werkwijze: panelen ~60% van de vorige hoogte; film blijft venster boven de tekst */
  .process-grid>li{padding:16px 18px 14px;min-height:0}
  .process-grid>li h3{font-size:15px;letter-spacing:.09em;margin:10px 0 6px}
  .process-grid>li p{font-size:13.5px;line-height:1.5;margin:0}
  .process-grid>li .step-top{margin-bottom:6px}
  .process-grid>li .step-number{width:40px;height:40px;font-size:15px}
}
/* r21 — Gemini-latpunten ronde 4. */
@media (min-width:761px){
  /* (1) geen mini-lobby in de vitrine: het venster zoomt in op het monument als eigen hoofdstuk */
  
  /* (2) een gouden leider per beeld: de sectie-CTA van de werkwijze wordt een couture-ghost */
  .process-copy .button{background:transparent;color:#eecd87;border:1px solid #e7c07870;box-shadow:inset 0 1px 0 #ffe9b81f;text-shadow:0 1px 2px #000a}
  .process-copy .button:hover{background:#e7c0781a;border-color:#eecd87}
  .process-copy .button .icon{color:#eecd87}
}
/* r22 — Codex-punten: kunst vrij boven het lint, uniforme tekstplaat, geen holle kolommen. */
@media (min-width:761px){
  /* (1) per vak het onderwerp in het vrije venster */
  .handoff-deck .deck-zone[data-service="maatwerk"]>video.deck-live{object-position:50% 6%}
  .handoff-deck .deck-zone[data-service="strategie-design"]>video.deck-live{object-position:50% 15%}
  .handoff-deck .deck-zone[data-service="technisch-beheer"]>video.deck-live{object-position:50% 8%}
  .handoff-deck .deck-zone[data-service="persoonlijke-regie"]>video.deck-live{object-position:50% 36%}
  /* (3) werkwijze: inhoud op een vaste as onderin, uniforme plaat, kunst in het bovendeel */
  .process-grid>li{display:flex;flex-direction:column;justify-content:flex-end;min-height:192px}
  .process-grid>li::after{background:linear-gradient(180deg,#04101c0f 0 38%,#04101cd4 50%,#04101cf2 100%)}
  .process-grid>li .step-top{position:absolute;top:14px;left:16px;margin:0}
  .process-grid>li h3{margin:0 0 5px}
}
/* r25 — vitrine-kabinet: staand filmpaneel rechts toont het monument volledig (cover op een
   staand kader = volledige hoogte); links ademend nachtmarmer met de merk-lockup. */
@media (min-width:761px){
  .capability-rail{background:linear-gradient(115deg,#0a1c2c,#04101c 52%,#081b2a)}
  .capability-rail>video.rail-brand{inset:0 0 0 auto;left:auto;width:62%;object-position:62% 40%;transform:none;border-radius:0}
  .capability-rail>video.rail-brand{mask-image:linear-gradient(90deg,transparent,#000 12%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%)}
  .capability-rail>.rail-lockup{left:6%;top:38%}
}
/* r27 — Gemini-slotpunten vitrine: lockup zonder kader (naadloos in het marmer), capsules met
   24px lucht van de onderrand. */
@media (min-width:761px){
  .capability-rail>.rail-lockup{border:0;background:radial-gradient(120% 130% at 30% 40%,#04101c66,#04101c00 75%);box-shadow:none}
  .capability-rail{padding-bottom:24px}
}
/* r28 — dubbeljury-slotbouw. */
@media (min-width:761px){
  /* deck: nummer+titel+subtitel op een regel; het kunstvenster groeit binnen dezelfde 152px */
  body[data-page=home] .handoff-deck .deck-copy{display:flex;align-items:baseline;gap:9px;min-width:0}
  body[data-page=home] .handoff-deck .deck-subtitle{overflow:hidden;text-overflow:ellipsis;margin-left:2px}
  body[data-page=home] .handoff-deck .deck-label{flex:none}
  /* werkwijze: titel gegarandeerd op de plaat */
  .process-grid>li h3{margin:0 0 4px}
  .process-grid>li p{font-size:13px;line-height:1.45}
  /* contact: naam en e-mail naast elkaar -> korter formulier */
  .contact-grid .webcheck form{display:grid;grid-template-columns:1fr 1fr;column-gap:10px}
  .contact-grid .webcheck form>*{grid-column:1/-1;min-width:0}
  .contact-grid .webcheck form>div:nth-of-type(4){grid-column:1/2}
  .contact-grid .webcheck form>div:nth-of-type(5){grid-column:2/3}
}
/* zegel-CTA: stille verkoper, nooit een tekstverpletteraar */
.seal-cta{padding:10px 18px;font-size:10.5px;background:#04101cd6;backdrop-filter:blur(9px) saturate(1.1);-webkit-backdrop-filter:blur(9px) saturate(1.1)}
/* r29 — Gemini-slotpunt: veilige zone zodat de zegel-CTA nooit brancheknoppen afdekt. */
@media (min-width:1200px){.industry-tabs{padding-right:172px}}
/* r30 — Codex-slotpunten. */
@media (min-width:761px){
  /* deck: nummer+titel+subtitel afgedwongen op EEN regel (basisgrid overstemd) */
  body[data-page=home] .handoff-deck .deck-select .deck-copy{display:flex!important;flex-direction:row;align-items:baseline;gap:9px;min-width:0;white-space:nowrap}
  body[data-page=home] .handoff-deck .deck-select .deck-index{flex:none}
  body[data-page=home] .handoff-deck .deck-select .deck-label{flex:none}
  body[data-page=home] .handoff-deck .deck-select .deck-subtitle{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis}
  /* werkwijze: tekst in een massieve nachtblauwe rij onder het mediavlak, zonder overlap */
  .process-grid>li{padding:0}
  .process-grid>li h3{background:#04101c;margin:0;padding:12px 18px 4px;position:relative;z-index:2;text-shadow:none}
  .process-grid>li p{background:#04101c;margin:0;padding:0 18px 14px;position:relative;z-index:2;text-shadow:none}
  .process-grid>li::after{background:linear-gradient(180deg,#04101c00 0 62%,#04101c66 86%,#04101c 100%)}
  /* contact: koppen, goudlijnen en inhoudsstart op een as */
  .contact-grid>*>.eyebrow{min-height:17px;margin-bottom:6px}
  .contact-grid>*>h2,.contact-grid>*>h3{min-height:66px;display:flex;align-items:flex-start;margin:0 0 4px}
  .contact-grid>* .gold-rule{margin:4px 0 16px}
}
/* r31 — platen vol doorlopend; subtitel zonder afkap. */
@media (min-width:761px){
  .process-grid>li h3,.process-grid>li p{width:100%;max-width:none;box-sizing:border-box}
}
/* r32 — deck-lint: alleen nummer+titel (een regel zonder ooit af te kappen); subtitels leven
   op de dienstenpagina. Maximaal kunstvenster. */
@media (min-width:761px){body[data-page=home] .handoff-deck .deck-subtitle{display:none}}
/* r33 — Codex-finishpunten. */
@media (min-width:761px){
  /* deck: icoon, nummer en titel exact op een as */
  body[data-page=home] .handoff-deck .deck-select{align-items:center;gap:14px}
  body[data-page=home] .handoff-deck .deck-select .deck-copy{align-items:center}
  body[data-page=home] .handoff-deck .deck-select .deck-index{transform:none;margin:0}
  /* werkwijze: EEN vol-breed onderpaneel (stretch afgedwongen tegen basis-centrering) */
  .process-grid>li{align-items:stretch!important}
  .process-grid>li h3{width:auto;align-self:stretch;padding:12px 18px 2px;border-radius:0}
  .process-grid>li p{width:auto;align-self:stretch;padding:2px 18px 14px;border-radius:0}
  /* contact: rechterkolom in hetzelfde verticale ritme */
  .contact-grid .webcheck>p{margin:0 0 10px}
  .contact-grid .webcheck .website-choice{margin-top:0}
}
/* r34 — de basiskaart hield padding vast (sterkere selector): nu wint het onderpaneel echt.
   Plaat loopt van rand tot rand; badge behoudt zijn eigen inzet. */
@media (min-width:761px){
  .process-section .process-grid>li{padding:0!important}
  .process-section .process-grid>li h3{width:100%;max-width:none;margin:0;padding:12px 20px 2px;background:#04101c}
  .process-section .process-grid>li p{width:100%;max-width:none;margin:0;padding:2px 20px 15px;background:#04101c}
  .process-section .process-grid>li .step-top{top:16px;left:18px}
}
/* r35 — Codex ronde-6-punten. */
@media (min-width:761px){
  .capability-rail>.rail-lockup{padding:24px 30px;gap:11px;left:5.4%;top:40%}
  .rail-lockup .rl-line{width:92px}
  .process-grid>li p{font-size:14.5px;line-height:1.5;min-height:44px}
  .process-copy .button{background:#04101cd9;backdrop-filter:blur(8px)}
  .contact-grid>.glass-panel,.contact-grid .webcheck{padding-top:26px}
  .contact-grid .webcheck .eyebrow,.contact-grid>.glass-panel .eyebrow{margin-top:0}
}
/* r36 — Codex ronde-7, pixel-exact. */
@media (min-width:761px){
  .capability-rail>.rail-lockup{justify-items:start}
  .rail-lockup em{margin:0}
  .process-section .process-grid>li p{font-size:15.5px!important;line-height:1.55!important}
  /* contactkoppen wiskundig op een as: eyebrow 17+6, titel 66+28, rule op exact dezelfde y */
  .contact-grid>*>.eyebrow{margin:0 0 6px!important;min-height:17px}
  .contact-grid>*>h2,.contact-grid>*>h3{margin:0 0 28px!important}
  .contact-grid>* .gold-rule{margin:0 0 16px!important}
}
/* r37 — Codex ronde-8. */
@media (min-width:761px){
  /* deck vak 1/3: media werkelijk geschaald; nachtblauwe ruimte onder het onderwerp */
  .handoff-deck .deck-zone[data-service="maatwerk"]>video.deck-live{object-position:50% 8%}
  .handoff-deck .deck-zone[data-service="technisch-beheer"]>video.deck-live{object-position:50% 10%}
  /* rail: tagline exact op de linkerrand (italic-bearing gecorrigeerd) en groter */
  .rail-lockup em{margin-left:-8px;font-size:20px}
  /* werkwijze: identieke tekstrijhoogte in alle vier panelen -> mediagrens op een lijn */
  .process-section .process-grid>li h3{font-size:15px;padding:12px 20px 2px}
  .process-section .process-grid>li p{min-height:54px}
  /* integraties: Meta en Mailchimp licht monochroom, gelijk aan de rest */
  .contact-grid .mark-meta img,.contact-grid .mark-mailchimp img{filter:brightness(0) invert(.88)}
}
/* r38 — vaste rijgeometrie werkwijze: mediagrens exact gelijk in alle vier panelen. */
@media (min-width:761px){
  .process-section .process-grid>li{display:grid!important;grid-template-rows:minmax(0,1fr) 34px 60px;align-items:stretch}
  .process-section .process-grid>li h3{height:34px;box-sizing:border-box;padding:10px 20px 0;margin:0;display:flex;align-items:center;font-size:15px}
  .process-section .process-grid>li p{height:60px;box-sizing:border-box;padding:2px 20px 0;margin:0;overflow:hidden;min-height:0}
  .process-section .process-grid>li>video.step-live{grid-row:1/2;position:absolute}
  .process-section .process-grid>li .step-top{grid-row:1/2}
}
/* r39 — Codex ronde-9: galerij-passe-partout, tagline-as, compactere kopzone. */
@media (min-width:761px){
  /* alle vier deck-media identiek ingelijst: zelfde inset, nachtblauwe omlijsting */
  .handoff-deck .deck-zone>video.deck-live{transform:scale(.8)!important;transform-origin:50% 6%}
  /* contact: kopzone korter; kaders schalen gelijk mee */
  .contact-grid>*>h2,.contact-grid>*>h3{min-height:68px;margin:0 0 18px!important}
  .contact-grid>* .gold-rule{margin:0 0 14px!important}
}
/* r40 — gridrijen expliciet (absolute kinderen doen niet mee in de flow). */
@media (min-width:761px){
  .process-section .process-grid>li h3{grid-row:2/3}
  .process-section .process-grid>li p{grid-row:3/4;height:auto;min-height:0;padding-bottom:12px}
}
/* r43 — slotronde: zichtbare donkere strook onder onderwerp 1/3; kompas volledig met lucht;
   formulier verticaal strakker. */
@media (min-width:761px){
  
  
  .process-section .process-grid>li>video.step-live{transform:scale(.84);transform-origin:50% 8%}
  .contact-grid .webcheck .field{margin-bottom:6px}
  .contact-grid .webcheck .website-choice{margin-bottom:6px}
  .contact-grid .webcheck form .button{margin-top:4px;padding:11px 22px}
}
/* r44 — uniformiteitsronde + intro/checkbox strak. */
@media (min-width:761px){
  .contact-grid .webcheck>p{margin:0 0 6px}
  .contact-grid .webcheck .website-choice{margin-top:0;margin-bottom:5px;padding:4px 10px}
}
/* ===== einde NAX-DOCX20 ===== */

/* NAX-GLASLIJN21-20260920 — eigenaarslijn "helder glas": breking 0 · frost 0 · tint ~0 (proef prototypes/liquid-glass-shader-20260920).
   De film is de held: glas = lichtrand + glans + zweefschaduw, geen vervaging en geen donkere plaat.
   Alleen materiaal (vulling, rand, schaduw, tekstgloed); geen DOM gewijzigd. Enige maatwijziging: 34px lucht boven de finale-eyebrow.
   Dichte kleine tekst houdt een leesvlak. Terugdraaien = dit hele blok verwijderen. */
:root{
  --glas-sat:saturate(1.28);
  --glas-sheen:linear-gradient(180deg,#ffffff14 0%,#ffffff06 24%,#ffffff00 46%);
  --glas-bezel:inset 14px 14px 30px -18px #fff0c98c,inset -10px -10px 24px -18px #fff0c942,inset -14px -16px 30px -20px #00000070;
  --glas-rim:inset 1px 1px 0 #fff6dc8c,inset -1px -1px 0 #fff0c93d,inset 0 0 0 1px #f1c7793d,var(--glas-bezel);
  --glas-float:0 18px 46px -12px #000000a6,0 4px 12px -4px #00000080;
  --glas-float-klein:0 10px 24px -10px #000000a6;
  --glas-halo:0 1px 2px #000000e0,0 0 3px #000000a6,0 0 18px #000000b3;
  --glas-halo-filter:drop-shadow(0 1px 1.5px #000000d9) drop-shadow(0 0 10px #00000099);   /* voor tekst met background-clip:text: text-shadow maakt die letters donker */
  --glas-tint:#04101c14;          /* grote ruiten: vrijwel helder */
  --glas-tint-klein:#04101c52;    /* pillen met 16px-tekst: licht leesvlak */
  --glas-tint-dicht:#04101cb8;    /* linten en capsules met 10–11px-tekst: rustig leesvlak, rand en glans blijven glas */
  --finale-brand-h:221px;
}

/* ---- grote ruiten boven film ---- */
html body .handoff-deck,
html body .capability-rail,
html body ol.process-grid,
html body .creative-rates,
html body .agenda-demo{
  background:var(--glas-sheen),var(--glas-tint)!important;
  -webkit-backdrop-filter:var(--glas-sat)!important;backdrop-filter:var(--glas-sat)!important;
  border-color:#f1c77947!important;
}
html body .handoff-deck,
html body .capability-rail,
html body ol.process-grid,
html body .creative-rates{box-shadow:var(--glas-rim),var(--glas-float)!important}
/* de agendakaart draagt al een gouden ringlaag (::before): alleen bezel + zweefschaduw, geen dubbele haarlijn */
html body .agenda-demo{box-shadow:var(--glas-bezel),var(--glas-float)!important}

/* ---- pillen, linten, capsules: geen eigen backdrop (niet stapelen), licht leesvlak ---- */
html body .deck-select,
html body .capability-rail>div.hover-lift:not(.rail-lockup),
html body .rate-chip,
html body [data-section="05-transformatie"] p.fineprint,
html body .agenda-demo .industry-tabs{
  background:var(--glas-sheen),var(--glas-tint-klein)!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  box-shadow:var(--glas-rim),var(--glas-float-klein)!important;
}
html body .deck-select,
html body .capability-rail>div.hover-lift:not(.rail-lockup){background:var(--glas-sheen),var(--glas-tint-dicht)!important}
/* prijspillen: gouden cijfers hebben een rustiger ondergrond nodig dan witte labels */
html body .rate-chip{background:var(--glas-sheen),#04101ca8!important}
/* home: de losse leesvlakjes in de capsules vervallen, de capsule zelf is het leesvlak.
   Op /diensten dragen de capsules microfilms; daar blijven de leesvlakjes staan. */
html body[data-page="home"] .capability-rail .cap-front::before,
html body[data-page="home"] .capability-rail .cap-front::after{background:none!important}

/* ---- capability-rail: fluisterglas en ondervignet lichter, geen vervaging ---- */
html body .rail-lockup{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:radial-gradient(120% 130% at 30% 40%,#04101c5c,#04101c00 75%)!important}
html body .capability-rail::after{background:linear-gradient(#02101000,#020a1073 80%)!important}

/* ---- werkwijze: lokaal leesvlak onder de staptekst in plaats van een dichte plaat ---- */
html body ol.process-grid>li::after{background:linear-gradient(#04101c00 0,#04101c00 42%,#04101c9e 66%,#04101cb8 100%)!important}
html body ol.process-grid>li h3,
html body ol.process-grid>li p{background:transparent!important}

/* ---- agenda: schil helder, het bedieningsvlak zelf blijft een rustig leesvlak (8–12px tekst) ---- */
html body .agenda-demo{background:linear-gradient(0deg,#04101c99 0,#04101c00 20%),var(--glas-sheen),var(--glas-tint)!important}
html body .agenda-demo .agenda-stage{background:linear-gradient(125deg,#0b1c1feb,#020a0de6 55%,#041217eb)!important}
html body .booking-tools.glass-panel{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}

/* ---- investering: het Creative-prijspaneel boven de film. Veel kleine tekst, dus halfhelder: film zichtbaar, tekst rustig ---- */
html body .creative-prices.glass-panel{
  background:var(--glas-sheen),#04101c70!important;
  -webkit-backdrop-filter:var(--glas-sat)!important;backdrop-filter:var(--glas-sat)!important;
  box-shadow:var(--glas-rim),var(--glas-float)!important;border-color:#f1c77947!important;
  text-shadow:var(--glas-halo);
}
html body .creative-prices.glass-panel .button{text-shadow:none}

/* ---- cases-bijschrift en zwevende CTA: vervaging weg (ook lichter voor de videokaart) ---- */
html body .case-caption,
html body .seal-cta{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}

/* ---- finale: glazen plaquette onder het vrije monument; de donkere sluier mag lichter ---- */
html body .finale .container.centered::before{opacity:.5}
html body .finale .container.centered::after{
  content:'';position:absolute;z-index:-1;pointer-events:none;
  left:50%;top:calc(var(--finale-brand-h) + 12px);bottom:-32px;width:min(720px,100%);transform:translateX(-50%);
  border-radius:14px;
  background:var(--glas-sheen),radial-gradient(90% 82% at 50% 54%,#02101647,#02101600 80%);
  -webkit-backdrop-filter:var(--glas-sat);backdrop-filter:var(--glas-sat);
  box-shadow:var(--glas-rim),var(--glas-float);
}
html body .finale .container.centered>p:not(.eyebrow){background:none!important}
html body .finale .container.centered>.eyebrow{margin-top:34px}

/* ---- tekstgloed waar tekst nu rechtstreeks op film staat ---- */
html body .deck-select .deck-copy,
html body .capability-rail .cap-front,
html body .rail-lockup,
html body ol.process-grid>li h3,
html body ol.process-grid>li p,
html body .creative-rates .rate-note,
html body .creative-rates .text-link,
html body .rate-chip,
html body [data-section="05-transformatie"] p.fineprint,
html body .case-caption,
html body .agenda-demo .demo-title,
html body .agenda-demo>.fineprint,
html body .agenda-demo>.demo-notice,
html body .agenda-demo>.text-link,
html body .booking-tools.glass-panel,
html body .finale .container.centered>.eyebrow,
html body .finale .container.centered>h2,
html body .finale .container.centered>p:not(.eyebrow){text-shadow:var(--glas-halo)}

html body .rail-lockup .rl-word,
html body .rail-lockup .rl-word small,
html body .rate-chip strong,
html body .creative-prices.glass-panel strong,
html body .finale .container.centered>h2 em{text-shadow:none!important;filter:var(--glas-halo-filter)}

/* ---- telefoon: kleinere tekst op kleiner scherm krijgt iets meer leesvlak ---- */
@media (max-width:760px){
  :root{--glas-tint:#04101c4d;--glas-tint-klein:#04101c7a;--finale-brand-h:169px}
}

/* ---- vangnet: wie minder transparantie vraagt, krijgt dekkende panelen terug ---- */
@media (prefers-reduced-transparency:reduce){
  html body .handoff-deck,html body .capability-rail,html body ol.process-grid,html body .creative-rates,html body .agenda-demo{background:#04101cf2!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  html body .agenda-demo{background:#04101cf2!important}
  html body .deck-select,html body .capability-rail>div.hover-lift:not(.rail-lockup),html body .rate-chip,html body [data-section="05-transformatie"] p.fineprint,html body .agenda-demo .industry-tabs{background:#04101ce6!important}
  html body .creative-prices.glass-panel{background:#04101cf2!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  html body .finale .container.centered::after{background:#04101cd9;-webkit-backdrop-filter:none;backdrop-filter:none}
}
/* einde NAX-GLASLIJN21-20260920 */

/* NAX-RAILTELEFOON22-20260920 — telefoon (≤760px): mogelijkheden-rail terug in de flow en weer veegbaar.
   WORTEL (gemeten, qa-artifacts/railknop-20260920): cinematic.css zet de rail op desktop absoluut
   (left:44%;right:6%;bottom:15%) en schakelt dat onder 1100px uit met position:static. De brandfilm-laag
   zet later onvoorwaardelijk .capability-rail{position:relative;overflow:hidden}. Gevolg op telefoon:
   (1) de desktop-offsets werden relatief weer actief: 44% van 350px = 154px naar rechts, rail tot x=524 in
       een viewport van 390 (r8 herstelde dit alleen vanaf 761px). html{overflow-x:clip} verborg de
       scrollbalk, maar focus/scrollIntoView kon de hele pagina alsnog 133px opzij schuiven;
   (2) overflow:hidden won van de scroll-snapstrook (laag F, overflow-x:auto): vier van de vijf kaarten
       waren met vegen onbereikbaar.
   scroll-padding laat de eerste/laatste kaart op de 16px binnenmarge van het glas rusten.
   Desktop en tablet (≥761px) blijven ongemoeid. */
@media (max-width:760px){
  .capability-rail{left:auto;right:auto;top:auto;bottom:auto;overflow-x:auto;overflow-y:hidden;scroll-padding-inline:16px}
}
/* einde NAX-RAILTELEFOON22-20260920 */

/* NAX-EINDREVIEW-R1-20260920 — observed headings, readable labels, visible keyboard focus. */
.motion-enabled .kinetic.k-armed:not(.k-go) .ki{opacity:0;transform:translateY(.38em)}
.contact-grid>*>h2.kinetic,.contact-grid>*>h3.kinetic{display:block}
.seal-cta:focus-visible{opacity:1;translate:0 0;pointer-events:auto;transition:none}
.not-found .container>.button{margin:8px 16px 8px 0}
html body :is(.desktop-nav a,.mobile-nav a,.button,.deck-label,.eyebrow,.capability-rail h3,.cr-button,.cr-eyebrow,.px-eyebrow,.px-button){font-size:12px!important;letter-spacing:.14em!important}
html body .handoff-copy .button{font-size:12px;letter-spacing:.14em}
@media print{
 html,body,main,section,.container,.price-card,.configurator{background:#fff!important;color:#111!important}
 body *{color:#111!important;text-shadow:none!important;box-shadow:none!important;backdrop-filter:none!important}
 video,.scene,.handoff-plate,.nx-grain,.nx-ambient,.seal-cta,.site-header,.brand-intro,.scroll-cue{display:none!important}
 h1,h2,h3,p,li,a,.kinetic .ki{opacity:1!important;transform:none!important}
 .price-card,article{break-inside:avoid}a{text-decoration:underline}
}

/* NAX-EINDREVIEW-R1-RESPONSIVE-20260920 — shared menu boundary and rail labels without clipping. */
@media(max-width:1100px){html body .site-header .desktop-nav{display:none!important}html body .site-header .menu-toggle:not([hidden]){display:inline-flex!important}}
@media(min-width:761px){body[data-page=home] .handoff-deck .deck-select .deck-copy{flex-direction:column;align-items:flex-start;white-space:normal;gap:4px}body[data-page=home] .handoff-deck .deck-select .deck-label{flex:0 1 auto;max-width:100%;white-space:normal;overflow-wrap:normal}body[data-page=home] .handoff-deck .deck-select{min-height:92px}}

/* NAX-EINDREVIEW-R3-20260920 — readable form, direct entry and design viewer. */
html body .contact-grid .webcheck .field :is(input,textarea){font-size:16px}
.question-suggestions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.question-suggestions button{font:400 13px/1.4 var(--sans);padding:10px 12px;min-height:40px;border:1px solid var(--line);border-radius:8px;color:var(--ivory,#f6f1e7);background:#071820;cursor:pointer}
.question-suggestions button:hover{border-color:var(--gold)}
.question-suggestions button:focus-visible{outline:2px solid var(--gold-bright);outline-offset:3px}
body[data-page=websitecheck] #webcheck{scroll-margin-top:90px}
body[data-page=websitecheck] .check-landing{padding:54px 0 64px;min-height:0}
body[data-page=websitecheck] .check-entry{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:start;gap:48px;width:min(92%,1320px)}
body[data-page=websitecheck] .check-heading{padding-top:30px;min-width:0}
body[data-page=websitecheck] .check-heading h1{font-size:clamp(44px,4.2vw,72px);line-height:1.08}
body[data-page=websitecheck] .check-heading .section-lead{font:400 17px/1.65 var(--sans);max-width:40ch}
body[data-page=websitecheck] .check-entry .webcheck{margin:0;padding:24px;background:#06141b;border:1px solid var(--line);backdrop-filter:none;box-shadow:none;min-width:0}
body[data-page=websitecheck] .check-form-title{font:400 28px/1.2 var(--serif);text-transform:none;letter-spacing:normal;min-height:0;margin:0 0 22px}
body[data-page=websitecheck] .check-entry .webcheck form{margin-top:0}
body[data-page=websitecheck] .contact-explanation .contact-grid{display:block}
body[data-page=websitecheck] .contact-explanation .check-intro{max-width:740px;margin-inline:auto}
.case-status{font:400 12px/1.5 var(--sans);letter-spacing:.08em;color:var(--gold);margin:8px 0}
.case-preview{width:min(1000px,94vw);height:min(90dvh,1000px);max-height:90dvh;padding:20px;border:1px solid var(--gold);border-radius:14px;color:var(--ivory,#f6f1e7);background:#04131b}
.case-preview[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:16px}
.case-preview::backdrop{background:#000d}
.case-preview-top{display:flex;justify-content:space-between;align-items:center;gap:16px}
.case-preview h2{font:400 28px/1.2 var(--serif);margin:0}
.case-preview-image{overflow:auto;overscroll-behavior:contain}
.case-preview-image img{display:block;width:100%;height:auto}
.case-preview>a{justify-self:start}
@media(max-width:760px){
 body[data-page=websitecheck] .check-landing{padding:28px 0 40px}
 body[data-page=websitecheck] .check-entry{grid-template-columns:1fr;gap:24px;width:calc(100% - 32px)}
 body[data-page=websitecheck] .check-heading{padding-top:0}
 body[data-page=websitecheck] .check-heading h1{font-size:44px;margin:16px 0}
 body[data-page=websitecheck] .check-heading .section-lead{font-size:16px;margin-bottom:0}
 body[data-page=websitecheck] .check-entry .webcheck{padding:20px 16px}
 .case-preview{padding:14px}.case-preview h2{font-size:22px}.case-preview .button{padding:12px}
}

/* NAX-EINDREVIEW-R3B-20260920 — remaining IJ labels, deck stills and replacing form result. */
html body #services-table thead th,html body .booking-benefits li>span:last-child{font-size:12px;letter-spacing:.14em;line-height:1.5}
html body .webcheck .field label{font-size:12px;letter-spacing:.14em;line-height:1.5}
.handoff-deck .deck-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 46%;z-index:0;opacity:1;filter:saturate(.82) contrast(1.13) brightness(.7);pointer-events:none}
.handoff-deck .deck-zone.has-video>.deck-poster{opacity:0}
#webcheck-form.is-complete>:not(.form-result){display:none!important}
#webcheck-form.is-complete>.form-result{margin-top:0;padding-top:0;border-top:0}
.form-result>[data-download-summary],.form-result>[data-edit-form]{display:flex;width:fit-content;min-height:44px;align-items:center;gap:8px;margin-top:12px}

/* NAX-EINDREVIEW-R3C-20260920: confirmed offer and company facts. */
.check-assurances{list-style:none;padding:0;margin:14px 0;color:#e8d5aa;font-size:12px;line-height:1.6;letter-spacing:normal;text-transform:none}
.check-assurances li+li{margin-top:5px}
.check-assurances li::before{content:'✓';margin-right:8px;color:#e7c078}
.webcheck .websitecheck-offer{font-size:15px;line-height:1.65}
.business-details{font-size:12px;line-height:1.6;color:#cfc3a8;text-align:center;padding:12px 20px;overflow-wrap:anywhere}
.privacy-facts p{max-width:68ch}
html body .booking-tools h3{font-size:clamp(17px,1.5vw,22px);line-height:1.35}
html body .integrations h2{font-size:clamp(28px,2.6vw,42px);line-height:1.2}

/* Ronde 3D: mandatory Creative onboarding remains readable beside every price. */
.creative-rates .rate-chip {
  flex: 1 1 240px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  padding: 18px;
  border-radius: 14px;
  white-space: normal;
  text-align: left;
}
.creative-onboarding-note {
  display: block;
  margin-top: 12px;
  font: 400 14px/1.6 var(--sans);
  letter-spacing: normal;
  text-transform: none;
  white-space: normal;
  color: #e3e6e3;
}
.creative-onboarding-note > span { display: block; }
.creative-onboarding-waiver { margin-top: 8px; color: #d9c798; }
.creative-rates .creative-onboarding-note { margin-top: 0; }
.cr-onboarding .creative-onboarding-note { margin-top: 0; }
.cr-onboarding .cr-onboarding-details > p { font: 400 14px/1.6 var(--sans); margin-top: 8px; color: #e3e6e3; }
@media (max-width: 1023px) {
  .creative-prices article { flex-basis: 300px; width: 300px; }
}
@media (max-width: 1000px) {
  .cr-onboarding .cr-onboarding-details { grid-column: 1 / -1; }
}

/* Round 4B: the image exists independently of video readiness or autoplay permission. */
html body img.media-poster { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; pointer-events:none; opacity:1!important; border-radius:inherit; }
html body video[data-panel-loop]:not(.nx-playing),html body video[data-hero-loop]:not(.nx-playing),html body video[data-ambient-loop]:not(.nx-playing),html body video[data-finale-loop]:not(.nx-playing) { opacity:0!important; }
html body .product-grid article>.media-poster { z-index:0; }
html body .product-grid article>.product-loop-shade { opacity:1; }
html body .product-grid .gold-ring { display:grid; place-items:center; }
html body .gold-ring>.icon,html body .cap-ring>.icon { margin:0; padding:0; position:static; transform:none; }
html body #pakketten .art { position:relative; display:block; overflow:hidden; aspect-ratio:1; }
html body #pakketten .build-card .art { aspect-ratio:4/3; }
html body #pakketten .art>video,html body #pakketten .art>.media-poster { position:absolute; inset:0; width:100%; height:100%; min-height:0; object-fit:cover; }
html body #pakketten .art>video { transition:opacity .4s ease; }
html body .mark-meta,html body .mark-mailchimp { background:#f3eedf; border-radius:9px; }
html body .mark-meta img,html body .mark-mailchimp img { filter:none!important; opacity:1!important; }
html body .cinematic>img.media-poster,html body .page-intro>img.media-poster { z-index:-2; }
html body .lux-footer-frame>img.media-poster { z-index:0; object-position:50% 56%; filter:brightness(.65); }
.media-debug { position:fixed; z-index:2147483647; left:8px; right:8px; bottom:calc(8px + env(safe-area-inset-bottom,0px)); max-width:660px; max-height:45svh; overflow:auto; padding:10px; border:1px solid #e7c078; border-radius:8px; background:#06121bf5; color:#fff; font:12px/1.5 monospace; }
.media-debug pre { white-space:pre-wrap; overflow-wrap:anywhere; margin:8px 0; }.media-debug summary { cursor:pointer; min-height:24px; }
@media(max-width:760px) {
 html body .seal-cta { bottom:calc(88px + env(safe-area-inset-bottom,0px)); }
 html body .sector-content .button { width:100%; max-width:100%; min-width:0; min-height:44px; padding:10px 8px; justify-content:center; gap:8px; white-space:normal; text-align:center; }
 html body .sector-content .button>.icon { flex-shrink:0; width:18px; }
 html body .booking-section--glass .booking-layout { grid-template-columns:minmax(0,1fr); gap:24px; }
 html body .booking-section--glass .booking-layout::before,html body .booking-section--glass .booking-layout::after { display:none; content:none; }
 html body .booking-section--glass .agenda-demo { width:100%; min-width:0; max-width:100%; margin-inline:auto; grid-column:1; padding:18px 12px; }
 html body .booking-section--glass .agenda-stage { min-width:0; padding:14px 10px; }
 html body .booking-section--glass .agenda-wizard { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; }
 html body .booking-section--glass .agenda-wizard p { margin:0; text-align:center; }
 html body .booking-section--glass .agenda-wizard>div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
 html body .booking-section--glass .agenda-wizard button { min-width:0; min-height:44px; padding:10px 8px; }
 html body .lux-footer-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 18px; }
 html body .lux-footer-brand,html body .lux-footer-grid>div:last-child { grid-column:1/-1; }
 html body .lux-footer-brand { text-align:center; margin-bottom:0; }
 html body .lux-footer-lockup { justify-content:center; }
 html body .lux-footer-emblem { width:76px; height:76px; }
 html body .lux-footer-brand p { padding:0; background:none; margin:12px 0; }
 html body .lux-footer-grid .f-row { font-size:12px; min-height:44px; gap:8px; }
 html body .lux-footer-grid h2 { font-size:15px; }
 html body .lux-footer-brand .brand-wordmark { color:#f6deb0; -webkit-text-fill-color:#f6deb0; }
 html body .lux-footer-bottom { padding-bottom:112px; gap:16px; }
 html body .lux-footer-claim { white-space:normal; min-width:0; max-width:100%; text-align:center; line-height:1.6; letter-spacing:.1em; }
 html body .lux-footer-claim::after { display:none; }
 html body .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
 html body .product-grid article,html body .product-grid article:last-child { grid-column:auto; min-height:180px; padding:20px 10px; }
 html body[data-page=home] .product-grid article p { display:none; }
 html body .trust-names span+span::before,html body #pakketten .values span::before { content:none; display:none; }
 html body .trust-names,html body #pakketten .values { gap:12px 18px; justify-content:center; text-align:center; }
 html body .services-section,html body .transform-section,html body .possibilities-section { min-height:0; padding-block:48px; }
 html body .services-section .service-grid { gap:16px; }
 html body .services-section .service-item { min-height:0; padding:24px 18px; }
 html body .capability-rail { margin-top:32px; }
 html body .process-section .process-grid>li { min-height:0; padding-block:26px; }
 html body .process-grid>li>img.media-poster { filter:brightness(.45); }
 html body .lux-footer-frame { padding-block:32px 0; }
}

@media(max-width:760px){
 html body .products-section .product-grid>article:last-child { grid-column:auto; }
 html body #pakketten .care-card { grid-template-columns:minmax(0,96px) minmax(0,1fr); gap:16px; }
 html body #pakketten .care-card .art { width:100%; min-width:0; max-width:100%; }
}

/* Late 4B review correction: keep the case poster inside the actual laptop bezel. */
html body .case-image>img.media-poster.case-loop { inset:auto; top:8px; left:6px; width:calc(100% - 12px); height:calc(100% - 16px); object-position:center top; border-radius:2px; z-index:0; }
@media(max-width:1100px){html body .case-image>img.media-poster.case-loop { top:5px; left:3px; width:calc(100% - 6px); height:calc(100% - 10px); }}
@media(max-width:760px){html body .case-image>img.media-poster.case-loop { top:7px; left:4px; width:calc(100% - 8px); height:calc(100% - 14px); }}

/* 4D: the film engraving carries the tile only while it really plays on desktop. */
@media(min-width:761px){
 html body .product-grid article.is-media-playing h3,html body .product-grid article.is-media-playing .gold-ring,html body .product-grid article.is-media-playing .gold-rule,html body .product-grid article.is-media-playing .product-blurb { opacity:0; }
}
@media(max-width:760px){html body .product-grid article h3 { opacity:1; }}
html body .creative-subnav { position:relative; z-index:10; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:4px 22px; padding:8px var(--gutter); border-block:1px solid var(--line); background:var(--navy); font:400 var(--nx-type-label)/1.4 var(--sans); }
html body .creative-subnav>span { color:var(--gold); letter-spacing:.14em; text-transform:uppercase; }
html body .creative-subnav>a { min-height:44px; display:inline-flex; align-items:center; text-decoration:none; }
html body .creative-subnav>a:hover,html body .creative-subnav>a:focus-visible { color:var(--gold-bright); }
html body .px-family-film { position:relative; width:min(100%,680px); aspect-ratio:16/9; margin:var(--nx-space-24) auto var(--nx-space-40); overflow:hidden; border:1px solid var(--line); border-radius:var(--nx-radius-panel); background:var(--ink); isolation:isolate; }
html body .px-family-film>video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .5s ease; }
html body .px-family-film.has-video>video { opacity:1; }
html body .px-family-film>figcaption { position:absolute; bottom:0; left:0; right:0; z-index:2; margin:0; padding:12px 16px; color:var(--text); background:linear-gradient(transparent,#030c12eb); font:400 var(--nx-type-caption)/1.5 var(--sans); }
@media(max-width:760px){html body .creative-subnav { gap:0 16px; padding:6px 20px; justify-content:flex-start; }html body .creative-subnav>span { width:100%; padding-top:6px; }html body .px-family-film { margin-block:24px; }}
/* Round 5A/5C: mobile composition and shared navigation/CTA contracts. */
.mobile-menu-dialog{box-sizing:border-box;position:fixed;inset:0;margin:0;width:100%;max-width:none;height:100svh;max-height:none;padding:24px clamp(24px,6vw,80px) calc(24px + env(safe-area-inset-bottom,0px));overflow:auto;border:0;color:#fff4df;background:linear-gradient(150deg,#0e2531,#03111bef 60%),#03111b}
.mobile-menu-dialog::backdrop{background:#03111be8}
.mobile-menu-top{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-bottom:24px;border-bottom:1px solid #e7c07866}
.mobile-menu-top .menu-toggle{display:grid!important;position:relative;flex:none;width:48px;height:48px;background:transparent;color:#efd198;border:1px solid #e7c078;border-radius:50%}
.mobile-menu-top .menu-toggle .icon{visibility:hidden}
.mobile-menu-top .menu-toggle::before,.mobile-menu-top .menu-toggle::after{content:'';position:absolute;width:21px;height:1px;background:currentColor;transform:rotate(45deg)}
.mobile-menu-top .menu-toggle::after{transform:rotate(-45deg)}
.mobile-menu-dialog .mobile-nav:not([hidden]){display:flex!important;flex-direction:column;gap:0;padding:24px 0;margin:0;border:0;background:none;width:100%}
.mobile-menu-dialog .mobile-nav a{display:flex;align-items:center;min-height:48px;padding:6px 0;border:0;color:#f5ead5;font:clamp(27px,5vw,40px)/1.2 var(--serif);letter-spacing:0;text-transform:none;text-decoration:none}
.mobile-menu-dialog .mobile-nav a:hover,.mobile-menu-dialog .mobile-nav a:focus-visible{color:#edc780}
.mobile-menu-dialog a:focus-visible,.mobile-menu-dialog button:focus-visible{outline:2px solid #edc780;outline-offset:4px}
.home-fixed-cta{position:fixed;z-index:100;right:24px;bottom:24px;display:flex;align-items:center;justify-content:center;min-height:48px;padding:12px 24px;border:1px solid #e7c078a3;border-radius:999px;background:linear-gradient(#ffffff12,transparent 70%),#071923f5;box-shadow:inset 0 1px #fff5,0 8px 24px #0006;color:#f7e8ce;font:500 14px/1.3 var(--sans);text-decoration:none}
.home-fixed-cta[hidden]{display:none}.home-fixed-cta:focus-visible{outline:2px solid #f2d18b;outline-offset:4px}
.comparison-touch-hint{display:none}
@media(pointer:coarse){.comparison-touch-hint{display:inline}.comparison-keyboard-hint{display:none}}
#pakketten .sum-row.total .amt #tot-month{display:block;margin-top:16px}
@media(max-width:760px){
 .home-fixed-cta{left:20px;right:20px;bottom:calc(88px + env(safe-area-inset-bottom,0px));min-height:48px}
 .mobile-menu-dialog{padding-top:20px}
 .mobile-menu-top .brand-wordmark{font-size:24px}
 .mobile-menu-dialog .mobile-nav{padding-top:16px!important}
 .mini-pillars{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px!important;align-items:stretch;margin:24px 0}
 .mini-pillars>div,.mini-pillars>div+div{position:relative;isolation:isolate;min-width:0;width:auto;flex:none;padding:16px 8px!important;border:1px solid #e7c07855;border-radius:6px;overflow:hidden;min-height:202px}
 .mini-pillars>div::after{content:'';position:absolute;inset:0;background:linear-gradient(#03121aad,#03121ae6);z-index:1;pointer-events:none}
 .mini-pillars .pillar-front{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
 .mini-pillars .pillar-front>span{display:block;min-width:0}
 .mini-pillars .pillar-front b{font:22px/1.15 var(--serif);color:#fff3de}
 .mini-pillars .pillar-front small{display:block;font:12px/1.5 var(--sans);color:#eee6d7;margin-top:8px}
 .mini-pillars .pillar-front>.icon{width:36px;height:36px;margin:0;color:#e7c078}
 .capability-rail{min-height:0!important;margin:24px 0 0!important;padding:12px!important;gap:10px!important;isolation:isolate}
 .capability-rail>img.media-poster.rail-brand{position:absolute!important;inset:0!important;width:100%!important;min-width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;mask-image:none!important;-webkit-mask-image:none!important;filter:brightness(.5);z-index:-1;display:block!important}
 .capability-rail>div:not(.rail-lockup){min-width:160px!important;min-height:144px!important;padding:16px 10px!important;flex:0 0 160px;background:#03121a99!important}
 .capability-rail .cap-front{gap:10px}.capability-rail .cap-ring{width:44px;height:44px}.capability-rail h3{font-size:12px;line-height:1.5;letter-spacing:.12em}
 .services-section,.possibilities-section,.transform-section,.process-section{padding-block:40px!important;min-height:0!important}
 .services-section .service-grid{display:block;margin:24px 0;gap:0}
 .services-section .service-item{display:grid;grid-template-columns:minmax(0,1fr);min-height:0!important;padding:20px 0!important;text-align:left;border:0;border-bottom:1px solid #e7c07850;border-radius:0;box-shadow:none;background:none!important;backdrop-filter:none!important}
 .services-section .service-item::before,.services-section .service-item::after,.services-section .service-item .gold-rule{display:none}
 .services-section .service-item h3{margin:0 0 8px;font:30px/1.1 var(--serif);color:#fff1d9}
 .services-section .service-item p{margin:0;max-width:none;font:16px/1.6 var(--sans);color:#eee1ca;-webkit-text-fill-color:currentColor;background:none}
 .process-section .process-grid{display:grid;grid-template-columns:1fr;gap:0;margin:24px 0!important}
 .process-section .process-grid>li{--stap:#e7c078;--stapzacht:#061824;min-height:0!important;margin:0!important;padding:24px 0!important;border:0;border-bottom:1px solid #e7c07850;border-radius:0;background:none!important;box-shadow:none;backdrop-filter:none!important;text-align:left;transform:none!important}
 .process-section .process-grid>li::before,.process-section .process-grid>li::after,.process-section .process-grid>li>.media-poster,.process-section .process-grid>li>video{display:none!important}
 .process-section .step-top{margin:0 0 12px;justify-content:flex-start;gap:16px}
 .process-section .process-grid .gold-ring{width:44px;height:44px;color:#e7c078;border-color:#e7c078;background:#061824;box-shadow:none}
 .process-section .process-grid .gold-ring .icon{width:23px;height:23px}
 .process-section .process-grid h3{font:28px/1.2 var(--serif);margin:0 0 8px}.process-section .process-grid p{font:16px/1.6 var(--sans);color:#eee1ca;margin:0}
 .possibilities-section .possibility-copy{padding:0!important}.possibilities-section .container{padding-bottom:0!important}
 .transform-section .comparison{margin-top:24px;margin-bottom:0}.transform-section .comparison .fineprint{margin-bottom:0}
 .lux-footer{padding:24px 0 0!important;min-height:0!important}
 .lux-footer .lux-footer-frame{padding:0 20px!important;min-height:0!important}
 .lux-footer .lux-footer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 16px;padding:0!important}
 .lux-footer .lux-footer-brand{grid-column:1/-1;display:block;text-align:left;margin:0;padding:0}
 .lux-footer .lux-footer-lockup{display:flex;align-items:center;justify-content:flex-start;gap:16px}
 .lux-footer .lux-footer-emblem{width:64px;height:64px;margin:0}
 body:has(.finale) .lux-footer .lux-footer-emblem{display:none}
 .lux-footer .brand-wordmark{font-size:30px;color:#f1d399;background:none;-webkit-text-fill-color:currentColor;text-shadow:none}
 .lux-footer .brand-wordmark small{font-size:12px;color:#efcf8f;-webkit-text-fill-color:currentColor}
 .lux-footer .lux-footer-brand .gold-rule,.lux-footer-motto{display:none}
 .lux-footer .lux-footer-brand p{font-size:13px;line-height:1.5;margin:8px 0 0}
 .lux-footer .lux-footer-grid h2{font-size:18px;margin:0 0 8px;letter-spacing:0}
 .lux-footer .f-row{min-height:44px;gap:0;padding:8px 0;border:0;font-size:13px;line-height:1.5}
 .lux-footer .f-ic,.lux-footer .f-row>.icon{display:none}
 .lux-footer .lux-footer-grid>div:last-child{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:12px}
 .lux-footer .lux-footer-grid>div:last-child h2{grid-column:1/-1}
 .lux-footer .lux-footer-bottom{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;margin:20px 0 0;padding:16px 0 calc(24px + env(safe-area-inset-bottom,0px));min-height:0}
 .lux-footer .lux-footer-bottom>small{width:100%;font-size:11px}.lux-footer .lux-footer-claim{flex:1;white-space:normal;font-size:10px;line-height:1.6;letter-spacing:.1em}.lux-footer .lux-footer-line{display:none}.lux-footer .lux-footer-social{margin:0}.lux-footer .lux-footer-social a{width:44px;height:44px}
}
/* Final specificity matches the existing typography system. */
html body .mobile-menu-dialog .mobile-nav a{font:400 clamp(28px,5vw,40px)/1.2 var(--serif)!important;letter-spacing:0!important;text-transform:none!important;min-height:48px}
html body .mobile-menu-top .menu-toggle::before,html body .mobile-menu-top .menu-toggle::after{inset:auto;left:50%;top:50%;width:21px;height:1px;background:#efd198;transform:translate(-50%,-50%) rotate(45deg);border:0;box-shadow:none}
html body .mobile-menu-top .menu-toggle::after{transform:translate(-50%,-50%) rotate(-45deg)}
@media(max-width:760px){
 html body .lux-footer .f-row{display:flex;gap:0;padding:8px 0;min-height:44px}
 html body .lux-footer .f-label{flex:1;width:100%;max-width:none;min-width:0}
 html body .lux-footer .lux-footer-grid>div:last-child .f-row{font-size:12px}
 html body .process-section .process-grid{padding:0;border:0;border-radius:0;background:none!important;box-shadow:none;backdrop-filter:none!important}
 html body .process-section .process-grid>li{display:grid!important;grid-template-columns:52px minmax(0,1fr);grid-template-rows:auto auto;column-gap:16px;row-gap:8px;padding:20px 0!important}
 html body .process-section .process-grid>li .step-top{grid-column:1;grid-row:1/3;display:flex;flex-direction:column;gap:10px;align-items:center;margin:0}
 html body .process-section .process-grid>li h3{grid-column:2;grid-row:1;height:auto;padding:0;margin:0;font:26px/1.2 var(--serif);letter-spacing:0;text-transform:none}
 html body .process-section .process-grid>li p{grid-column:2;grid-row:2;height:auto;padding:0;margin:0;overflow:visible;font:15px/1.6 var(--sans)}
 html body .process-section .step-top .step-number{margin:0;color:#e7c078;border-color:#e7c078;background:#061824;box-shadow:inset 0 0 0 1px #e7c07855}
 html body .process-section .step-top>.icon{color:#e7c078;width:24px;height:24px;margin:0}
 html body .handoff-copy>.eyebrow{display:block!important}
 html body .handoff-copy>.eyebrow::before{display:none}
 .comparison .fineprint{display:block!important;text-align:center}
}