@font-face{font-family:Anton;src:url('assets/Anton.ttf') format('truetype');font-display:swap}
@font-face{font-family:Manrope;src:url('assets/Manrope.ttf') format('truetype');font-display:swap}
:root{--paper:#f6f3eb;--ink:#111;--line:#d6d2c8;--accent:#111}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.6 Manrope,Arial,sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit}button,a,input{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--accent);outline-offset:4px}h1,h2,h3{font-family:Anton,sans-serif;font-weight:400}.wrap{width:min(1392px,calc(100% - 80px));margin-inline:auto}
.hero{position:relative;isolation:isolate;overflow:hidden;text-align:center;padding:58px 0 50px}.hero-photos{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,1fr);z-index:-1;opacity:.1;mask-image:linear-gradient(transparent,black 35%,black 65%,transparent)}.hero-photos img{width:100%;height:100%;object-fit:cover;filter:grayscale(1)}h1{font-size:clamp(43px,4.55vw,70px);line-height:1.12;letter-spacing:-.5px;margin:0;color:var(--ink);text-shadow:none}.mobile-break{display:none}
.concept-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-block:1px solid var(--line)}.run{--accent:#ff6a00}.air{--accent:#00a83c}.swim{--accent:#0757ff}.paw{--accent:#ef270f}.concept{position:relative;isolation:isolate;overflow:hidden;padding:32px 27px 29px;min-width:0}.concept+.concept{border-left:1px solid var(--line)}.concept-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.1);opacity:.15;z-index:-2;mask-image:linear-gradient(transparent,black 20%,black 45%,transparent 94%)}.concept:after{position:absolute;inset:0;content:'';z-index:-1;background:linear-gradient(transparent 35%,var(--paper) 85%)}.identity{text-align:center}.stamp{display:block;width:136px;height:136px;object-fit:contain;margin:0 auto 18px;mix-blend-mode:multiply}.identity h2{font-size:clamp(32px,3.25vw,50px);line-height:1.15;margin:0 0 28px;letter-spacing:-.5px;text-shadow:-2px 3px 0 var(--accent);white-space:nowrap}.concept-actions{display:grid;gap:8px}.concept-actions button{height:43px;padding:0 13px;display:flex;justify-content:space-between;align-items:center;font-size:10px;font-weight:800;border-radius:0}.photo-button{border:1px solid var(--ink);color:var(--ink);background:transparent}.photo-button:hover{background:#e9e5dc}.register-button{color:#fff;background:var(--accent);border:1px solid var(--accent)}.run .register-button,.air .register-button{color:var(--ink)}.register-button:hover,.submit-button:hover{filter:brightness(.93)}
.memories-section{padding:35px 0 42px}.memories-section>h2{font-size:32px;margin:0 0 20px;line-height:1.2}.movie-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.movie{min-width:0}.video-wrap{position:relative;aspect-ratio:16/9;background:#111;overflow:hidden}.video-wrap iframe{width:100%;height:100%;border:0;display:block}.movie h3{display:flex;justify-content:space-between;align-items:center;border-bottom:3px solid var(--accent);font-size:19px;line-height:1.2;margin:0;padding:13px 0 10px}.movie h3 span{font:9px Manrope;font-weight:700}
dialog{width:min(560px,calc(100% - 32px));max-height:90vh;overflow:auto;background:var(--paper);color:var(--ink);border:0;padding:42px}dialog::backdrop{background:#111b;backdrop-filter:blur(4px)}.close-dialog{position:absolute;top:12px;right:14px;border:0;background:transparent;font-size:30px;line-height:1;width:34px;height:34px}.modal-eyebrow{font-size:9px;letter-spacing:1.5px;font-weight:800;color:var(--ink)}dialog h2{font-size:54px;line-height:1.1;margin:17px 0;text-shadow:-2px 3px var(--accent)}dialog p{font-size:13px;line-height:1.8}form{margin-top:24px}form>label{display:block;font-size:11px;font-weight:800;margin-top:14px}form>input:not([type=hidden]){width:100%;height:48px;padding:12px;border:1px solid #aaa69b;background:transparent;border-radius:0;font-size:13px}.consent{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:10px;margin:20px 0}.consent input{flex-shrink:0;width:16px;height:16px;accent-color:var(--accent)}.consent a{text-decoration:underline}.submit-button{display:flex;justify-content:space-between;align-items:center;width:100%;border:0;background:var(--accent);color:white;font-size:12px;font-weight:800;padding:17px;margin-top:20px}.run .submit-button,.air .submit-button{color:var(--ink)}.demo-note{font-size:10px!important;color:#666}.form-message{padding:12px;background:#e5e2d9}.modal-photo-grid{display:grid;grid-template-columns:1fr;gap:12px;margin-top:24px}.modal-photo-grid img{width:100%;max-height:310px;object-fit:cover;filter:grayscale(1)}body:has(dialog[open]){overflow:hidden}
@media(min-width:1600px){.stamp{width:150px;height:150px}.concept{padding:36px}.hero{padding-block:66px}}
@media(max-width:1100px){.wrap{width:calc(100% - 48px)}.concept{padding-inline:18px}.stamp{width:116px;height:116px}.identity h2{font-size:36px}.concept-actions button{font-size:9px;padding-inline:9px}.movie-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 18px}}
@media(max-width:760px){.wrap{width:calc(100% - 36px)}.hero{padding:43px 0 39px}h1{font-size:40px;line-height:1.14;letter-spacing:-.3px}.mobile-break{display:inline}.concept-grid{grid-template-columns:1fr 1fr}.concept{padding:27px 13px 24px}.concept:nth-child(3),.concept:nth-child(4){border-top:1px solid var(--line)}.concept:nth-child(3){border-left:0}.stamp{width:105px;height:105px;margin-bottom:16px}.identity h2{font-size:31px;margin-bottom:23px;text-shadow:-1.5px 2.5px 0 var(--accent)}.concept-actions button{height:43px;font-size:8px;padding-inline:8px}.concept-actions button span{font-size:12px}.memories-section{padding:30px 0}.memories-section>h2{font-size:29px;margin-bottom:18px}.movie-grid{grid-template-columns:1fr;gap:26px}.movie h3{font-size:23px;padding-top:12px}dialog{padding:35px 24px}dialog h2{font-size:46px}}
@media(max-width:350px){.wrap{width:calc(100% - 24px)}h1{font-size:35px}.concept{padding-inline:9px}.identity h2{font-size:27px}.concept-actions button{font-size:7px;padding-inline:6px}.stamp{width:93px;height:93px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Preregistratie meerdere events — v3 */
#signup-dialog{width:min(600px,calc(100% - 32px));padding:30px;max-height:92vh}
#signup-dialog h2{font-size:42px;line-height:1.15;margin:12px 0;text-shadow:none;color:var(--ink)}
#signup-intro{font-size:12px;margin:0 0 18px}
#signup-form{margin-top:0}.event-choices{padding:0;margin:0;border:0;min-width:0}.event-choices legend{font-size:11px;font-weight:800;padding:0;margin-bottom:9px}
.event-options{display:grid;grid-template-columns:1fr 1fr;gap:9px}.event-option{display:flex;align-items:center;gap:10px;min-height:48px;padding:9px 12px;border:1px solid #c8c4ba;cursor:pointer;font-size:12px;font-weight:800;line-height:1.3}.event-option:has(input:checked){border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.event-option input{width:17px;height:17px;flex-shrink:0;margin:0;accent-color:var(--accent)}.event-option small{display:block;font-size:8px;line-height:1.4;color:#62645d;font-weight:400;margin-top:2px}
#signup-dialog .registration-benefit{font-size:12px;line-height:1.7;margin:15px 0 18px;color:var(--ink)}
.personal-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}.personal-fields>div{min-width:0}.personal-fields label{display:block;font-size:11px;font-weight:800;margin-bottom:6px}.personal-fields input{width:100%;height:44px;padding:10px;border:1px solid #aaa69b;background:transparent;border-radius:0;font-size:12px}
#signup-dialog .consent{margin:17px 0 14px;font-size:10px;line-height:1.6}#signup-dialog .consent input{accent-color:var(--ink)}#signup-dialog .submit-button{background:var(--ink);color:var(--paper);margin-top:0;padding:15px}#signup-dialog .demo-note{font-size:9px!important;line-height:1.6;margin-bottom:0}
@media(max-width:760px){#signup-dialog{padding:25px 22px}#signup-dialog h2{font-size:34px;margin-top:12px}.event-option{padding:10px;font-size:11px}.personal-fields{grid-template-columns:1fr;gap:12px}#signup-dialog .registration-benefit{font-size:11px;margin-block:13px 17px}}
@media(max-width:350px){#signup-dialog{padding:24px 17px}#signup-dialog h2{font-size:30px}.event-options{gap:7px}.event-option{gap:8px;padding:9px 8px;font-size:10px}}

/* Vier concepten in de vier hoeken — v5 */
body{position:relative;isolation:isolate;min-height:100vh}.page-collage{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:var(--paper)}.corner-photo{position:absolute;width:50%;height:50%;overflow:hidden;opacity:.27}.corner-photo img{display:block;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.1)}.corner-run{left:0;top:0}.corner-air{right:0;top:0}.corner-swim{left:0;bottom:0}.corner-paw{right:0;bottom:0}.corner-run img{object-position:48% 52%}.corner-air img{object-position:52% 60%}.corner-swim img{object-position:53% 60%}.corner-paw img{object-position:45% 45%}.paper-tears{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.collage-readability{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 38%,rgba(246,243,235,.5),rgba(246,243,235,.08) 76%)}
.hero{isolation:auto;overflow:visible}.concept{isolation:auto;background:transparent}.concept:after{display:none}.concept-bg,.hero-photos{display:none}.concept-grid{border-color:rgba(83,80,68,.17)}.concept+.concept{border-color:rgba(83,80,68,.17)}.photo-button{background:rgba(246,243,235,.78)}.memories-section>h2{display:inline-block;text-shadow:0 1px 8px var(--paper)}.movie h3{background:rgba(246,243,235,.86)}
@media(max-width:760px){.corner-photo{opacity:.24}.corner-run img{object-position:44% 50%}.corner-air img{object-position:65% 53%}.corner-swim img{object-position:51% 56%}.corner-paw img{object-position:42% 47%}.collage-readability{background:linear-gradient(rgba(246,243,235,.18),rgba(246,243,235,.32) 44%,rgba(246,243,235,.13))}.paper-tears{filter:none}}

.registration-honeypot{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}.submit-button[disabled]{cursor:wait;opacity:.7}.form-message.error{color:#a32717}
