/* Webshop 20261110w98 */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&display=swap'); section.bg-white:has(.ws-root){background:#F3F3F4!important;padding-left:0!important;padding-right:0!important} section.bg-white:has(.ws-root) > div{padding-top:0!important;padding-bottom:0!important} section.bg-white:has(.ws-root) .container{max-width:none!important;padding:0!important} .ws-root{--muted:#5B5C63;--soft:#3A3B40;--line:#DCDDE0;--bg:#F3F3F4;font-family:'Poppins',system-ui,sans-serif;color:#000;background:var(--bg);line-height:1.5;-webkit-font-smoothing:antialiased} .ws-root *{box-sizing:border-box} .ws-root p,.ws-root h1,.ws-root h2,.ws-root h3,.ws-root li,.ws-root span,.ws-root a,.ws-root button,.ws-root label,.ws-root input,.ws-root b,.ws-root td,.ws-root th{font-family:'Poppins',system-ui,sans-serif!important} .ws-root h1,.ws-root h2,.ws-root h3,.ws-root p{margin:0!important} .ws-root h1,.ws-root h2{font-weight:900!important;line-height:1.12!important} .ws-root h3{font-weight:800!important} .ws-root a{color:#000} .ws-root .ws-test{background:#FFF4CC;color:#3A2E00;text-align:center;font-size:13px;padding:8px 16px;font-weight:600} .ws-root .ws-test code{background:#fff;padding:1px 6px;border-radius:4px;font-weight:700} .ws-root .ws-in{max-width:1200px;margin:0 auto;padding:0 24px} .ws-root .ws-tabs{background:#000} .ws-root .ws-tabs .ws-in{display:flex;flex-wrap:wrap;gap:6px;padding-top:12px;padding-bottom:12px;align-items:center} .ws-root .ws-tab{font-size:14px;font-weight:700;background:transparent;color:#fff;border:1px solid #3A3B40;border-radius:22px;height:40px;padding:0 16px;cursor:pointer} .ws-root .ws-tab[aria-current=page]{background:#fff;color:#000;border-color:#fff} .ws-root .ws-who{margin-left:auto;color:#B9BAC0;font-size:13px} .ws-root .ws-back{background:none;border:0;color:#fff;font-size:15px;font-weight:700;cursor:pointer;padding:8px 0} .ws-root .ws-back:hover{text-decoration:underline} .ws-root [hidden]{display:none!important} .ws-root .ws-hero{background:#000;color:#fff;padding:52px 0 64px} .ws-root .ws-hero .ws-in{display:flex;flex-wrap:wrap;gap:40px;align-items:flex-start} .ws-root .ws-hl{flex:999 1 480px;min-width:0;display:flex;flex-direction:column;gap:16px} .ws-root .ws-eye{font-size:13px!important;font-weight:700;letter-spacing:.12em;color:#B9BAC0!important} .ws-root .ws-hero h1{font-size:clamp(32px,5vw,56px)!important;color:#fff!important} .ws-root .ws-lead{font-size:17px!important;color:#D6D7DB!important;max-width:580px} .ws-root .ws-codebox{display:flex;flex-direction:column;gap:8px;max-width:540px} .ws-root .ws-codebox label{font-size:14px;font-weight:600} .ws-root .ws-code{display:flex;flex-wrap:wrap;gap:10px} .ws-root .ws-code input{flex:1 1 220px;min-width:0;height:52px;padding:0 16px;font-size:18px;letter-spacing:.06em;text-transform:uppercase;border:2px solid currentColor;background:transparent;color:inherit;border-radius:10px} .ws-root .ws-err{color:#B4231C;font-size:14px;font-weight:600} .ws-root .ws-hero .ws-err{color:#FF8A80} .ws-root .ws-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 24px;border-radius:10px;font-weight:800;font-size:15px;text-decoration:none!important;cursor:pointer;border:1px solid #000;background:#000;color:#fff!important;text-align:center} .ws-root .ws-btn.ws-light{background:#fff;color:#000!important;border-color:#fff} .ws-root .ws-btn.ws-ghost{background:#fff;color:#000!important;border-color:#000} .ws-root .ws-btn[disabled]{opacity:.4;cursor:not-allowed} .ws-root .ws-link{background:none;border:0;padding:0;text-decoration:underline;cursor:pointer;font-size:15px;text-align:left;color:inherit} .ws-root .ws-scar{flex:1 1 320px;min-width:0;background:#16171A;border:1px solid #2E2F34;border-radius:16px;padding:26px;display:flex;flex-direction:column;gap:16px;color:#fff} .ws-root .ws-big{font-size:42px;font-weight:900;line-height:1;display:block} .ws-root .ws-sm{font-size:13px;color:#B9BAC0} .ws-root .ws-bar{height:12px;background:#2E2F34;border-radius:6px;overflow:hidden} .ws-root .ws-bar i{display:block;height:12px;background:#fff;border-radius:6px} .ws-root .ws-sec{padding:60px 0} .ws-root .ws-sec h2{font-size:32px!important} .ws-root .ws-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px} .ws-root .ws-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px;display:flex;flex-direction:column;gap:10px} .ws-root .ws-card.ws-dark{background:#000;border-color:#000} .ws-root .ws-card.ws-dark h3,.ws-root .ws-card.ws-dark p,.ws-root .ws-card.ws-dark .ws-price{color:#fff!important} .ws-root .ws-tag{font-size:12px!important;font-weight:700;letter-spacing:.08em;color:var(--muted)!important} .ws-root .ws-dark .ws-tag,.ws-root .ws-dark .ws-note{color:#B9BAC0!important} .ws-root .ws-card h3{font-size:20px!important} .ws-root .ws-price{font-size:24px;font-weight:900} .ws-root .ws-note{font-size:13px;color:var(--muted)} .ws-root .ws-band{background:#000;border-radius:20px;padding:36px;display:flex;flex-wrap:wrap;align-items:center;gap:28px} .ws-root .ws-band h2{color:#fff!important;font-size:32px!important} .ws-root .ws-band p{color:#D6D7DB!important} .ws-root .ws-band b{color:#fff!important} .ws-root .ws-preview{position:relative;overflow:hidden;border-radius:12px;background:#0B0B0C;height:340px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px} .ws-root .ws-preview img{height:220px;width:auto} .ws-root .ws-plate{background:#fff;color:#000;padding:8px 18px;border-radius:6px;text-align:center;font-size:12px} .ws-root .ws-wm{position:absolute;inset:-60px;display:grid;grid-template-columns:repeat(4,1fr);gap:30px 10px;transform:rotate(-24deg);pointer-events:none;align-content:center} .ws-root .ws-wm span{color:rgba(255,255,255,.4);font-weight:900;font-size:20px;letter-spacing:.1em} .ws-root .ws-steps{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px} .ws-root .ws-steps li{border-top:3px solid #000;padding-top:14px;display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--soft)} .ws-root .ws-steps b{font-size:17px;color:#000} .ws-root .ws-flow{display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start;padding:28px 0 64px} .ws-root .ws-panel{flex:999 1 580px;min-width:0;background:#fff;border-radius:16px;padding:30px;display:flex;flex-direction:column;gap:18px} .ws-root .ws-panel h1{font-size:28px!important} .ws-root .ws-side{flex:1 1 300px;min-width:0;background:#fff;border-radius:16px;padding:22px;display:flex;flex-direction:column;gap:12px;position:sticky;top:110px} .ws-root .ws-prog{list-style:none;margin:0;padding:16px 0;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px} .ws-root .ws-prog li{display:flex;align-items:center;gap:8px;color:var(--muted)} .ws-root .ws-prog li span{width:24px;height:24px;border-radius:12px;background:#E6E6E8;color:#3A3B40;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:800} .ws-root .ws-prog li.ws-on{color:#000;font-weight:700} .ws-root .ws-prog li.ws-on span{background:#000;color:#fff} .ws-root .ws-row{display:flex;align-items:center;gap:14px;border:1px solid var(--line);border-radius:12px;padding:16px;flex-wrap:wrap} .ws-root .ws-row.ws-sel{border:2px solid #000} .ws-root .ws-grow{flex:1 1 220px;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:13px;color:var(--muted)} .ws-root .ws-grow b{font-size:16px;color:#000} .ws-root .ws-lvl{flex:none;display:inline-flex;align-items:center;justify-content:center;width:52px;height:40px;border-radius:8px;background:#000;color:#fff;font-size:12px;font-weight:800} .ws-root .ws-qty{display:flex;align-items:center;gap:8px} .ws-root .ws-step{width:44px;height:44px;border-radius:10px;border:1px solid #000;background:#fff;color:#000;font-size:20px;cursor:pointer} .ws-root .ws-step.ws-plus{background:#000;color:#fff} .ws-root .ws-step[disabled]{opacity:.35;cursor:not-allowed} .ws-root .ws-tog{min-height:44px;padding:0 14px;border-radius:10px;border:1px solid #000;background:#fff;color:#000;font-size:14px;font-weight:700;cursor:pointer} .ws-root .ws-tog[aria-pressed=true]{background:#000;color:#fff} .ws-root .ws-pill{padding:8px 12px;background:#F3F3F4;border-radius:8px;font-weight:700;font-size:14px} .ws-root .ws-thumb{position:relative;overflow:hidden;flex:none;width:68px;height:88px;border-radius:8px;background:#0B0B0C;display:flex;align-items:center;justify-content:center} .ws-root .ws-thumb img{height:70px;width:auto} .ws-root .ws-thumb em{position:absolute;transform:rotate(-30deg);color:#fff;background:rgba(0,0,0,.55);padding:1px 4px;font-size:9px;font-weight:900;letter-spacing:.1em;font-style:normal} .ws-root .ws-choice{text-align:left;display:flex;flex-direction:column;gap:4px;padding:16px;border-radius:12px;border:2px solid var(--line);background:#fff;color:#000;cursor:pointer;width:100%} .ws-root .ws-choice[aria-pressed=true]{border-color:#000} .ws-root .ws-choice small{font-size:14px;color:var(--soft)} .ws-root .ws-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px} .ws-root .ws-form label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600} .ws-root .ws-form input{height:48px;padding:0 12px;border:1px solid #A7A8AE;border-radius:10px;font-size:15px;background:#fff;color:#000} .ws-root .ws-form input[aria-invalid=true]{border:2px solid #B4231C} .ws-root .ws-check{display:flex;gap:10px;align-items:flex-start;font-size:15px} .ws-root .ws-check input{width:22px;height:22px;margin-top:2px;flex:none} .ws-root .ws-nav{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--line);padding-top:18px;background:#fff} .ws-root .ws-navtot{display:none;font-weight:900;font-size:18px} .ws-root .ws-lines{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:14px} .ws-root .ws-lines li{display:flex;justify-content:space-between;gap:12px} .ws-root .ws-lines li b{white-space:nowrap} .ws-root .ws-lines li.ws-li2{flex-wrap:wrap} .ws-root .ws-lines li.ws-li2>span{flex:1 1 0;min-width:0} .ws-root .ws-sub{flex-basis:100%;margin:2px 0 0;padding-left:18px;font-size:13px;color:var(--soft);display:flex;flex-direction:column;gap:2px} .ws-root .ws-sub li{display:list-item;list-style:disc;color:inherit} .ws-root .ws-ben{margin:6px 0 0;padding-left:20px;font-size:14px;color:var(--soft);display:flex;flex-direction:column;gap:3px} .ws-root .ws-ben li{list-style:disc;color:inherit} .ws-root .ws-choice .ws-chead{display:flex;justify-content:space-between;gap:12px;font-size:16px;font-weight:700} .ws-root .ws-tk{display:flex;gap:16px;align-items:center;background:#fff;color:#000;border-radius:12px;padding:14px} .ws-root .ws-tk img{width:132px;height:132px;flex:0 0 132px} .ws-root .ws-tk b{display:block;font-size:17px} .ws-root .ws-tk small{display:block;color:#3A3B40;font-size:13px;margin-top:4px} .ws-root .ws-tk code{font-size:13px;color:#000;background:none;padding:0} .ws-root .ws-avond-rij{display:flex;flex-wrap:wrap;gap:32px;align-items:center} .ws-root .ws-avond-tekst{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:12px} .ws-root .ws-avond-rij>.ws-gf{flex:1 1 380px;min-width:0} .ws-root .ws-prog2{list-style:none;margin:6px 0;padding:0;display:flex;flex-direction:column;gap:0;border-left:2px solid var(--gold)} .ws-root .ws-prog2 li{display:flex;flex-direction:column;gap:2px;padding:8px 0 8px 16px;color:inherit} .ws-root .ws-prog2 b{color:var(--gold);font-size:14px;letter-spacing:.04em} .ws-root .ws-prog2 span{font-size:15px} .ws-root .ws-galerij{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin-top:22px} .ws-root .ws-gf{margin:0;position:relative;border-radius:14px;overflow:hidden;background:#111} .ws-root .ws-gf img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover} .ws-root .ws-gf figcaption{position:absolute;left:0;right:0;bottom:0;padding:24px 14px 10px;font-size:13px;font-weight:700;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.75))} .ws-root .ws-titels{color:inherit!important;margin:4px 0 8px;padding-left:20px;display:flex;flex-direction:column;gap:4px;font-weight:700} .ws-root .ws-titels li{list-style:disc;color:inherit!important} .ws-root .ws-chead>span:last-child{white-space:nowrap} .ws-root .ws-h2{font-size:20px;margin:22px 0 4px!important;text-transform:none} .ws-root .ws-keuzes{display:flex;flex-direction:column;gap:12px;margin:8px 0 12px} @media (max-width:900px){.ws-root.ws-laatste .ws-side{display:none}} .ws-root .ws-choice .ws-tag{display:inline-block;margin-top:6px;font-size:12px;font-weight:700;color:var(--gold);text-transform:uppercase;letter-spacing:.04em} .ws-root .ws-sum{border-top:1px solid var(--line);padding-top:10px;display:flex;flex-direction:column;gap:4px;font-size:14px} .ws-root .ws-sum div{display:flex;justify-content:space-between} .ws-root .ws-sum .ws-tot{font-size:22px;font-weight:900} .ws-root .ws-info{background:#F3F3F4;border-radius:12px;padding:14px 16px;font-size:14px;color:var(--soft)} .ws-root table{border-collapse:collapse;width:100%;font-size:15px} .ws-root th{text-align:left;font-size:12px;color:var(--muted);padding:10px 8px;border-bottom:1px solid var(--line)} .ws-root td{padding:12px 8px;border-bottom:1px solid #EEEEF0;vertical-align:top} .ws-root .ws-r{text-align:right} .ws-root blockquote{margin:0;padding:12px 14px;background:var(--bg);border-radius:10px;font-size:14px;border:0} .ws-root .ws-plan{background:#fff;border:2px solid var(--line);border-radius:16px;padding:22px;display:flex;flex-direction:column;gap:12px} .ws-root .ws-plan.ws-best{border-color:#000} .ws-root .ws-plan ul{margin:0;padding-left:18px;font-size:14px;display:flex;flex-direction:column;gap:6px;flex-grow:1} .ws-root .ws-badge{font-size:11px;font-weight:800;letter-spacing:.08em;background:#000;color:#fff;padding:4px 9px;border-radius:6px} .ws-root .ws-was{font-size:14px;color:var(--muted);text-decoration:line-through;margin-left:8px} .ws-root .ws-qr{width:72px;height:72px;flex:none;border-radius:6px;background:repeating-linear-gradient(90deg,#000 0 6px,#fff 6px 9px);outline:2px solid #000;border:6px solid #fff} .ws-root .ws-tick{display:flex;gap:14px;align-items:center} .ws-root .ws-tick input{height:40px;padding:0 10px;border:1px solid #A7A8AE;border-radius:8px;font-size:14px;width:100%;max-width:220px} .ws-root :focus-visible{outline:2px solid #000;outline-offset:2px} @media (max-width:900px){ .ws-root .ws-side{position:static;order:1} .ws-root .ws-nav{position:sticky;bottom:0;margin:0 -20px -20px;padding:14px 20px;border-radius:0 0 16px 16px;box-shadow:0 -6px 16px rgba(0,0,0,.08)} .ws-root .ws-navtot{display:block;flex:1 1 100%} .ws-root .ws-nav .ws-btn{flex:1 1 0} .ws-root .ws-panel{padding:20px} .ws-root .ws-band{padding:24px} .ws-root .ws-who{margin-left:0;flex-basis:100%} } /* DFA huisstijl (Figma Social Media / Library): zwart, goudverloop, goud #EDBA4D, wit, Inter Black in hoofdletters */ section.bg-white:has(.ws-root){background:#000!important} .ws-root{--gold:#EDBA4D;--g:linear-gradient(143deg,#D0AD67 2%,#F9E78C 16%,#F8F6C2 23%,#F9E78C 32%,#D0AD67 65%,#492926 108%);--line:#2A2A2A;--muted:#A9A9A9;--soft:#C9C9C9;--bg:#0B0B0B;--card:#141414;--card2:#1A1A1A;background:#0B0B0B;color:#fff} .ws-root.ws-root p,.ws-root.ws-root h1,.ws-root.ws-root h2,.ws-root.ws-root h3,.ws-root.ws-root li,.ws-root.ws-root span,.ws-root.ws-root a,.ws-root.ws-root button,.ws-root.ws-root label,.ws-root.ws-root input,.ws-root.ws-root b,.ws-root.ws-root td,.ws-root.ws-root th,.ws-root.ws-root small,.ws-root.ws-root blockquote{font-family:'Inter',system-ui,sans-serif!important} .ws-root h1,.ws-root h2{font-weight:900!important;text-transform:uppercase;letter-spacing:.01em;line-height:1.08!important;color:#fff!important} .ws-root h3{font-weight:800!important;text-transform:uppercase;color:#fff!important} .ws-root a{color:var(--gold)} .ws-root b{color:#fff} .ws-root .ws-test{background:var(--g);color:#000;font-weight:600} .ws-root .ws-test code{background:#000;color:var(--gold)} .ws-root .ws-tabs{background:#000;border-bottom:1px solid #1E1E1E} .ws-root .ws-tab{color:#fff;border:1px solid #3A3A3A;border-radius:22px;background:transparent;text-transform:uppercase;font-weight:800;font-size:13px;letter-spacing:.04em} .ws-root .ws-tab[aria-current=page]{background:var(--g);color:#000;border-color:transparent} .ws-root .ws-who{color:var(--muted)} .ws-root .ws-hero{background:linear-gradient(107.5deg,#000 0%,#1E1E1E 100%);color:#fff;padding:0 0 56px;overflow:hidden} .ws-root .ws-hl{padding-top:56px} .ws-root .ws-hero h1{font-size:clamp(34px,5vw,60px)!important} .ws-root .ws-eye{color:var(--gold)!important;font-weight:800;letter-spacing:.1em} .ws-root .ws-lead{color:#D6D6D6!important} .ws-root .ws-pen{flex:0 0 300px;margin:0 auto;position:relative;filter:drop-shadow(0 20px 30px rgba(0,0,0,.6))} .ws-root .ws-pen-in{background:linear-gradient(180deg,#1b1b1b,#050505);clip-path:polygon(0 0,100% 0,100% 82%,50% 100%,0 82%);padding:44px 34px 90px;display:flex;flex-direction:column;align-items:center;gap:18px} .ws-root .ws-pen-in img{width:190px;height:auto} .ws-root .ws-edi{background:#050505;border:1px solid #2a2a2a;border-radius:22px;padding:10px 26px;color:var(--gold);font-weight:700;font-size:22px} .ws-root .ws-aw{position:relative;flex:0 0 260px;width:260px;aspect-ratio:640/752;container-type:inline-size;background:#000 center/cover no-repeat;color:#fff;font-family:Inter,system-ui,sans-serif;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.35)} .ws-root .ws-aw-jaar{position:absolute;left:42.6%;top:29.5%;width:14.8%;height:3.7%;border-radius:1.2cqw;font-size:2.3cqw;font-weight:800;display:flex;align-items:center;justify-content:center} .ws-root .ws-aw.regionaal .ws-aw-jaar{background:linear-gradient(90deg,#f7e6ad,#c8983a);color:#151515} .ws-root .ws-aw.landelijk .ws-aw-jaar{background:#111;color:#fff} .ws-root .ws-aw-cat{position:absolute;left:10%;right:10%;top:49.3%;text-align:center;color:#e3a84f;font-size:2.75cqw;line-height:1.2} .ws-root .ws-aw-naam{position:absolute;left:10%;right:10%;top:52.8%;text-align:center;font-size:6.4cqw;font-weight:900;line-height:1.2;letter-spacing:-.01em;word-break:break-word} .ws-root .ws-aw-titel{position:absolute;left:24%;right:24%;top:74.5%;height:17%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center} .ws-root .ws-aw-lbl{color:#e3a84f;font-size:4cqw;font-weight:800;line-height:1.1} .ws-root .ws-aw-kop{font-size:4.7cqw;font-weight:800;line-height:1.15} .ws-root .ws-aw.landelijk .ws-aw-kop{font-size:5.6cqw} .ws-root .ws-aw-reg{font-size:2.2cqw;line-height:1.3} .ws-root .ws-check2{display:flex;gap:10px;align-items:flex-start;font-weight:700;font-size:15px;margin-top:12px} .ws-root .ws-check2 input{width:20px;height:20px;margin-top:2px;flex:none} .ws-root .ws-awrow{display:flex;flex-wrap:wrap;gap:14px;align-items:center} .ws-root .ws-awrow .ws-grow{min-width:180px} .ws-root textarea.ws-opm{width:100%;min-height:72px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font:inherit;font-size:15px} .ws-root .ws-hfoto{flex:1 1 380px;min-width:0;max-width:560px;margin:0 auto;display:flex;flex-direction:column;gap:12px;align-self:center} .ws-root .ws-hfoto img{width:100%;height:auto;border-radius:18px;box-shadow:0 24px 70px rgba(237,186,77,.28)} .ws-root .ws-hfoto figcaption{color:#B9BAC0;font-size:14px;text-align:center} .ws-root .ws-strip{background:var(--g);color:#000;text-align:center;padding:14px 24px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:clamp(14px,2vw,22px)} .ws-root .ws-strip b{color:#000;font-weight:900} .ws-root .ws-code input{border:1px solid #3A3A3A;background:#111;color:#fff;border-radius:10px} .ws-root .ws-code input:focus{border-color:var(--gold);outline:none} .ws-root .ws-btn{border-radius:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;font-size:14px;min-height:48px;background:var(--g);border:0;color:#000!important} .ws-root .ws-btn.ws-light{background:var(--g);color:#000!important} .ws-root .ws-btn.ws-ghost{background:transparent;color:#fff!important;border:1px solid #fff} .ws-root .ws-link{color:var(--gold)!important} .ws-root .ws-scar{background:var(--card);border:1px solid var(--line);color:#fff} .ws-root .ws-sm{color:var(--muted)} .ws-root .ws-bar{background:#2A2A2A} .ws-root .ws-bar i{background:var(--g)} .ws-root .ws-sec{background:#0B0B0B} .ws-root .ws-sec h2{font-size:clamp(28px,3.4vw,40px)!important} .ws-root .ws-card,.ws-root .ws-plan{background:var(--card);border:1px solid var(--line);border-radius:16px;color:#fff} .ws-root .ws-card.ws-dark,.ws-root .ws-plan.ws-best{border:2px solid transparent;background:linear-gradient(var(--card),var(--card)) padding-box,var(--g) border-box} .ws-root .ws-card.ws-dark h3,.ws-root .ws-card.ws-dark p{color:#fff!important} .ws-root .ws-price,.ws-root .ws-card.ws-dark .ws-price{color:var(--gold)!important;font-weight:900} .ws-root .ws-tag,.ws-root .ws-dark .ws-tag{color:var(--gold)!important;font-weight:800;letter-spacing:.08em} .ws-root .ws-note,.ws-root .ws-dark .ws-note{color:var(--muted)!important} .ws-root .ws-card p{color:var(--soft)} .ws-root .ws-band{border:2px solid transparent;background:linear-gradient(#111,#111) padding-box,var(--g) border-box;border-radius:16px} .ws-root .ws-band h2,.ws-root .ws-band b{color:#fff!important} .ws-root .ws-band p{color:#D6D6D6!important} .ws-root .ws-sec[style*="background:#fff"]{background:#000!important} .ws-root [style*="color:#3A3B40"]{color:var(--soft)!important} .ws-root [style*="background:#fff;border-bottom"]{background:#000!important;border-bottom-color:#1E1E1E!important} .ws-root .ws-preview{background:#111;border:1px solid var(--line)} .ws-root .ws-steps li{border-top:3px solid var(--gold);color:var(--soft)} .ws-root .ws-steps b{color:#fff} .ws-root #v_tickets,.ws-root #v_inzicht,.ws-root #v_bestelling{background:#0B0B0B} .ws-root .ws-panel,.ws-root .ws-side{background:var(--card);border:1px solid var(--line);border-radius:16px;color:#fff} .ws-root .ws-prog li{color:var(--muted)} .ws-root .ws-prog li span{background:#2A2A2A;color:#fff} .ws-root .ws-prog li.ws-on{color:#fff} .ws-root .ws-prog li.ws-on span{background:var(--g);color:#000} .ws-root .ws-row{background:var(--card2);border:1px solid var(--line);color:#fff} .ws-root .ws-row.ws-sel,.ws-root .ws-choice[aria-pressed=true]{border:2px solid var(--gold)} .ws-root .ws-grow{color:var(--muted)} .ws-root .ws-grow b{color:#fff} .ws-root .ws-choice{background:var(--card2);border:1px solid var(--line);color:#fff} .ws-root .ws-choice small{color:var(--soft)} .ws-root .ws-lvl{background:#050505;color:var(--gold);border:1px solid #2a2a2a;border-radius:22px;width:60px;height:32px} .ws-root .ws-step{background:transparent;color:#fff;border:1px solid #fff;border-radius:10px} .ws-root .ws-step.ws-plus{background:var(--g);color:#000;border:0} .ws-root .ws-tog{background:transparent;color:#fff;border:1px solid #fff;border-radius:10px} .ws-root .ws-tog[aria-pressed=true]{background:var(--g);color:#000;border-color:transparent} .ws-root .ws-pill{background:#050505;color:var(--gold);border:1px solid #2a2a2a;border-radius:22px} .ws-root .ws-info{background:var(--card2);border-left:3px solid var(--gold);border-radius:10px;color:var(--soft)} .ws-root .ws-badge{background:var(--g);color:#000;border-radius:22px} .ws-root .ws-was{color:var(--muted)} .ws-root .ws-form label{color:#fff} .ws-root .ws-form input,.ws-root .ws-tick input{background:#0B0B0B;color:#fff;border:1px solid #3A3A3A;border-radius:10px} .ws-root .ws-form input:focus,.ws-root .ws-tick input:focus{border-color:var(--gold);outline:none} .ws-root .ws-form input[aria-invalid=true]{border:2px solid #FF6B5E} .ws-root .ws-err{color:#FF8A80} .ws-root .ws-check{color:#fff} .ws-root .ws-check input{accent-color:#EDBA4D} .ws-root .ws-nav{background:var(--card);border-top:1px solid var(--line)} .ws-root .ws-lines li,.ws-root .ws-sum{color:var(--soft);border-color:var(--line)} .ws-root .ws-sum .ws-tot{color:#fff} .ws-root .ws-sum .ws-tot span:last-child{color:var(--gold)} .ws-root .ws-navtot{color:#fff} .ws-root th{color:var(--muted);border-color:var(--line)} .ws-root td{border-color:#222;color:#fff} .ws-root blockquote{background:var(--card2);color:#fff} .ws-root [style*="background:#000;color:#fff;border-radius:12px"]{background:var(--g)!important;color:#000!important} .ws-root .ws-row[style*="border:2px solid #000"]{border:2px solid var(--gold)!important;background:var(--card)!important} .ws-root :focus-visible{outline:2px solid var(--gold)} @media (max-width:900px){.ws-root .ws-nav{border-top:2px solid var(--gold)}.ws-root .ws-pen{flex-basis:240px;order:-1}.ws-root .ws-pen-in{padding:30px 26px 70px}.ws-root .ws-pen-in img{width:140px}.ws-root .ws-hl{padding-top:8px}} .ws-root .ws-portaal{display:flex;flex-direction:column;gap:12px;margin-top:22px;padding:22px;border:1px solid #EDBA4D;border-radius:16px;background:#16171A;color:#fff} .ws-root .ws-portaal p{color:#C9C9CF!important} .ws-root .ws-portaal-eye{font-size:12px!important;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#EDBA4D!important} .ws-root .ws-portaal-f{display:flex;flex-direction:column;gap:10px;max-width:420px} .ws-root .ws-portaal-f small{font-size:13px;color:#A9A9AF!important} .ws-root .dn-eye{font-size:13px!important;font-weight:700;letter-spacing:.12em;color:var(--gold,#EDBA4D)!important} .ws-root .dn-stap,.ws-root #ws_diner,.ws-root #ws_aanvragen,.ws-root #ws_avond{display:flex;flex-direction:column;gap:16px} .ws-root .dn-prog{padding:0;margin:0 0 4px}.ws-root .dn-prog li[aria-current=step]{font-weight:800}.ws-root .dn-prog .dn-klaar{color:#1E7A3C} .ws-root .dn-f{display:flex;flex-direction:column;gap:6px}.ws-root .dn-f label{font-size:14px;font-weight:600}.ws-root .dn-f small{font-size:13px;color:#5B5C63} .ws-root .dn-f input,.ws-root .dn-f textarea,.ws-root .dn-f select{width:100%;min-height:48px;padding:10px 14px;font:16px Poppins,system-ui,sans-serif;border:1px solid #B9BAC0;border-radius:10px;background:#fff;color:#000} .ws-root .dn-rij{display:grid;grid-template-columns:1fr 1fr;gap:14px} .ws-root .dn-chips{display:flex;flex-wrap:wrap;gap:8px}.ws-root .dn-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid #B9BAC0;border-radius:22px;padding:8px 14px;font-size:14px;cursor:pointer} .ws-root .dn-chip input{width:18px;height:18px;margin:0}.ws-root .dn-chip:has(input:checked){background:#000;color:#fff;border-color:#000} .ws-root .dn-check{display:flex;gap:10px;align-items:flex-start;font-size:15px}.ws-root .dn-check input{width:20px;height:20px;margin-top:3px;flex:none} .ws-root .dn-rollen{display:flex;flex-direction:column;gap:10px} .ws-root .dn-foto{display:flex;align-items:center;gap:16px}.ws-root .dn-foto img,.ws-root .dn-foto span{width:84px;height:84px;border-radius:50%;object-fit:cover;background:#F3F3F4;display:grid;place-items:center;font-size:12px;color:#5B5C63;flex:none} .ws-root .dn-ticket small{color:#5B5C63!important} .ws-root .dn-nav{display:flex;justify-content:space-between;gap:10px;border-top:1px solid #DCDDE0;padding-top:18px} .ws-root .ws-btn.dn-terug{background:#fff;color:#000!important;border:1px solid #000} .ws-root .dn-melding{border-left:4px solid #EDBA4D;background:#FFF8E6;color:#000;padding:14px 16px;border-radius:6px;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between} .ws-root .dn-tickets{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px} .ws-root .dn-ticket{display:flex;gap:14px;align-items:center;border:2px solid #000;border-radius:12px;padding:12px;background:#fff;color:#000}.ws-root .dn-ticket b,.ws-root .dn-ticket span{color:#000!important}.ws-root .dn-ticket img{width:120px;height:120px;flex:none} .ws-root .dn-ticket div{display:flex;flex-direction:column;gap:2px}.ws-root .dn-ticket small{color:#5B5C63;letter-spacing:.04em} .ws-root .dn-gasten{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px} .ws-root .dn-gast{display:flex;gap:12px;align-items:flex-start;border:1px solid #DCDDE0;border-radius:10px;padding:12px;font-size:14px} .ws-root .dn-gast img,.ws-root .dn-av{width:52px;height:52px;border-radius:50%;object-fit:cover;flex:none;background:#F3F3F4;color:#000;display:grid;place-items:center;font-weight:800} .ws-root .ws-routes{display:flex;flex-direction:column;gap:8px;margin-top:6px} .ws-root .ws-routes-knoppen{display:flex;flex-wrap:wrap;gap:10px} .ws-root #ws_stepbody>*+*{margin-top:14px!important} .ws-root .ws-twee{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;margin-top:22px} .ws-root .ws-moment{border:1px solid #2A2A2A;border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:12px;background:#141414} .ws-root .ws-moment .ws-tag{color:var(--gold)!important;font-weight:800;letter-spacing:.08em;font-size:12px} .ws-root .ws-moment .ws-scar{margin:4px 0} .ws-root .ws-moment-knop{margin-top:auto;padding-top:6px} .ws-root .ws-lead2{font-size:16px;max-width:720px;margin-top:6px!important;color:#D6D7DB!important} .ws-root .ws-twee-sec p.ws-sm{color:#B9BAC0!important} .ws-root .ws-choice{transition:border-color .15s}.ws-root .ws-choice:hover{border-color:var(--gold,#EDBA4D)} .ws-root .ws-choice .ws-chead>span:first-child{display:flex;align-items:center;gap:10px} .ws-root .ws-choice .ws-chead>span:first-child::before{content:'';flex:none;width:20px;height:20px;border:2px solid #8A8B90;border-radius:50%;box-sizing:border-box} .ws-root .ws-choice[aria-pressed=true] .ws-chead>span:first-child::before{border-color:var(--gold,#EDBA4D);background:radial-gradient(circle,var(--gold,#EDBA4D) 0 40%,transparent 45%)} .ws-root .ws-choice ul{padding-left:30px} .ws-root .ws-ben{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px;font-size:14px;flex-grow:1;color:#D6D7DB} .ws-root .ws-card .ws-btn{margin-top:8px;align-self:flex-start} .ws-root .ws-card{display:flex;flex-direction:column} .ws-root .ws-card .ws-ben{flex:1 1 auto} .ws-root .ws-kv{display:flex;flex-direction:column;gap:6px;margin-top:14px;padding-top:14px;border-top:1px solid #2E2F34} .ws-root .ws-kv .ws-note{min-height:2.7em} .ws-root .ws-kv .ws-btn{width:100%;margin-top:6px} .ws-root .ws-ben .ws-link{font-size:14px;padding:0} .ws-root .ws-tel-prijs{font-size:13px;color:var(--gold,#EDBA4D);font-weight:700;white-space:nowrap} .ws-root .ws-start{border-left:3px solid var(--gold,#EDBA4D);background:#16171A;padding:12px 14px;border-radius:8px;font-size:15px;color:#fff!important;max-width:580px} .ws-root .ws-col{position:relative} .ws-root .ws-col-aw{grid-column:1/-1;border-radius:12px;background:#16171A;border:1px solid #2E2F34;display:grid;grid-template-columns:minmax(0,58%) minmax(0,1fr);gap:16px;align-items:center;padding:16px;box-shadow:0 24px 70px rgba(237,186,77,.28)} .ws-root .ws-col-aw .ws-aw{width:100%;flex:none;max-height:100%} .ws-root .ws-col-aw>div:last-child>b{font-size:20px;color:#fff;display:block}.ws-root .ws-col-aw>div:last-child>span{color:#D6D7DB;font-size:14px} .ws-root .kv-modal{position:fixed;inset:0;background:rgba(0,0,0,.8);z-index:9999;display:flex;align-items:flex-start;justify-content:center;overflow:auto;padding:110px 16px 30px} .ws-root .kv-doos{background:#111214;border:1px solid #2E2F34;border-radius:16px;max-width:1000px;width:100%;padding:22px;color:#fff;position:relative} .ws-root .kv-sluit{position:absolute;top:12px;right:12px} .ws-root .kv-g{font-size:16px;margin:0 0 6px;color:#fff} .ws-root .kv-kanaal{border-top:1px solid #2E2F34;padding-top:16px;margin-top:16px} .ws-root .kv-bul{margin:0 0 12px;padding-left:18px;font-size:14px;color:#D6D7DB}.ws-root .kv-bul li b{color:#fff;font-weight:600}.ws-root .kv-bul li span{color:#8A8B90} .ws-root .kv-beelden{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-start} .ws-root .kv-beelden img{height:340px;width:auto;max-width:100%;border-radius:8px;border:1px solid #2E2F34;background:repeating-conic-gradient(#1b1c20 0 25%,#141518 0 50%) 0 0/20px 20px} .ws-root .kv-beelden img.kv-linkedin-omslag,.ws-root .kv-beelden img.kv-facebook-omslag,.ws-root .kv-beelden img.kv-emailhandtekening,.ws-root .kv-beelden img.kv-website-badge{height:auto;width:100%;max-width:640px} @media (max-width:640px){.ws-root .kv-beelden img{height:auto;width:100%}} .ws-root .kv-p{color:#D6D7DB!important;font-size:15px;max-width:720px} .ws-root .kv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px;margin-top:10px;align-items:start} .ws-root .kv-item{margin:0;display:flex;flex-direction:column;gap:8px} .ws-root .kv-item img{width:100%;height:auto;border-radius:10px;border:1px solid #2E2F34;background:repeating-conic-gradient(#1b1c20 0 25%,#141518 0 50%) 0 0/20px 20px} .ws-root .kv-item figcaption{display:flex;flex-direction:column;gap:2px;font-size:13px;color:#B9BAC0}.ws-root .kv-item figcaption b{color:#fff;font-size:14px} .ws-root .kv-teksten{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-top:10px} .ws-root .kv-tekst{border:1px solid #2E2F34;border-radius:10px;padding:12px 14px;font-size:14px;color:#D6D7DB}.ws-root .kv-tekst b{color:#fff}.ws-root .kv-tekst p{margin:6px 0 0;color:#D6D7DB!important} .ws-root .ws-scar2{gap:12px;padding:20px;flex:0 0 auto!important;min-height:0!important;height:auto!important} .ws-root .ws-tel2{display:grid;grid-template-columns:1fr 1fr;gap:22px} .ws-root .ws-scar2 .ws-tel{border:0;padding:0;gap:6px} .ws-root .ws-scar2 .ws-tel-kop{font-size:13px;color:#D6D7DB;font-weight:600} .ws-root .ws-scar2 .ws-big{font-size:34px!important;line-height:1} .ws-root .ws-dl{font-size:12px;color:#9A9BA1!important;margin:0} .ws-root .ws-routes-knoppen .ws-btn{padding:10px 16px!important;font-size:12px!important;min-height:0!important} .ws-root .ws-start{font-size:14px!important;padding:10px 12px!important} .ws-root .ws-hero .ws-lead{margin-bottom:4px!important} .ws-root .ws-collage.ws-aw-aan .ws-col img:not(.ws-col-groot),.ws-root .ws-collage.ws-aw-aan figcaption{display:none} .ws-root .ws-collage.ws-aw-aan .ws-col-aw{grid-template-columns:1fr;justify-items:center;text-align:center;padding:22px} .ws-root .ws-collage.ws-aw-aan .ws-col-aw .ws-aw{width:min(100%,340px)} @media (max-width:640px){.ws-root .ws-tel2{grid-template-columns:1fr;gap:14px}} .ws-root .ws-zoekbox{display:flex;flex-direction:column;gap:6px;max-width:580px;margin-top:4px} .ws-root .ws-zoekbox label{font-size:14px;font-weight:600} .ws-root .ws-zoekbox input{min-height:46px;padding:10px 14px;border-radius:10px;border:1px solid #3A3B40;background:#111214;color:#fff;font:16px Inter,system-ui,sans-serif} .ws-root .ws-zoekres{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px} .ws-root .ws-zoekres button{width:100%;text-align:left;background:#16171A;border:1px solid #2E2F34;border-radius:10px;padding:10px 14px;color:#fff;cursor:pointer;display:flex;flex-direction:column;gap:2px} .ws-root .ws-zoekres button:hover{border-color:var(--gold,#EDBA4D)}.ws-root .ws-zoekres small{color:#B9BAC0;font-size:13px} .ws-root .ws-card .ws-btn[disabled]{opacity:.55;cursor:default} .ws-root .ws-knoppen2{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:8px}.ws-root .ws-knoppen2 .ws-btn{margin-top:0} .ws-root .ws-ups{display:flex;flex-wrap:wrap;gap:8px} .ws-root .ws-tog.ws-up{display:inline-flex;align-items:center;gap:8px;background:#16171A;color:#fff;border:1px solid #3A3B40;border-radius:10px;min-height:42px;padding:0 12px;font-weight:600} .ws-root .ws-tog.ws-up b{color:var(--gold,#EDBA4D);font-weight:800} .ws-root .ws-tog.ws-up .ws-up-v{width:18px;height:18px;border:2px solid #8A8B90;border-radius:5px;box-sizing:border-box;flex:none} .ws-root .ws-tog.ws-up[aria-pressed=true]{border-color:var(--gold,#EDBA4D);background:#1f1b10;color:#fff} .ws-root .ws-tog.ws-up[aria-pressed=true] .ws-up-v{border-color:var(--gold,#EDBA4D);background:var(--gold,#EDBA4D) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8l3 3 7-7' stroke='%23000' stroke-width='2.5' fill='none'/%3E%3C/svg%3E") center/12px no-repeat} .ws-root .ws-tog.ws-up:hover{border-color:var(--gold,#EDBA4D)} .ws-root .ws-up-blok{display:flex;flex-wrap:wrap;gap:14px;align-items:center;border:1px dashed var(--gold,#EDBA4D);border-radius:12px;padding:14px 16px;margin-top:10px} .ws-root .ws-sm2{display:block;font-size:14px;color:#B9BAC0!important;margin-top:2px} .ws-root .ws-extras{display:flex;flex-direction:column;gap:10px} .ws-root .ws-extra{border:1px solid #2E2F34;border-radius:12px;padding:14px 16px;background:#141518} .ws-root .ws-extra-uit{opacity:.6} .ws-root .ws-awr{display:grid;grid-template-columns:150px 1fr auto;gap:16px;align-items:start;border:1px solid #2E2F34;border-radius:12px;padding:14px;background:#141518;margin-top:10px} .ws-root .ws-awr-img{position:relative;cursor:zoom-in}.ws-root .ws-awr-img .ws-aw{width:150px;flex:none;box-shadow:none} .ws-root .ws-zoom{display:block;text-align:center;font-size:12px;color:#8A8B90;margin-top:4px} .ws-root .kv-groot{width:min(460px,86vw);margin:20px auto 0}.ws-root .kv-groot .ws-aw{width:100%} .ws-root .ws-awr-txt{display:flex;flex-direction:column;gap:4px;min-width:0}.ws-root .ws-awr-txt b{color:#fff} .ws-root .ws-awr-acties{display:flex;flex-direction:column;gap:8px;align-items:stretch;min-width:170px} .ws-root .ws-opmd{margin-top:6px}.ws-root .ws-opmd summary{cursor:pointer;font-size:13px;color:var(--gold,#EDBA4D)}.ws-root .ws-opmd textarea{width:100%;min-height:70px;margin-top:6px;border-radius:8px;border:1px solid #3A3B40;background:#0f1012;color:#fff;padding:8px 10px;font:14px Inter,system-ui,sans-serif} @media (max-width:640px){.ws-root .ws-awr{grid-template-columns:110px 1fr}.ws-root .ws-awr-img .ws-aw{width:110px}.ws-root .ws-awr-acties{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;min-width:0}} .ws-root .ws-extra-kop{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:10px} .ws-root .ws-seg{display:inline-flex;border:1px solid #3A3B40;border-radius:10px;overflow:hidden;margin:4px 0 14px}.ws-root .ws-seg button{background:transparent;color:#D6D7DB;border:0;padding:10px 18px;font:600 15px Inter,system-ui,sans-serif;cursor:pointer}.ws-root .ws-seg button[aria-pressed=true]{background:var(--gold,#EDBA4D);color:#000} .ws-root .ws-fg{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:12px}.ws-root .ws-fg2{grid-template-columns:1fr 1fr}.ws-root .ws-fnaam{grid-template-columns:2fr 1fr 2fr}.ws-root .ws-fadres{grid-template-columns:1.3fr 1.2fr 1fr 1fr} @media (max-width:640px){.ws-root .ws-fg2,.ws-root .ws-fnaam{grid-template-columns:1fr 1fr}.ws-root .ws-fnaam .ws-l:first-child{grid-column:1/-1}.ws-root .ws-fadres{grid-template-columns:1fr 1fr}} .ws-root .ws-l{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600;color:#fff}.ws-root .ws-l i{font-style:normal;font-weight:400;color:#8A8B90;font-size:13px} .ws-root .ws-l input,.ws-root .ws-l select{min-height:46px;padding:10px 12px;border-radius:10px;border:1px solid #3A3B40;background:#0f1012;color:#fff;font:16px Inter,system-ui,sans-serif;width:100%;box-sizing:border-box} .ws-root .ws-l input[aria-invalid=true]{border-color:#FF8A80} .ws-root .ws-det{margin:-4px 0 12px}.ws-root .ws-det summary{cursor:pointer;font-size:14px;color:var(--gold,#EDBA4D)}.ws-root .ws-det summary i{font-style:normal;color:#8A8B90}.ws-root .ws-det .ws-fg{margin-top:10px} .ws-root .ws-adresblok{display:flex;flex-direction:column;gap:4px;background:#16171A;border:1px solid #2E2F34;border-radius:12px;padding:14px 16px;margin:4px 0 8px}.ws-root .ws-adresblok span{color:#D6D7DB}.ws-root .ws-adresblok .ws-link{align-self:flex-start} section:has(#ws_root){overflow:visible!important} .ws-root .ws-flow>.ws-side{position:sticky!important;top:110px;align-self:flex-start;order:0} @media (max-width:900px){.ws-root .ws-flow>.ws-side{position:static!important}} .ws-root .ws-card{position:relative} .ws-root .ws-lint{position:absolute;top:-11px;left:16px;white-space:nowrap;max-width:calc(100% - 32px);overflow:hidden;text-overflow:ellipsis;background:linear-gradient(90deg,#F7E6AD,#C8983A);color:#000;font:800 11px Inter,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:5px 10px;border-radius:999px} .ws-root .ws-ta{min-height:70px;padding:10px 12px;border-radius:10px;border:1px solid #3A3B40;background:#0f1012;color:#fff;font:16px Inter,system-ui,sans-serif;width:100%;box-sizing:border-box} #v_diner .ws-panel h1,#v_aanvragen .ws-panel h1{margin-bottom:4px!important}#v_diner .ws-panel>div>p,#v_aanvragen .ws-panel p{color:#D6D7DB!important} html:has(#ws_root),body:has(#ws_root){background:#000!important} .ws-root .ws-view:not(#v_shop){min-height:calc(100vh - 260px)} .ws-root .ws-tel{display:flex;flex-direction:column;gap:6px;padding-bottom:14px;border-bottom:1px solid #2E2F34} .ws-root .ws-tel-kop{display:flex;justify-content:space-between;align-items:center;gap:8px}.ws-root .ws-tel-kop b{font-size:15px;color:#fff} .ws-root .ws-tel-getal{display:flex;align-items:baseline;gap:10px} .ws-root .ws-tel-label{background:var(--gold,#EDBA4D);color:#000;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:3px 9px;border-radius:999px} .ws-root .ws-deadlines{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px;font-size:14px} .ws-root .ws-deadlines li{display:flex;gap:10px}.ws-root .ws-deadlines b{color:var(--gold,#EDBA4D);min-width:118px}.ws-root .ws-deadlines span{color:#D6D7DB} .ws-root #ws_awtop:empty{display:none} .ws-root .ws-collage .ws-col{display:grid;grid-template-columns:repeat(3,1fr);gap:8px} .ws-root .ws-collage .ws-col img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:12px;box-shadow:none} .ws-root .ws-collage .ws-col img.ws-col-groot{grid-column:1/-1;aspect-ratio:3/2;box-shadow:0 24px 70px rgba(237,186,77,.28)} .ws-root .ws-collage figcaption{text-align:left} .ws-root .ws-hero .ws-in{flex-wrap:nowrap;align-items:center;gap:48px} .ws-root .ws-hero .ws-hl{flex:0 1 520px;min-width:0} .ws-root .ws-hfoto.ws-collage{flex:1 1 600px;max-width:680px;margin:0} .ws-root .ws-collage.ws-aw-aan .ws-col-aw .ws-aw{width:min(100%,460px)} @media (max-width:980px){.ws-root .ws-hero .ws-in{flex-wrap:wrap}.ws-root .ws-hero .ws-hl,.ws-root .ws-hfoto.ws-collage{flex:1 1 100%;max-width:none}}.ws-root .ws-collage figcaption b{color:#fff}.ws-root .ws-col-credit{display:block;font-size:12px;opacity:.7;margin-top:4px} .ws-root #ws_awtop{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr) minmax(0,240px);gap:28px;align-items:center;background:#16171A;border:1px solid #2E2F34;border-radius:16px;padding:22px;margin:22px 0 0;color:#fff} .ws-root #ws_awtop .ws-aw{width:100%;flex:none} .ws-root #ws_awtop .ws-awtop-tekst{display:flex;flex-direction:column;gap:8px} .ws-root #ws_awtop .ws-awtop-tekst b{font-size:24px;line-height:1.2;color:#fff}.ws-root #ws_awtop .ws-awtop-tekst span{color:#D6D7DB;font-size:15px} .ws-root #ws_awtop figure{position:relative;margin:0} .ws-root #ws_awtop figure img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:12px;display:block;opacity:.92} .ws-root #ws_awtop figure .ws-vb{position:absolute;top:10px;left:10px;background:rgba(0,0,0,.75);color:#fff;font-size:11px;font-weight:800;letter-spacing:.1em;padding:4px 9px;border-radius:999px} .ws-root #ws_awtop figcaption{font-size:12px;color:#B9BAC0;margin-top:6px} @media (max-width:900px){.ws-root #ws_awtop{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:12px;padding:12px}.ws-root #ws_awtop .ws-awtop-tekst{grid-column:1/-1;grid-row:2}.ws-root #ws_awtop .ws-awtop-tekst b{font-size:20px}} .ws-root .dn-side .ws-gf{margin:0} .ws-root #ws_diner p,.ws-root #ws_aanvragen p,.ws-root #ws_avond p{color:inherit!important;opacity:.92} .ws-root .dn-mee{border:1px solid #3A3B40;border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:10px}.ws-root .dn-mee-kop{display:flex;justify-content:space-between;align-items:center;gap:10px} @media (max-width:640px){.ws-root .dn-rij{grid-template-columns:1fr}.ws-root .dn-ticket img{width:96px;height:96px}} .ws-root .ws-lines li.ws-korting b,.ws-root .ws-lines li.ws-korting span{color:var(--gold,#EDBA4D)} /* Stap Awards (Willem 2026-10-18): grote award bovenaan, titels als keuzelijst */ .ws-root .ws-awhero{display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);grid-template-areas:'aw tekst' 'aw fotos';gap:16px 24px;align-items:start;background:#16171A;border:1px solid #2E2F34;border-radius:16px;padding:20px;margin:6px 0 22px;color:#fff} .ws-root .ws-awhero-aw{grid-area:aw;position:relative;cursor:zoom-in}.ws-root .ws-awhero-tekst{grid-area:tekst}.ws-root .ws-awhero-fotos{grid-area:fotos}.ws-root .ws-awhero-aw .ws-aw{width:100%} .ws-root .ws-awhero-tekst{display:flex;flex-direction:column;gap:8px}.ws-root .ws-awhero-tekst b{font-size:22px;line-height:1.2;color:#fff}.ws-root .ws-awhero-tekst span{color:#D6D7DB} .ws-root .ws-awhero-fotos{display:block;max-width:360px}.ws-root .ws-awhero-fotos figure{margin:0;position:relative} .ws-root .ws-awhero-fotos img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:10px;display:block} .ws-root .ws-awhero-fotos .ws-vb{position:absolute;top:8px;left:8px;background:rgba(0,0,0,.75);color:#fff;font-size:10px;font-weight:800;letter-spacing:.1em;padding:3px 8px;border-radius:999px} .ws-root .ws-awhero-fotos figcaption{font-size:12px;color:#B9BAC0;margin-top:5px} .ws-root .ws-awr2{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 16px;align-items:center;padding:14px 16px;border:1px solid #2E2F34;border-radius:12px;margin-bottom:10px;background:#16171A} .ws-root .ws-awr2.ws-awr-zie{border-color:var(--gold,#EDBA4D)} .ws-root .ws-awr2-kies{all:unset;box-sizing:border-box;cursor:pointer;display:flex;gap:12px;align-items:flex-start;color:#fff;min-width:0} .ws-root .ws-awr2-kies:focus-visible{outline:2px solid var(--gold,#EDBA4D);outline-offset:4px;border-radius:6px} .ws-root .ws-awr2-kies b{display:block;font-size:15px;line-height:1.35}.ws-root .ws-awr2-kies .ws-sm2{display:block;margin-top:2px} .ws-root .ws-awr2-box{width:20px;height:20px;border:2px solid #77787E;border-radius:5px;flex:none;margin-top:0;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:900;color:#000} .ws-root .ws-awr2.ws-awr-aan .ws-awr2-box{border-color:var(--gold,#EDBA4D);background:var(--gold,#EDBA4D)}.ws-root .ws-awr2.ws-awr-aan .ws-awr2-box::after{content:'✓'} .ws-root .ws-awr2.ws-awr-aan{border-color:#5A4A22} .ws-root .ws-awr2 .ws-opmd{grid-column:1/-1;margin:0} @media (max-width:640px){.ws-root .ws-awhero{grid-template-columns:1fr;grid-template-areas:'aw' 'tekst' 'fotos'}.ws-root .ws-awhero-aw{max-width:320px;width:100%;margin:0 auto}} @media (max-width:640px){.ws-root .ws-awr2{grid-template-columns:1fr}} /* Stap Awards w68: award links (blijft staan bij scrollen), titels rechts */ .ws-root .ws-awhero.ws-awhero2{grid-template-columns:minmax(0,260px) minmax(0,1fr);grid-template-areas:none;gap:24px;align-items:start} .ws-root .ws-awhero2 .ws-awhero-links{position:sticky;top:110px;display:flex;flex-direction:column;gap:12px} .ws-root .ws-awhero2 .ws-awhero-aw,.ws-root .ws-awhero2 .ws-awhero-tekst{grid-area:auto} .ws-root .ws-awhero2 .ws-awhero-tekst b{font-size:17px}.ws-root .ws-awhero2 .ws-awhero-tekst span{font-size:14px} .ws-root .ws-awhero-lijst{min-width:0}.ws-root .ws-awhero-lijst .ws-h2{margin-top:0}.ws-root .ws-awhero-lijst .ws-h2~.ws-h2{margin-top:18px} .ws-root .ws-awhero-lijst .ws-awr2{grid-template-columns:1fr;background:#1C1D21} .ws-root .ws-awhero-lijst .ws-awr-acties{display:flex;flex-wrap:wrap;gap:8px;padding-left:32px} .ws-root .ws-awhero-lijst .ws-awr2 .ws-opmd{padding-left:32px} @media (max-width:640px){.ws-root .ws-awhero.ws-awhero2{grid-template-columns:1fr}.ws-root .ws-awhero2 .ws-awhero-links{position:static}.ws-root .ws-awhero2 .ws-awhero-aw{max-width:240px;margin:0 auto}} /* Stap Awards w69: grotere award, alle titels in één blok */ .ws-root .ws-awhero.ws-awhero2{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:28px} .ws-root .ws-awhero2 .ws-awhero-aw{max-width:420px;width:100%} .ws-root .ws-awblok{border:1px solid #2E2F34;border-radius:12px;background:#1C1D21;overflow:hidden;margin-top:10px} .ws-root .ws-awblok .ws-awr2{border:0;border-radius:0;margin:0;background:transparent;border-bottom:1px solid #2E2F34;padding:14px 16px} .ws-root .ws-awblok .ws-awr2:last-child{border-bottom:0} .ws-root .ws-awblok .ws-awr2.ws-awr-zie{background:rgba(237,186,77,.07);box-shadow:inset 3px 0 0 var(--gold,#EDBA4D)} .ws-root .ws-awblok .ws-pill{display:inline-block} .ws-root .ws-awhero-lijst .ws-awr-acties{flex-direction:row;align-items:center}.ws-root .ws-awhero-lijst .ws-awr-acties>*{flex:0 0 auto;width:auto!important;min-width:0!important} .ws-root .ws-awok{display:flex;gap:10px;align-items:center;font-size:14px;font-weight:600;color:#fff;padding-left:32px;cursor:pointer}.ws-root .ws-awok input{width:18px;height:18px;accent-color:#EDBA4D;margin:0} .ws-root .ws-awhero-lijst .ws-awr2 .ws-awok{grid-column:1/-1} .ws-root .ws-awnaam input{font-size:16px;font-weight:700} .ws-root .ws-kitblok{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;border:1px solid #2E2F34;border-radius:12px;background:#16171A;padding:16px;margin-top:14px}.ws-root .ws-kitblok b{display:block;color:#fff;margin-bottom:4px}.ws-root .ws-kitblok>div{flex:1 1 260px} .ws-root .ws-awnaam{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px 12px;margin-bottom:18px}.ws-root .ws-awnaam .ws-l{flex:1 1 220px}.ws-root .ws-awnaam .ws-sm2{flex-basis:100%;margin:0} .ws-root .ws-awnaam-dicht{align-items:center;justify-content:space-between;border:1px solid #2E2F34;border-radius:12px;padding:12px 16px;background:#1C1D21}.ws-root .ws-awnaam-dicht .ws-sm2{display:block}.ws-root .ws-awnaam-dicht b{color:#fff;font-size:16px}.ws-root .ws-awnaam-dicht .ws-sm2{flex-basis:auto} .ws-root .dn-file{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}.ws-root .dn-fotoknop{cursor:pointer} .ws-root .ws-kwijt{margin:8px 0 0;color:#B9BAC0}.ws-root .ws-kwijt a{color:#EDBA4D} /* Testrapport 2026-10-18: mobiel stapelen, minder geneste ruimte, overzicht ook bij afrekenen, gelijke hoogtes */ @media (max-width:640px){.ws-root .ws-awhero.ws-awhero2{grid-template-columns:1fr!important}.ws-root .ws-awhero2 .ws-awhero-links{position:static!important}.ws-root .ws-awhero2 .ws-awhero-aw{max-width:260px;margin:0 auto} .ws-root .ws-choice .ws-chead{flex-wrap:wrap}.ws-root .ws-chead>span:last-child{white-space:normal!important} .ws-root .ws-panel{padding:16px!important}.ws-root .ws-nav{margin:0 -16px -16px!important;padding:12px 16px!important}} @media (max-width:900px){.ws-root.ws-laatste .ws-side{display:flex!important}} #ws_stepbody h1+h2,#ws_stepbody h1+.ws-h2{margin-top:12px!important} .ws-root .ws-awblok .ws-pill,.ws-root .ws-kitblok .ws-pill{min-height:42px;display:inline-flex;align-items:center;box-sizing:border-box} .ws-root .ws-awhero-lijst .ws-awr-acties{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));max-width:360px}.ws-root .ws-awhero-lijst .ws-awr-acties>.ws-link,.ws-root .ws-awhero-lijst .ws-awr-acties>.ws-pill{grid-column:1/-1;justify-self:start} /* QA 2026-10-18: mobiel e-mail en telefoon onder elkaar, koppen niet midden in een woord afbreken */ @media (max-width:480px){.ws-root .ws-fg2{grid-template-columns:1fr}#ws_root h1{font-size:20px!important;hyphens:manual}} /* Bouwblokken van /webshop/ (Umbraco) in het donkere winnaarskaart-design op de tussenstandfoto (Willem 2026-11-01: "ik zou overal dit design doorvoeren met de achtergrondfoto"). De klassen zet de app zelf. De site zet koppen wit en in Poppins en kleurt p, li en a; daarom de !important hieronder. */ /* De foto van /tussenstand/ vast achter de hele pagina, ook achter de bestelstappen. Kop en voet van de site houden hun eigen zwarte achtergrond. */ html.ws-pagina{background:#F5F2EA!important} html.ws-pagina body{background:transparent!important} html.ws-pagina body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:#F5F2EA url('https://www.dutchfitnessawards.nl/media/1oobfyv3/frame-4725.png') center/cover no-repeat} html.ws-pagina section[title]{background:transparent!important;color:#14170F} html.ws-pagina section[title]>.absolute{display:none} html.ws-pagina section[title] .component-richEditor{color:#14170F;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:16px;line-height:1.55} html.ws-pagina section[title] .component-richEditor :is(p,li,span,a,b,strong,em){font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif!important} html.ws-pagina section[title] .component-richEditor :is(p,li){color:inherit!important} html.ws-pagina section[title] .component-richEditor h1,html.ws-pagina section[title] .component-richEditor h2,html.ws-pagina section[title] .component-richEditor h3{color:#14170F!important;font-family:Poppins,Inter,sans-serif!important;font-weight:700;text-transform:none!important;letter-spacing:-.005em;line-height:1.15;margin:0 0 12px;text-wrap:balance} /* Tekst los op de foto: donker, met een witte gloed (zoals de mock-up). */ html.ws-pagina .ws-introtekst h1{font-size:clamp(30px,3.8vw,42px);text-shadow:0 1px 0 rgba(255,255,255,.6)} html.ws-pagina .ws-introtekst p{font-size:17px;color:#2E3127!important;max-width:600px} html.ws-pagina .ws-sectiekop{display:flex!important;flex-direction:row!important;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px} html.ws-pagina .ws-sectiekop h2{font-size:clamp(24px,2.6vw,30px);margin:0;text-shadow:0 1px 0 rgba(255,255,255,.6)} html.ws-pagina .ws-sectiekop p{margin:0;font-size:14px;font-weight:600;color:#2E3127!important} html.ws-pagina .ws-topstrook{box-sizing:border-box;background:transparent;width:100%;display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 16px 0} html.ws-pagina .ws-topstrook .ws-test{padding:0} html.ws-pagina .ws-band{display:inline-block;box-sizing:border-box;max-width:100%;background:#0b0b0b;color:#F5F2EA;border:1px solid rgba(249,231,140,.35);border-radius:999px;padding:7px 18px;text-align:center;font-weight:600;letter-spacing:.02em;text-transform:none;font-size:13.5px;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;box-shadow:0 8px 20px rgba(0,0,0,.18)} html.ws-pagina .ws-band *{color:#F5F2EA!important;margin:0;font-family:inherit!important} html.ws-pagina .ws-band :is(strong,b){color:#F9E78C!important} html.ws-pagina .ws-collage2>.grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px} html.ws-pagina .ws-collage2 .component-imageBlock{grid-column:auto!important} html.ws-pagina .ws-collage2 .component-imageBlock:first-child{grid-column:1/-1!important} html.ws-pagina .ws-collage2 img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:14px} html.ws-pagina .ws-collage2 .component-imageBlock:first-child img{aspect-ratio:3/2;border-radius:20px;box-shadow:0 12px 32px rgba(0,0,0,.25)} html.ws-pagina .ws-collage2 .component-richEditor{grid-column:1/-1!important;font-size:12px;color:#2E3127} /* Productkaarten: drie gelijke kolommen, onder 960px één kolom. Niets steekt buiten beeld. */ html.ws-pagina section[title]:has(.ws-kaart) .container>.grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:36px 24px!important;align-items:stretch} html.ws-pagina section[title]:has(.ws-kaart) .container>.grid>*{grid-column:auto!important;min-width:0} html.ws-pagina section[title]:has(.ws-kaart) .container>.grid>.ws-sectiekop{grid-column:1/-1!important} @media (max-width:959px){html.ws-pagina section[title]:has(.ws-kaart) .container>.grid{grid-template-columns:minmax(0,1fr)!important;gap:32px!important}} /* Een container zonder tekst (overblijfsel van een verwijderde kaart, alleen een knop) niet tonen. */ html.ws-pagina .ws-kaart:not(:has(.component-richEditor)){display:none!important} /* De winnaarskaart */ html.ws-pagina .ws-kaart>.grid{background:linear-gradient(180deg,#1b1b1b,#050505);border:0;border-radius:20px;box-shadow:0 12px 32px rgba(0,0,0,.25);padding:30px 24px 24px;height:100%;box-sizing:border-box;position:relative;display:flex!important;flex-direction:column;gap:0;color:#D9D6CC} html.ws-pagina .ws-kaart .component-richEditor{flex:1 1 auto;display:flex!important;flex-direction:column;position:static;color:#D9D6CC} html.ws-pagina .ws-kaart .component-richEditor :is(p,li){color:#D9D6CC!important} html.ws-pagina section[title] .ws-kaart h3{color:#fff!important;font-family:Poppins,Inter,sans-serif!important;font-weight:700;font-size:22px;line-height:1.25;min-height:2.5em;margin:0 0 4px} html.ws-pagina .ws-kaart ul{list-style:none;padding:0;margin:12px 0 22px;display:flex;flex-direction:column;gap:9px;font-size:15px} html.ws-pagina .ws-kaart li{position:relative;padding-left:24px;margin:0} html.ws-pagina .ws-kaart li::before{content:"\2713";position:absolute;left:0;top:0;font-weight:700;color:#F9E78C} html.ws-pagina .ws-kaart a{color:#F9E78C!important;text-decoration:underline;text-underline-offset:3px} /* Het label (een alinea met alleen schuine tekst) hangt als gouden pil over de bovenrand. */ html.ws-pagina .ws-kaart p:has(>em:only-child){position:absolute;top:-12px;left:24px;margin:0;z-index:2;line-height:1} html.ws-pagina .ws-kaart p>em:only-child{display:inline-block;font-style:normal;background:linear-gradient(143deg,#D0AD67 2%,#F9E78C 16%,#F8F6C2 23%,#F9E78C 32%,#D0AD67 65%,#492926 108%);color:#14170F!important;font-weight:700;font-size:11px;line-height:1;letter-spacing:.08em;text-transform:uppercase;padding:7px 12px;border-radius:999px;box-shadow:0 4px 12px rgba(0,0,0,.25)} /* Prijs en noot onderaan; de noot is altijd twee regels hoog, zodat prijzen en knoppen op één lijn staan. */ html.ws-pagina .ws-kaart p:has(>strong:first-child){margin:auto 0 0;padding:0;border:0;font-size:13px;line-height:1.45;color:#A9A9A9!important;min-height:calc(40px + 2.9em)} html.ws-pagina .ws-kaart p>strong:first-child+br{display:none} html.ws-pagina .ws-kaart p>strong:first-child{display:block;font-family:Poppins,Inter,sans-serif!important;font-size:32px;line-height:1;font-weight:700;color:#fff;letter-spacing:0;margin-bottom:8px} html.ws-pagina .ws-kaart .component-button{margin-top:16px;align-items:stretch!important} html.ws-pagina section[title] .component-button a.button{background:linear-gradient(143deg,#D0AD67 2%,#F9E78C 16%,#F8F6C2 23%,#F9E78C 32%,#D0AD67 65%,#492926 108%)!important;border:0!important;color:#14170F!important;border-radius:999px!important;font-family:Poppins,Inter,sans-serif!important;font-weight:700;text-transform:uppercase;letter-spacing:.06em;box-shadow:none!important;text-decoration:none!important} html.ws-pagina section[title] .ws-kaart .component-button a.button{display:flex!important;width:100%!important;box-sizing:border-box;justify-content:center;padding:15px 18px!important;font-size:14px;line-height:1} html.ws-pagina section[title] .component-button a.button:hover{filter:brightness(1.05)} /* Tussen 960 en 1200px kan de noot drie regels worden; dan is het vak drie regels hoog. */ @media (min-width:960px) and (max-width:1199px){html.ws-pagina .ws-kaart p:has(>strong:first-child){min-height:calc(40px + 4.35em)}html.ws-pagina section[title] .ws-kaart .component-button a.button{font-size:13px;letter-spacing:.04em;padding:15px 10px!important}} html.ws-pagina section[title] .ws-kaart .component-button a.button{white-space:nowrap} @media (max-width:959px){html.ws-pagina section[title] .ws-kaart h3{min-height:0}html.ws-pagina .ws-kaart p:has(>strong:first-child){min-height:0}} html.ws-pagina .ws-appbox .ws-hero{padding:0!important;background:none!important;min-height:0!important} html.ws-pagina .ws-appbox .ws-hero .ws-in{padding:0!important;max-width:none!important;display:block!important} html.ws-pagina .ws-appbox .ws-hl{max-width:none!important} html.ws-pagina .ws-appbox .ws-in{padding-left:0!important;padding-right:0!important;max-width:none!important} /* De sectie met teksten is alleen voor de backoffice. */ html.ws-pagina section.ws-tekstsectie,section[title^="Webshop teksten"]{display:none!important} /* Bestellen: alleen de app, over de volle breedte. */ html.ws-flow-aan section[title]:not(.ws-appsectie){display:none!important} html.ws-flow-aan .ws-band,html.ws-flow-aan .ws-appsectie .ws-introtekst,html.ws-flow-aan .ws-appsectie .ws-collage2{display:none!important} html.ws-flow-aan .ws-appbox,html.ws-flow-aan .ws-appbox>.grid>*{grid-column:1/-1!important} html.ws-flow-aan .ws-appsectie>.z-10{padding-top:0!important} /* ========================================================================================== Webshop in het donkere winnaarskaart-design, op de foto van de tussenstandpagina (Willem 2026-11-01: "ik zou overal dit design doorvoeren met de achtergrondfoto"). Laatste laag van dfa-tickets/public/webshop/app.css: maak_webshop_app.py zet dit bestand achter de webshop-CSS en CSS_BLOKKEN. Alleen opmaak: geen HTML, klassen, stappen of teksten veranderen hier. Vervangt stijl-portaal.css (crème portaalstijl, PR #567), die Willem afwees. Het design (mock-up winnaars/webshop-varianten/alles-donker.html): - achtergrond: de tussenstandfoto, vast achter de pagina (CSS_BLOKKEN zet hem op body::before); - elke kaart (startkaart, paneel, winkelmand, diner, Mijn avond) is een winnaarskaart: verloop #1b1b1b naar #050505, radius 20, schaduw 0 12px 32px rgba(0,0,0,.25), witte koppen in Poppins, lichte tekst #D9D6CC, gouden vinkjes #F9E78C; - de hoofdknop is het gouden verloop (--g) met donkere tekst, als pil; tweede knoppen een gouden rand; - tekst die los op de foto staat (terug-link, voortgang) is donker, met een witte gloed. ========================================================================================== */ /* ---------- Tokens: in de kaarten licht op donker ---------- */ .ws-root{ --bg:transparent; --card:linear-gradient(180deg,#1b1b1b,#050505); --card2:rgba(255,255,255,.055); /* binnenblok in een kaart */ --card3:#161616; /* effen donker (sticky balk, venster) */ --ink:#FFFFFF;--soft:#D9D6CC;--muted:#A9A9A9;--faint:#85847C; --line:rgba(255,255,255,.12);--line2:rgba(255,255,255,.26); --gold:#F9E78C;--goud:#D0AD67;--gold-bg:rgba(249,231,140,.10);--gold-line:rgba(249,231,140,.34); --red:#FF9B85;--green:#9AD9A4; --foto-ink:#14170F;--foto-soft:#2E3127; /* tekst los op de foto */ --g:linear-gradient(143deg,#D0AD67 2%,#F9E78C 16%,#F8F6C2 23%,#F9E78C 32%,#D0AD67 65%,#492926 108%); --sans:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; --kop:Poppins,Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; --shadow:0 12px 32px rgba(0,0,0,.25); background:transparent;color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.55} /* ---------- Pagina: geen effen vlak, de foto (body::before) schijnt door ---------- */ html:has(#ws_root){background:#F5F2EA!important} body:has(#ws_root){background:transparent!important} section.bg-white:has(.ws-root),section:has(#ws_root){background:transparent!important} .ws-root #v_tickets,.ws-root #v_inzicht,.ws-root #v_bestelling,.ws-root .ws-sec,.ws-root .ws-sec[style*="background:#fff"],.ws-root .ws-view{background:transparent!important} /* ---------- Lettertype en kleuren die de site (Umbraco) eroverheen zet ---------- */ .ws-root.ws-root.ws-root :is(p,li,span,a,button,label,input,select,textarea,b,strong,em,small,td,th,blockquote,figcaption,summary,code){font-family:var(--sans)!important} .ws-root.ws-root.ws-root :is(h1,h2,h3,h4){font-family:var(--kop)!important} .ws-root.ws-root.ws-root .ws-aw,.ws-root.ws-root.ws-root .ws-aw *{font-family:Inter,system-ui,sans-serif!important} .ws-root.ws-root.ws-root code{font-family:ui-monospace,Menlo,monospace!important} .ws-root li{color:inherit!important} .ws-root :where(p){color:inherit!important} .ws-root a{color:var(--gold)!important;text-underline-offset:3px} .ws-root b,.ws-root strong{color:inherit} /* ---------- Koppen ---------- */ .ws-root.ws-root h1,.ws-root.ws-root h2,.ws-root.ws-root h3{color:var(--ink)!important;text-transform:none!important;letter-spacing:-.005em!important;line-height:1.25!important;text-wrap:balance} .ws-root.ws-root h1{font-size:26px!important;font-weight:700!important} .ws-root.ws-root h2{font-size:20px!important;font-weight:700!important} .ws-root.ws-root h3{font-size:17px!important;font-weight:700!important} .ws-root .ws-h2{margin:24px 0 4px!important} /* Kleine labels */ .ws-root .ws-eye,.ws-root .dn-eye,.ws-root .ws-portaal-eye{font-size:11px!important;font-weight:700!important;letter-spacing:.12em!important;text-transform:uppercase;color:var(--gold)!important} /* ---------- Teststrook en datumband ---------- */ .ws-root .ws-test{background:transparent;color:var(--foto-ink);font-weight:500;font-size:13px;padding:12px 16px 0;text-align:center;display:block;max-width:1100px;margin:0 auto} .ws-root .ws-test code{background:#0b0b0b;color:var(--gold);border-radius:999px;padding:1px 8px;font-weight:600;font-size:12px;white-space:nowrap} .ws-root .ws-strip{background:#0b0b0b;color:#F5F2EA;border:1px solid rgba(249,231,140,.35);border-radius:999px;font-size:13px;font-weight:600;letter-spacing:.02em;text-transform:none;padding:6px 14px;display:table;margin:12px auto 0} .ws-root .ws-strip b{color:var(--gold);font-weight:700} /* ---------- Bovenbalk in de stappen (los op de foto: donkere tekst) ---------- */ .ws-root .ws-tabs{background:transparent;border-bottom:1px solid rgba(20,23,15,.14)} .ws-root .ws-back{color:var(--foto-ink)!important;font-size:14px;font-weight:600;text-shadow:0 1px 0 rgba(255,255,255,.6)} .ws-root .ws-who{color:var(--foto-soft)!important;text-shadow:0 1px 0 rgba(255,255,255,.6)} .ws-root .ws-tab{background:#0b0b0b;color:#F5F2EA;border:1px solid #0b0b0b;border-radius:999px;height:38px;padding:0 16px;font-size:14px;font-weight:500;text-transform:none;letter-spacing:0} .ws-root .ws-tab[aria-current=page]{background:var(--g);color:#14170F;border-color:transparent;font-weight:700} /* ---------- De winnaarskaart: alle kaarten van de app ---------- */ .ws-root .ws-hero .ws-hl,.ws-root .ws-panel,.ws-root .ws-side,.ws-root #ws_awtop,.ws-root .ws-card,.ws-root .ws-plan,.ws-root .ws-band,.ws-root .ws-portaal{ background:var(--card);border:0;border-radius:20px;box-shadow:var(--shadow);color:var(--soft)} /* ---------- Startscherm: één donkere kaart met code, routes en tellers ---------- */ .ws-root .ws-hero{background:transparent;color:var(--ink);padding:28px 0 48px;overflow:visible} .ws-root .ws-hero .ws-in{align-items:flex-start} .ws-root .ws-hero .ws-hl{padding:26px 24px 24px!important;gap:14px;flex:0 1 560px} .ws-root .ws-hero h1{font-size:26px!important} .ws-root .ws-lead,.ws-root .ws-lead2{color:var(--soft)!important;font-size:15px!important} .ws-root .ws-codebox label{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)} .ws-root .ws-code input{height:50px;background:rgba(255,255,255,.07);color:#fff;border:1px solid var(--line2);border-radius:999px;padding:0 20px;font-size:16px;letter-spacing:.14em} .ws-root .ws-code input::placeholder{color:var(--faint);letter-spacing:.06em} .ws-root .ws-code input:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--line2)} .ws-root .ws-kwijt,.ws-root p.ws-kwijt{color:var(--muted)!important;font-size:13.5px;margin:0} .ws-root .ws-routes{border-top:1px solid var(--line);padding-top:14px;margin-top:2px} .ws-root .ws-start{background:var(--gold-bg);border:1px solid var(--gold-line);border-left:1px solid var(--gold-line);border-radius:14px;color:var(--ink)!important} .ws-root .ws-start b{color:var(--gold)} /* Tellers */ .ws-root .ws-scar,.ws-root .ws-scar2{background:var(--card2);border:1px solid var(--line);border-radius:16px;color:var(--ink);padding:16px;gap:12px} .ws-root .ws-tel2{gap:18px} .ws-root .ws-tel,.ws-root .ws-scar2 .ws-tel{border:0;padding:0;gap:6px} .ws-root .ws-tel-kop,.ws-root .ws-scar2 .ws-tel-kop{font-size:13px;color:var(--soft);font-weight:500} .ws-root .ws-tel-kop b{color:var(--ink);font-size:14px} .ws-root .ws-big,.ws-root .ws-scar2 .ws-big{font-size:24px!important;font-weight:700;color:#fff;letter-spacing:-.01em;font-family:var(--kop)!important} .ws-root .ws-sm{color:var(--muted)} .ws-root .ws-bar{height:4px;background:rgba(255,255,255,.14);border-radius:999px} .ws-root .ws-bar i{height:4px;background:var(--g);border-radius:999px} .ws-root .ws-tel-label{background:var(--gold-bg);color:var(--gold);border:1px solid var(--gold-line);font-size:11px;font-weight:600;letter-spacing:.04em;padding:2px 8px} .ws-root .ws-dl,.ws-root p.ws-dl{color:var(--muted)!important;font-size:12.5px} .ws-root .ws-tel-prijs{color:var(--gold)} .ws-root .ws-deadlines b{color:var(--gold)} .ws-root .ws-deadlines span{color:var(--soft)} /* ---------- Knoppen: goud verloop als pil, tweede knop met gouden rand ---------- */ .ws-root .ws-btn,.ws-root a.ws-btn{background:var(--g);color:#14170F!important;border:0;border-radius:999px;min-height:48px;padding:0 24px;font-family:var(--kop)!important;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;box-shadow:none} .ws-root .ws-btn.ws-light{background:var(--g);color:#14170F!important;border:0} .ws-root .ws-btn.ws-ghost,.ws-root .ws-btn.dn-terug{background:transparent;color:#fff!important;border:1.5px solid var(--goud)} .ws-root .ws-btn:not([disabled]):hover{filter:brightness(1.05)} .ws-root .ws-btn.ws-ghost:not([disabled]):hover,.ws-root .ws-btn.dn-terug:not([disabled]):hover{background:rgba(249,231,140,.08);filter:none} .ws-root .ws-btn[disabled]{opacity:.45} .ws-root .ws-routes-knoppen .ws-btn{min-height:42px!important;padding:0 18px!important;font-size:12.5px!important} .ws-root .ws-link{color:var(--gold)!important;text-decoration:underline;text-underline-offset:3px;font-size:14px} .ws-root .ws-link:hover{color:#fff!important} .ws-root :focus-visible{outline:2px solid var(--gold);outline-offset:2px} /* Plus en min */ .ws-root .ws-step,.ws-root .ws-step.ws-plus{width:40px;height:40px;background:rgba(255,255,255,.06);color:#fff;border:1px solid var(--line2);border-radius:999px;font-size:18px} .ws-root .ws-step:not([disabled]):hover{border-color:var(--gold)} /* Keuzes als chips: gekozen = goud */ .ws-root .ws-tog{background:rgba(255,255,255,.06);color:#fff;border:1px solid var(--line2);border-radius:999px;min-height:40px;padding:0 16px;font-size:14px;font-weight:500} .ws-root .ws-tog[aria-pressed=true]{background:var(--g);color:#14170F;border-color:transparent;font-weight:700} .ws-root .ws-tog.ws-up{background:rgba(255,255,255,.06);color:#fff;border:1px solid var(--line2);border-radius:999px;min-height:40px;padding:0 14px 0 8px;font-weight:500} .ws-root .ws-tog.ws-up b{color:var(--gold);font-weight:700} .ws-root .ws-tog.ws-up .ws-up-v{border:1.5px solid var(--line2);border-radius:50%;background:transparent} .ws-root .ws-tog.ws-up[aria-pressed=true]{background:var(--g);border-color:transparent;color:#14170F} .ws-root .ws-tog.ws-up[aria-pressed=true] b{color:#14170F} .ws-root .ws-tog.ws-up[aria-pressed=true] .ws-up-v{border-color:#14170F;background:#14170F url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8l3 3 7-7' stroke='%23F9E78C' stroke-width='2.5' fill='none'/%3E%3C/svg%3E") center/11px no-repeat} .ws-root .ws-tog.ws-up:hover{border-color:var(--gold)} .ws-root .ws-seg{border:1px solid var(--line2);border-radius:999px;background:rgba(255,255,255,.05);padding:3px;gap:2px;align-self:flex-start;width:max-content;max-width:100%} .ws-root .ws-seg button{background:transparent;color:var(--soft);border-radius:999px;padding:8px 16px;font-weight:500;font-size:14px} .ws-root .ws-seg button[aria-pressed=true]{background:var(--g);color:#14170F;font-weight:700} .ws-root .dn-chip{background:rgba(255,255,255,.06);color:#fff;border:1px solid var(--line2);border-radius:999px;font-size:14px;padding:6px 14px 6px 7px;gap:7px} .ws-root .dn-chip input{-webkit-appearance:none;appearance:none;width:18px;height:18px;margin:0;border:1.5px solid var(--line2);border-radius:50%;background:transparent;flex:none;cursor:pointer} .ws-root .dn-chip input:checked{border-color:#14170F;background:#14170F url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8l3 3 7-7' stroke='%23F9E78C' stroke-width='2.5' fill='none'/%3E%3C/svg%3E") center/11px no-repeat} .ws-root .dn-chip input:focus-visible{outline:2px solid var(--gold);outline-offset:2px} .ws-root .dn-chip:has(input:checked){background:var(--g);color:#14170F;border-color:transparent} /* Gouden pillen en linten */ .ws-root .ws-pill,.ws-root .ws-lvl,.ws-root .ws-badge{background:var(--gold-bg);color:var(--gold);border:1px solid var(--gold-line);border-radius:999px;font-weight:600} .ws-root .ws-lint{background:var(--g);color:#14170F;border:0;border-radius:999px;font-weight:700;letter-spacing:.08em} .ws-root .ws-tag,.ws-root .ws-dark .ws-tag,.ws-root .ws-moment .ws-tag,.ws-root .ws-choice .ws-tag{color:var(--gold)!important;font-weight:700;letter-spacing:.06em} .ws-root .ws-price,.ws-root .ws-card.ws-dark .ws-price{color:#fff!important;font-weight:700;font-family:var(--kop)!important} .ws-root .ws-note,.ws-root .ws-dark .ws-note{color:var(--muted)!important} .ws-root .ws-was{color:var(--muted)} /* ---------- Stappen: voortgang los op de foto ---------- */ .ws-root [style*="background:#fff;border-bottom"]{background:transparent!important;border-bottom:0!important} .ws-root .ws-prog{padding:18px 0 2px;gap:6px 16px;font-size:13px} .ws-root .ws-prog li{color:var(--foto-soft)!important;gap:7px;text-shadow:0 1px 0 rgba(255,255,255,.6)} .ws-root .ws-prog li span{width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.7);border:1px solid rgba(20,23,15,.25);color:var(--foto-ink);font-size:11px;font-weight:700;text-shadow:none} .ws-root .ws-prog li.ws-on{color:var(--foto-ink)!important;font-weight:700} .ws-root .ws-prog li.ws-on span{background:#0b0b0b;border-color:#0b0b0b;color:var(--gold)} .ws-root .dn-prog .dn-klaar{color:var(--green)} .ws-root .ws-prog2{border-left:2px solid var(--line2)} .ws-root .ws-prog2 b{color:var(--gold)} .ws-root .ws-sec{padding:28px 0 56px} /* Paneel en winkelmand */ .ws-root .ws-flow{padding:20px 0 56px;gap:20px} .ws-root .ws-panel{padding:28px} .ws-root .ws-side{padding:22px} .ws-root .ws-side>b:first-child{font-size:17px!important;font-weight:700;color:#fff;font-family:var(--kop)!important} .ws-root .ws-lines{color:var(--soft)} .ws-root .ws-lines li,.ws-root .ws-sum{color:var(--soft);border-color:var(--line)} .ws-root .ws-lines li b{color:#fff} .ws-root .ws-lines li.ws-korting b,.ws-root .ws-lines li.ws-korting span{color:var(--green)} .ws-root .ws-sub{color:var(--muted)} .ws-root .ws-sum .ws-tot,.ws-root .ws-sum .ws-tot span:last-child{color:#fff;font-size:20px;font-weight:700} .ws-root .ws-navtot{color:#fff;font-weight:700} .ws-root .ws-nav{background:transparent;border-top:1px solid var(--line)} /* Binnenblokken in een kaart */ .ws-root .ws-row,.ws-root .ws-choice,.ws-root .ws-extra,.ws-root .ws-awr,.ws-root .ws-awblok,.ws-root .ws-kitblok,.ws-root .ws-adresblok, .ws-root .ws-awnaam-dicht,.ws-root .ws-awhero,.ws-root .ws-col-aw,.ws-root .ws-moment,.ws-root .ws-info,.ws-root .dn-mee,.ws-root .dn-gast, .ws-root .dn-ticket,.ws-root .ws-tk,.ws-root .kv-tekst,.ws-root .ws-zoekres button,.ws-root .ws-preview,.ws-root blockquote{ background:var(--card2);border:1px solid var(--line);border-radius:16px;color:var(--soft);box-shadow:none} .ws-root .ws-awhero-lijst .ws-awr2{background:var(--card2)} .ws-root .ws-awblok{background:var(--card2)} .ws-root .ws-awblok .ws-awr2{background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0} .ws-root .ws-awblok .ws-awr2:last-child{border-bottom:0} .ws-root .ws-awr2{border:1px solid var(--line);background:var(--card2);border-radius:14px;color:var(--soft)} .ws-root .ws-awr2.ws-awr-aan{border-color:var(--line2)} .ws-root .ws-awr2.ws-awr-zie{border-color:var(--goud)} .ws-root .ws-awblok .ws-awr2.ws-awr-zie{background:var(--gold-bg);box-shadow:inset 3px 0 0 var(--goud);border-color:var(--line)} .ws-root .ws-awr2-kies{color:#fff} .ws-root .ws-awr2-kies:focus-visible{outline:2px solid var(--gold)} .ws-root .ws-awr2-box{border:1.5px solid var(--line2);border-radius:50%;background:transparent;color:#14170F;font-size:11px} .ws-root .ws-awr2.ws-awr-aan .ws-awr2-box{border-color:var(--gold);background:var(--gold)} .ws-root .ws-awok{color:#fff} /* Willem 2026-11-02: rood als je doorklikt zonder dat de tekst akkoord is; weg zodra je het aanvinkt. */ .ws-root .ws-awok.ws-awok-fout:not(:has(input:checked)){color:#FF8A80} .ws-root .ws-awok.ws-awok-fout:not(:has(input:checked)) input{outline:2px solid #FF6B5E;outline-offset:2px;border-radius:3px} .ws-root .ws-awok input,.ws-root .ws-check input,.ws-root .dn-check input{accent-color:#D0AD67} .ws-root .ws-check{color:var(--soft)} /* Keuzekaarten in de stappen: als kleine winnaarskaart, gekozen = gouden rand */ .ws-root .ws-choice{border:1px solid var(--line);padding:18px 20px;color:var(--soft)} .ws-root .ws-choice:hover{border-color:var(--line2)} .ws-root .ws-row.ws-sel,.ws-root .ws-choice[aria-pressed=true]{border:1px solid var(--gold);box-shadow:0 0 0 1px var(--gold);background:rgba(249,231,140,.06)} .ws-root .ws-choice[aria-pressed=true]:hover{border-color:var(--gold)} .ws-root .ws-choice .ws-chead,.ws-root .ws-choice .ws-chead b,.ws-root .ws-choice b{color:#fff} .ws-root .ws-choice small{color:var(--soft)} .ws-root .ws-choice .ws-chead>span:first-child::before{border:1.5px solid var(--line2);background:transparent} .ws-root .ws-choice[aria-pressed=true] .ws-chead>span:first-child::before{border-color:var(--gold);background:radial-gradient(circle,var(--gold) 0 42%,transparent 47%)} /* Opsommingen in de keuzekaarten en kaarten: gouden vinkjes */ .ws-root .ws-choice ul,.ws-root .ws-ben{list-style:none;padding-left:0} .ws-root .ws-choice ul li,.ws-root .ws-ben li,.ws-root .ws-sub li{list-style:none;position:relative;padding-left:22px;color:var(--soft)} .ws-root .ws-choice ul li::before,.ws-root .ws-ben li::before,.ws-root .ws-sub li::before{content:"\2713";position:absolute;left:0;top:0;width:auto;height:auto;border-radius:0;background:none;font-weight:700;color:var(--gold)} .ws-root .ws-row[style*="border:2px solid #000"]{border:1px solid var(--gold)!important;background:var(--card2)!important} .ws-root [style*="background:#000;color:#fff;border-radius:12px"]{background:var(--gold-bg)!important;color:var(--gold)!important;border:1px solid var(--gold-line)} .ws-root [style*="color:#3A3B40"],.ws-root [style*="color:#3a3b40"]{color:var(--soft)!important} .ws-root [style*="color:#000"]{color:var(--ink)!important} .ws-root .ws-grow{color:var(--muted)} .ws-root .ws-grow b{color:#fff} .ws-root .ws-sm2,.ws-root p.ws-sm2{color:var(--muted)!important} .ws-root .ws-zoom{color:var(--muted)} .ws-root .ws-up-blok{border:1px dashed var(--line2);background:var(--card2)} .ws-root .ws-info{color:var(--soft)} .ws-root .ws-info b{color:#fff} .ws-root .ws-extra-uit{opacity:.6} .ws-root .ws-adresblok span{color:var(--soft)} .ws-root .ws-kitblok b,.ws-root .ws-awnaam-dicht b,.ws-root .ws-awr-txt b{color:#fff} /* Kaarten in de app (.ws-card, .ws-plan): kop wit, prijs en knop onderaan */ .ws-root .ws-card.ws-dark,.ws-root .ws-plan.ws-best{background:var(--card);border:0} .ws-root .ws-card.ws-dark h3,.ws-root .ws-card.ws-dark p{color:#fff!important} .ws-root .ws-kv{border-top:0} .ws-root .ws-band h2,.ws-root .ws-band b{color:#fff!important} .ws-root .ws-band p{color:var(--soft)!important} .ws-root .ws-steps li{border-top:2px solid var(--line2);color:var(--soft)} .ws-root .ws-steps b{color:#fff} .ws-root .ws-twee-sec p.ws-sm{color:var(--muted)!important} /* Award bovenaan de stappen (#ws_awtop) en de stap Awards; de award zelf blijft zoals hij is */ .ws-root #ws_awtop .ws-awtop-tekst b{color:#fff;font-size:21px;font-weight:700;font-family:var(--kop)!important} .ws-root #ws_awtop .ws-awtop-tekst span{color:var(--soft)} .ws-root #ws_awtop figcaption,.ws-root .ws-awhero-fotos figcaption{color:var(--muted)} .ws-root .ws-awhero{color:var(--soft)} .ws-root .ws-awhero-tekst b,.ws-root .ws-awhero2 .ws-awhero-tekst b{color:#fff;font-weight:700} .ws-root .ws-awhero-tekst span{color:var(--soft)} .ws-root .ws-col-aw{box-shadow:none} .ws-root .ws-col-aw>div:last-child>b{color:#fff} .ws-root .ws-col-aw>div:last-child>span{color:var(--soft)} .ws-root .ws-hfoto img,.ws-root .ws-collage .ws-col img.ws-col-groot{box-shadow:var(--shadow)} .ws-root .ws-hfoto figcaption,.ws-root .ws-collage figcaption b{color:var(--muted)} .ws-root .ws-aw{box-shadow:0 8px 20px -10px rgba(0,0,0,.6)} .ws-root .ws-opmd summary,.ws-root .ws-det summary{color:var(--gold);text-decoration:underline;text-underline-offset:3px} .ws-root .ws-det summary i{color:var(--muted)} /* ---------- Velden ---------- */ .ws-root .ws-l,.ws-root .ws-form label,.ws-root .dn-f label,.ws-root .ws-zoekbox label{color:#fff;font-size:13.5px;font-weight:600} .ws-root .ws-l i{color:var(--muted)} .ws-root .ws-form input,.ws-root .ws-tick input,.ws-root .ws-l input,.ws-root .ws-l select,.ws-root .ws-ta,.ws-root .ws-opmd textarea, .ws-root .dn-f input,.ws-root .dn-f textarea,.ws-root .dn-f select,.ws-root .ws-zoekbox input,.ws-root textarea.ws-opm{ background:rgba(255,255,255,.07);color:#fff;border:1px solid var(--line2);border-radius:12px;font-size:16px} .ws-root select option{background:#1b1b1b;color:#fff} .ws-root .ws-form input:focus,.ws-root .ws-tick input:focus,.ws-root .ws-l input:focus,.ws-root .ws-l select:focus,.ws-root .ws-ta:focus,.ws-root .ws-opmd textarea:focus, .ws-root .dn-f input:focus,.ws-root .dn-f textarea:focus,.ws-root .dn-f select:focus,.ws-root .ws-zoekbox input:focus,.ws-root textarea.ws-opm:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--line2)} .ws-root ::placeholder{color:var(--faint)} .ws-root input:-webkit-autofill{-webkit-text-fill-color:#fff;-webkit-box-shadow:0 0 0 40px #262626 inset} .ws-root .ws-form input[aria-invalid=true],.ws-root .ws-l input[aria-invalid=true]{border:1.5px solid var(--red)} .ws-root .ws-err,.ws-root .ws-hero .ws-err,.ws-root p.ws-err{color:var(--red)!important} .ws-root .dn-f small,.ws-root .dn-ticket small{color:var(--muted)!important} /* ---------- Tabel, tickets ---------- */ .ws-root th{color:var(--muted);border-color:var(--line)} .ws-root td{color:var(--soft);border-color:var(--line)} .ws-root .ws-tk small{color:var(--muted)} .ws-root .ws-tk code{color:#fff} .ws-root .ws-thumb{background:#0b0b0b} /* ---------- Vakjurydiner, toegang aanvragen, Mijn avond ---------- */ .ws-root #ws_diner p,.ws-root #ws_aanvragen p,.ws-root #ws_avond p{opacity:1} #v_diner .ws-panel>div>p,#v_aanvragen .ws-panel p{color:var(--soft)!important} #v_diner .ws-panel p.ws-err,#v_aanvragen .ws-panel p.ws-err{color:var(--red)!important} .ws-root .dn-nav{border-top:1px solid var(--line)} .ws-root .dn-melding{background:var(--gold-bg);border:1px solid var(--gold-line);border-left:1px solid var(--gold-line);border-radius:14px;color:var(--soft)} .ws-root .dn-ticket{border:1px solid var(--line)} .ws-root .dn-ticket b,.ws-root .dn-ticket span{color:#fff!important} .ws-root .dn-ticket img{border-radius:8px;background:#fff} .ws-root .dn-foto img,.ws-root .dn-foto span,.ws-root .dn-gast img,.ws-root .dn-av{background:var(--gold-bg);color:var(--gold)} .ws-root .dn-mee{border-color:var(--line)} /* ---------- Winnaarsportaal-blok in de bedankpagina ---------- */ .ws-root .ws-portaal{box-shadow:inset 0 0 0 1.5px var(--goud),var(--shadow)} .ws-root .ws-portaal p{color:var(--soft)!important} .ws-root .ws-portaal-f small{color:var(--muted)!important} /* ---------- Social kit (venster) ---------- */ .ws-root .kv-modal{background:rgba(0,0,0,.6)} .ws-root .kv-doos{background:var(--card);border:0;border-radius:20px;box-shadow:0 30px 80px -30px rgba(0,0,0,.7);color:var(--soft)} .ws-root .kv-g{color:#fff} .ws-root .kv-kanaal{border-top:1px solid var(--line)} .ws-root .kv-bul{color:var(--soft)} .ws-root .kv-bul li b,.ws-root .kv-item figcaption b,.ws-root .kv-tekst b{color:#fff} .ws-root .kv-bul li span,.ws-root .kv-item figcaption{color:var(--muted)} .ws-root .kv-p,.ws-root .kv-tekst p{color:var(--soft)!important} .ws-root .kv-tekst{color:var(--soft)} .ws-root .kv-beelden img,.ws-root .kv-item img{border:1px solid var(--line)} /* ---------- Zoeken (oud, staat uit) ---------- */ .ws-root .ws-zoekres button:hover{border-color:var(--line2)} .ws-root .ws-zoekres small{color:var(--muted)} /* ---------- Telefoon ---------- */ @media (max-width:900px){ .ws-root .ws-nav{background:var(--card3);border-top:1px solid var(--line);box-shadow:0 -10px 24px -12px rgba(0,0,0,.5);border-radius:0 0 20px 20px} .ws-root .ws-hero .ws-hl{flex:1 1 100%} } @media (max-width:640px){ .ws-root .ws-hero{padding:16px 0 32px} .ws-root .ws-hero .ws-hl{padding:20px 18px!important;border-radius:18px} .ws-root .ws-panel,.ws-root .ws-side,.ws-root #ws_awtop{border-radius:18px} .ws-root .ws-panel{padding:20px 18px} .ws-root .ws-in{padding-left:16px;padding-right:16px} .ws-root .ws-tel2{gap:14px} } @media (max-width:480px){ #ws_root h1{font-size:22px!important} } /* Willem 2026-11-01: datum en locatie als gewone regel onder de titel (geen zwarte balk), en een dunne gouden rand om elke donkere kaart, zodat kaarten, knoppen en labels één geheel zijn. */ html.ws-pagina .ws-introtekst .ws-datum{margin:6px 0 10px;font-size:16px;color:#000!important;font-weight:700;background:none;padding:0;text-shadow:0 0 12px rgba(245,242,234,.9)} html.ws-pagina .ws-introtekst .ws-datum :is(strong,b){color:#000!important;font-weight:700} /* Willem 2026-11-02: "zwart bold", goud was slecht zichtbaar */ html.ws-pagina .ws-band{display:none!important} html.ws-pagina .ws-kaart>.grid{border:1px solid rgba(208,173,103,.55)!important} html.ws-pagina .ws-root .ws-hero .ws-hl,html.ws-pagina .ws-root .ws-panel,html.ws-pagina .ws-root .ws-side{border:1px solid rgba(208,173,103,.55)} /* Stemmersinzicht: twee prijzen naast elkaar, even groot (Willem 2026-11-01). */ html.ws-pagina .ws-kaart .ws-tweeprijs{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px} html.ws-pagina .ws-kaart .ws-tweeprijs .ws-tpvoet{flex-basis:100%;color:#BDBAB0!important;font-size:13px} html.ws-pagina .ws-kaart .ws-tweeprijs .ws-tp{color:#D9D6CC;font-size:14px;white-space:nowrap} html.ws-pagina .ws-kaart .ws-tweeprijs .ws-tp strong{font-size:26px;margin-right:4px;color:#fff!important} /* Vrije plaatsen in de kaart zelf, net boven de prijs (Willem 2026-11-01). */ html.ws-pagina section[title] .ws-kaart .component-richEditor p.ws-vrij{display:inline-flex!important;align-self:flex-start;align-items:center;gap:8px;margin:auto 0 12px!important;padding:5px 12px;border:1px solid rgba(208,173,103,.55);border-radius:999px;font-size:13px;line-height:1.3;color:#E9D9AE!important;min-height:0} html.ws-pagina section[title] .ws-kaart .component-richEditor p.ws-vrij+p{margin-top:0!important} html.ws-pagina section[title] .ws-kaart .component-richEditor p.ws-vrij::before{content:'';width:7px;height:7px;border-radius:50%;background:#7BC67E;flex:none} html.ws-pagina section[title] .ws-kaart .component-richEditor p.ws-vrij b{color:#fff!important;font-weight:700} html.ws-pagina section[title] .ws-kaart .component-richEditor p.ws-vrij.ws-vrij-op::before{background:#C9574A} html.ws-pagina section[title] .ws-kaart .component-richEditor p.ws-vrij[hidden]{display:none!important} /* Eén plek voor de code: geen codevak bovenaan, het codeveld in de kaart (Willem 2026-11-01). */ html.ws-pagina #v_shop .ws-hl.ws-hl-weg{display:none!important} html.ws-pagina .ws-introtekst .ws-dl-intro{margin:14px 0 0;font-size:13px;color:#2E3127!important;text-shadow:0 0 12px rgba(245,242,234,.9)} html.ws-pagina .ws-kaart .ws-kaartcode{display:flex;flex-direction:column;gap:8px;margin:0} html.ws-pagina .ws-kaart .ws-kaartcode label{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#E9D9AE} html.ws-pagina .ws-kaart .ws-kc{display:flex;gap:8px} html.ws-pagina .ws-kaart .ws-kc input{flex:1 1 auto;min-width:0;height:48px;padding:0 18px;border-radius:999px;border:1px solid rgba(208,173,103,.55);background:#222;color:#fff;font-size:16px;letter-spacing:.06em;text-transform:uppercase;outline:none} html.ws-pagina .ws-kaart .ws-kc input:focus{border-color:#F9E78C;box-shadow:0 0 0 3px rgba(249,231,140,.2)} html.ws-pagina .ws-kaart .ws-kc input::placeholder{color:#8C8A84;text-transform:uppercase} html.ws-pagina .ws-kaart .ws-kc button{flex:none;height:48px;padding:0 20px;border:0;border-radius:999px;background:linear-gradient(143deg,#D0AD67 2%,#F9E78C 16%,#F8F6C2 23%,#F9E78C 32%,#D0AD67 65%,#492926 108%);color:#14170F;font-family:Poppins,Inter,sans-serif;font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer} html.ws-pagina .ws-kaart .ws-kc button:disabled{opacity:.6;cursor:wait} html.ws-pagina section[title] .ws-kaart .ws-kaartcode p.ws-kc-err{margin:0;font-size:13px;color:#F2A69C!important} html.ws-pagina section[title] .ws-kaart .ws-kaartcode p.ws-kc-err[hidden]{display:none!important} html.ws-pagina section[title] .ws-kaart .ws-kaartcode p.ws-kc-kwijt{margin:0;font-size:12px;color:#A9A9A9!important} html.ws-pagina section[title] .ws-kaart .ws-kaartcode p.ws-kc-kwijt a{color:#E9D9AE!important} /* Kop zonder codevak (Willem 2026-11-01, "dit ziet er toch raar uit?"): tekst verticaal midden naast de foto's, twee knoppen onder de intro, minder ruimte tot de kaarten, "Prijzen excl. btw" direct onder de sectiekop. */ html.ws-pagina .ws-appsectie .ws-appbox{justify-content:center!important} html.ws-pagina:not(.ws-flow-aan) .ws-appsectie>.z-10{padding-bottom:40px!important} html.ws-pagina section[title]:has(.ws-kaart)>.z-10{padding-top:40px!important} html.ws-pagina .ws-introtekst .ws-hero-knoppen{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 4px} html.ws-pagina .ws-introtekst a.ws-hk{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 26px;border-radius:999px;font-family:Poppins,Inter,sans-serif!important;font-weight:700;font-size:14px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none!important;box-sizing:border-box;cursor:pointer} html.ws-pagina .ws-introtekst a.ws-hk-code{background:linear-gradient(143deg,#D0AD67 2%,#F9E78C 16%,#F8F6C2 23%,#F9E78C 32%,#D0AD67 65%,#492926 108%);color:#14170F!important;box-shadow:0 8px 20px rgba(0,0,0,.18)} html.ws-pagina .ws-introtekst a.ws-hk-rand{background:#0b0b0b;color:#F9E78C!important;border:1px solid #D0AD67} html.ws-pagina .ws-introtekst a.ws-hk:hover{filter:brightness(1.06)} html.ws-pagina section[title]:has(.ws-kaart) .container>.grid>.ws-sectiekop{display:block!important} html.ws-pagina section[title] .ws-sectiekop p{margin:6px 0 0!important;font-size:13px!important;font-weight:500!important} @media (max-width:640px){html.ws-pagina .ws-introtekst .ws-hero-knoppen{flex-direction:column}html.ws-pagina .ws-introtekst a.ws-hk{width:100%}} /* Ontwerpcontrole van alle stappen (Willem 2026-11-01: "ook kan je de stappen niet meer zien"). */ /* 1. De koppen in de app vielen onder de regel voor koppen op de foto (donker) en waren onzichtbaar op de donkere panelen. */ html.ws-pagina section[title] .component-richEditor .ws-root.ws-root :is(h1,h2,h3){color:var(--ink)!important;font-family:Poppins,Inter,sans-serif!important;text-shadow:none} /* 2. De stappenbalk staat op de foto: donkere tekst met een lichte gloed, de huidige stap vet. */ html.ws-pagina section[title] .component-richEditor .ws-root .ws-prog li{color:#2E3127!important;text-shadow:0 0 10px rgba(245,242,234,.95),0 0 2px rgba(245,242,234,.9)} html.ws-pagina section[title] .component-richEditor .ws-root .ws-prog li.ws-on{color:#14170F!important;font-weight:700} html.ws-pagina section[title] .component-richEditor .ws-root .ws-prog li span{text-shadow:none} /* 4. Bestelling ernaast alleen als er ruimte is; anders eronder. Niets steekt rechts buiten beeld. */ html.ws-pagina .ws-root .ws-flow:has(>.ws-side){display:grid!important;grid-template-columns:minmax(0,1fr) minmax(260px,340px);align-items:start} html.ws-pagina .ws-root .ws-flow>*{min-width:0;max-width:100%;box-sizing:border-box} @media (max-width:1099px){html.ws-pagina .ws-root .ws-flow:has(>.ws-side){grid-template-columns:minmax(0,1fr)}html.ws-pagina .ws-root .ws-flow>.ws-side{position:static!important}} /* 6. Het codeveld in de kaart is net zo hoog als de knop die het vervangt, zodat prijzen en knoppen op één lijn blijven. */ html.ws-pagina .ws-kaart .ws-kaartcode{position:relative;margin-top:16px!important} html.ws-pagina .ws-kaart .ws-kaartcode .ws-kc-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)} html.ws-pagina section[title] .ws-kaart .ws-kaartcode p.ws-kc-kwijt{position:absolute;left:0;right:0;top:100%;margin-top:4px!important;font-size:11.5px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} html.ws-pagina section[title] .ws-kaart .ws-kaartcode p.ws-kc-err{order:2} /* 8. "Terug naar het overzicht" niet tegen de vaste kop aan. */ html.ws-pagina .ws-root .ws-tabs .ws-in{padding-top:20px} /* 9. Aanvraag vakjurydiner in het midden, zoals Mijn avond. */ html.ws-pagina .ws-root #v_aanvragen .ws-flow{display:block} html.ws-pagina .ws-root #ws_aanvragen{margin:0 auto} /* Vensters (voorbeeld social kit, award vergroten) staan in de webshop-app in het bovenste blok; het blok met de kaarten kwam daar overheen (Willem 2026-11-01). Zolang er een venster open is, ligt dat blok boven alles en scrolt de pagina niet. */ html.ws-pagina section[title]:has(.kv-modal),html.ws-pagina section[title]:has(.kv-modal)>.z-10{position:relative;z-index:10000!important} html.ws-pagina:has(.kv-modal),html.ws-pagina:has(.kv-modal) body{overflow:hidden!important} /* Testronde 2026-11-02. 1. Codeveld in de kaart op een smalle telefoon: een echte code (NHP-AB12-CD34) paste niet in het veld naast de knop (137 px op 375 px breed, de code vraagt 175 px). Onder 420 px veld en knop onder elkaar, elk de volle breedte. */ @media (max-width:419px){html.ws-pagina .ws-kaart .ws-kc{flex-direction:column}html.ws-pagina .ws-kaart .ws-kc input,html.ws-pagina .ws-kaart .ws-kc button{width:100%;flex:none;box-sizing:border-box}} /* 2. Stemmersinzicht: de app zet de prijs om naar .ws-tweeprijs (spans in plaats van een strong vooraan), waardoor de regel voor prijs en noot onderaan niet meer gold en de prijs ~37 px hoger stond dan bij de buren. Zelfde margin-top:auto en hoogte. */ html.ws-pagina .ws-kaart p.ws-tweeprijs{margin:auto 0 0!important;padding:0;font-size:13px;line-height:1.45;min-height:calc(40px + 2.9em)} @media (min-width:960px) and (max-width:1199px){html.ws-pagina .ws-kaart p.ws-tweeprijs{min-height:calc(40px + 4.35em)}} @media (max-width:959px){html.ws-pagina .ws-kaart p.ws-tweeprijs{min-height:0}} /* 3. Een langere knoptekst ("Bekijk in je Winnaarsportaal") mag op een smalle kaart over twee regels. */ @media (max-width:480px){html.ws-pagina section[title] .ws-kaart .component-button a.button{white-space:normal;text-align:center;line-height:1.25}} /* 4. Voorbeeldfoto onder de award in de stap Awards (Willem 2026-11-02, "foto ja"): even breed als de award, op de telefoon even smal als de award en in het midden. */ .ws-root .ws-awhero2 .ws-awhero-fotos{max-width:100%} @media (max-width:640px){.ws-root .ws-awhero2 .ws-awhero-fotos{max-width:260px;width:100%;margin:0 auto}} /* Eén codeveld onder de intro (Willem 2026-11-02: "1 code veld bovenin 'gebruik code'"): voor winnaarscode en dinercode. */ html.ws-pagina .ws-introtekst .ws-topcode{display:flex;flex-direction:column;gap:8px;margin:22px 0 0;max-width:560px;padding:18px 20px;border-radius:18px;background:#0b0b0b;border:1px solid rgba(208,173,103,.55);box-shadow:0 12px 30px rgba(0,0,0,.18)} html.ws-pagina .ws-introtekst .ws-topcode label{font-family:Poppins,Inter,sans-serif!important;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#E9D9AE!important;margin:0} html.ws-pagina .ws-introtekst .ws-topcode .ws-kc{display:flex;gap:8px} html.ws-pagina .ws-introtekst .ws-topcode input{flex:1 1 auto;min-width:0;height:50px;padding:0 18px;border-radius:999px;border:1px solid rgba(208,173,103,.55);background:#222;color:#fff;font-size:16px;letter-spacing:.06em;text-transform:uppercase;outline:none} html.ws-pagina .ws-introtekst .ws-topcode input:focus{border-color:#F9E78C;box-shadow:0 0 0 3px rgba(249,231,140,.2)} html.ws-pagina .ws-introtekst .ws-topcode input::placeholder{color:#8C8A84} html.ws-pagina .ws-introtekst .ws-topcode button{flex:none;height:50px;padding:0 22px;border:0;border-radius:999px;background:linear-gradient(143deg,#D0AD67 2%,#F9E78C 16%,#F8F6C2 23%,#F9E78C 32%,#D0AD67 65%,#492926 108%);color:#14170F;font-family:Poppins,Inter,sans-serif;font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer} html.ws-pagina .ws-introtekst .ws-topcode button:disabled{opacity:.6;cursor:wait} html.ws-pagina section[title] .ws-introtekst .ws-topcode p{margin:0;font-size:13px;line-height:1.45;color:#C9C6BD!important;text-shadow:none} html.ws-pagina section[title] .ws-introtekst .ws-topcode p.ws-kc-err{color:#F2A69C!important} html.ws-pagina section[title] .ws-introtekst .ws-topcode p[hidden]{display:none!important} html.ws-pagina section[title] .ws-introtekst .ws-topcode p a{color:#E9D9AE!important} html.ws-pagina .ws-introtekst .ws-topcode.ws-tc-licht{animation:wsTcLicht 1.2s ease-out} @keyframes wsTcLicht{0%{box-shadow:0 0 0 0 rgba(249,231,140,.75)}100%{box-shadow:0 0 0 14px rgba(249,231,140,0)}} /* Kaart Vakjurydiner: twee knoppen naast elkaar. */ html.ws-pagina .ws-kaart .ws-dn-knoppen{display:flex;flex-wrap:wrap;gap:10px} html.ws-pagina .ws-kaart .ws-dn-knoppen>*{margin:0!important} @media (max-width:640px){html.ws-pagina .ws-introtekst .ws-topcode{padding:16px}html.ws-pagina .ws-introtekst .ws-topcode .ws-kc{flex-direction:column}html.ws-pagina .ws-introtekst .ws-topcode button{width:100%}} /* Kaart "Ticket uitreiking" (Willem 2026-11-02): het blokje voor winnaars en twee knoppen naast elkaar. */ html.ws-pagina .ws-kaart .ws-winnaarblok{margin:0 0 22px;padding:16px 16px 4px;border-radius:14px;border:1px solid rgba(208,173,103,.45);background:rgba(249,231,140,.06)} html.ws-pagina section[title] .ws-kaart .ws-winnaarblok p.ws-wkop{margin:0;color:#F9E78C!important;font-weight:700;font-size:14px} html.ws-pagina section[title] .ws-kaart .ws-winnaarblok p.ws-wkop :is(strong,b){color:#F9E78C!important;font-size:15px!important;line-height:1.35!important;font-weight:700!important;letter-spacing:0!important;font-family:Inter,sans-serif!important} html.ws-pagina .ws-kaart .ws-winnaarblok ul{margin:10px 0 12px} html.ws-pagina .ws-kaart .ws-knoprij{display:flex;flex-direction:column;align-items:flex-start;gap:10px} /* twee knoppen onder elkaar, zodat Ticket uitreiking en Vakjurydiner gelijk uitlijnen (Willem 2026-11-02) */ html.ws-pagina .ws-kaart .ws-knoprij>*{margin:0!important;width:auto!important} html.ws-pagina .ws-kaart .ws-knoprij>.component-button+.component-button a.button{background:transparent!important;color:#F9E78C!important;border:1px solid #D0AD67!important;box-shadow:none!important} html.ws-pagina .ws-kaart .ws-winnaarblok p.ws-wkop{margin:0!important;min-height:0!important;padding:0!important} html.ws-pagina .ws-kaart .ws-winnaarblok p.ws-wkop>strong:first-child{margin:0!important;display:inline!important} @media (min-width:960px) and (max-width:1199px){html.ws-pagina .ws-kaart .ws-winnaarblok p.ws-wkop{min-height:0!important}} /* Kortingscode bij het afrekenen (Willem 2026-11-02). */ .ws-root .ws-kortingsveld{margin:18px 0 0;display:flex;flex-direction:column;gap:6px} .ws-root .ws-kortingsveld label{font-weight:600;font-size:13px} .ws-root .ws-kortingsveld .ws-kc{display:flex;gap:8px;flex-wrap:wrap} .ws-root .ws-kortingsveld input{flex:1 1 200px;min-width:0;text-transform:uppercase;letter-spacing:.04em} .ws-root .ws-kortingsveld button{flex:none} /* Onder het codeblok, klein en secundair (Willem 2026-11-02). */ html.ws-pagina section[title] .ws-introtekst p.ws-tc-geen{margin:12px 0 0;font-size:14px;color:#2E3127!important;text-shadow:0 0 12px rgba(245,242,234,.9)} html.ws-pagina section[title] .ws-introtekst p.ws-tc-geen a{color:#14170F!important;font-weight:600;text-decoration:underline} /* Awardstap: de keuzeknop per titel op één regel (Willem 2026-11-02, "wordt niet goed weergegeven"). */ html .ws-root .ws-awblok .ws-tog.ws-up{white-space:nowrap!important;width:max-content!important;min-width:max-content!important;max-width:none!important;flex:none!important;display:inline-flex!important;align-items:center;gap:8px} .ws-root .ws-awblok .ws-tog[aria-pressed=true]{background:linear-gradient(143deg,#D0AD67 0%,#F9E78C 35%,#F8F6C2 60%,#F9E78C 85%,#E6C878 100%)!important;color:#14170F!important} /* Kortingscode: hetzelfde veld als de andere velden in Afrekenen, zonder placeholder (Willem: "b"). */ .ws-root .ws-kortingsveld input{min-height:46px;padding:10px 12px;border-radius:10px;border:1px solid #3A3B40;background:#0f1012;color:#fff;font:16px Inter,system-ui,sans-serif;box-sizing:border-box;text-transform:uppercase;letter-spacing:.04em} .ws-root .ws-kortingsveld input:focus{outline:none;border-color:#F9E78C;box-shadow:0 0 0 3px rgba(249,231,140,.2)} .ws-root .ws-kortingsveld .ws-kc{align-items:stretch} .ws-root .ws-kortingsveld .ws-btn{min-height:46px} /* Rechtsboven in de stappen geen "Code … · naam" meer (Willem 2026-11-02: "dit kan weg"); de app gebruikt het veld nog. */ .ws-root #ws_who{display:none!important} /* Willem 2026-11-10: de regels onder "Je bestelling" met vinkjes, net als links; ws-sub zette padding en bolletjes zelf */ .ws-root .ws-sub{padding-left:0} .ws-root .ws-sub li{display:block} /* Willem 2026-11-10: bij het gastticket duidelijk dat er geen fysieke award bij hoort, wit en vet */ .ws-root .ws-geenaward{color:#fff;font-weight:700} /* Na het betalen (Willem 2026-11-10: "graag de styling optimaliseren"): de downloadknoppen op één rij, even hoog, het accountblok als kaart */ .ws-root .dn-knoppen{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 6px} .ws-root .dn-knoppen .ws-btn{margin:0;min-height:48px;display:inline-flex;align-items:center;justify-content:center} .ws-root .dn-account{margin-top:26px;padding:20px 22px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.03)} .ws-root .dn-account .ws-h2{margin-top:0} .ws-root .dn-account .ws-ben{margin:10px 0 16px} .ws-root .dn-account .ws-btn{margin:0} @media (max-width:560px){.ws-root .dn-knoppen .ws-btn{width:100%}} /* Na het betalen, tweede ronde (Willem 2026-11-10: "meer nadruk ... op het aanmaken van een account"): geen QR-codes, het accountblok als hoofdzaak */ .ws-root .dn-lead{font-size:17px;line-height:1.55;color:var(--soft);margin:6px 0 4px;max-width:620px} .ws-root .dn-knoppen .ws-btn.ws-ghost{min-height:44px;font-size:13px} .ws-root .dn-account{margin-top:30px;padding:28px;border:1px solid var(--gold-line,#5A4A22);border-radius:18px;background:linear-gradient(180deg,rgba(237,186,77,.08),rgba(255,255,255,.02))} .ws-root .dn-account .dn-eye{margin:0 0 6px} .ws-root .dn-account p{color:var(--soft);max-width:600px} .ws-root .dn-account-knop{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin:18px 0 0} .ws-root .dn-account-knop small{color:var(--muted,#9A9BA1)} .ws-root .dn-account-knop small a{color:var(--gold,#EDBA4D)} @media (max-width:560px){.ws-root .dn-account{padding:20px}.ws-root .dn-account-knop .ws-btn{width:100%;text-align:center}}