/* ============ index.html — glaseffect (uitgesproken) ============
   Zachte kleurgloed als paginagrond; secties worden transparant en
   de panelen erbovenop zijn matglas. Alleen actief op .glass-page. */
.glass-page{--gl-bg:rgba(255,255,255,0.46);--gl-bg-hi:rgba(255,255,255,0.62);--gl-brd:rgba(255,255,255,0.72);--gl-blur:blur(28px) saturate(1.7);--gl-sh:inset 0 1px 0 rgba(255,255,255,0.85),0 18px 44px -28px rgba(31,45,77,0.45);background:var(--paper)}
.glass-page::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(58% 44% at 10% 6%,rgba(180,123,184,0.22),transparent 70%),radial-gradient(54% 40% at 90% 16%,rgba(127,184,212,0.26),transparent 70%),radial-gradient(60% 46% at 80% 66%,rgba(157,211,223,0.22),transparent 70%),radial-gradient(52% 40% at 14% 86%,rgba(166,206,137,0.18),transparent 70%)}
.glass-page .section,.glass-page .semester,.glass-page .hero{background:transparent}
.glass-page .semester{border-top-color:rgba(255,255,255,0.6);border-bottom-color:rgba(255,255,255,0.6)}

/* Glaspanelen */
.glass-page .project-card,.glass-page .event-list,.glass-page .form,.glass-page .contact-cta,.glass-page .mission-values,.glass-page .semester-item,.glass-page .gallery-tile{background:var(--gl-bg);-webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);border:1px solid var(--gl-brd);box-shadow:var(--gl-sh)}
.glass-page .project-card{border-radius:var(--radius-lg);overflow:hidden}
.glass-page .project-card:hover,.glass-page .form:hover,.glass-page .contact-cta:hover{background:var(--gl-bg-hi)}
.glass-page .mission-values{gap:1px;background:var(--gl-bg)}
.glass-page .value{background:transparent}
.glass-page .value:hover{background:rgba(255,255,255,0.42)}
.glass-page .mission-photo{border:1px solid var(--gl-brd);box-shadow:var(--gl-sh),var(--shadow-lg)}
.glass-page .event-row{border-bottom-color:rgba(255,255,255,0.55)}
.glass-page .event-row:hover{background:rgba(255,255,255,0.42)}
.glass-page .contact-info{border-top-color:rgba(255,255,255,0.7)}
.glass-page .field input,.glass-page .field textarea,.glass-page .field select{background:rgba(255,255,255,0.55);border-color:rgba(255,255,255,0.8);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.glass-page .filter-pill:not(.active){background:rgba(255,255,255,0.5);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,0.7)}
.glass-page .scroller-arrow{background:rgba(255,255,255,0.6);-webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);border:1px solid var(--gl-brd)}

/* Donker glas: footer */
.glass-page .footer{background:color-mix(in oklch, var(--ink-900) 88%, transparent);-webkit-backdrop-filter:blur(30px) saturate(1.5);backdrop-filter:blur(30px) saturate(1.5);border-top:1px solid rgba(255,255,255,0.12)}

@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.glass-page .project-card,.glass-page .event-list,.glass-page .form,.glass-page .contact-cta,.glass-page .mission-values,.glass-page .semester-item,.glass-page .gallery-tile{background:rgba(255,255,255,0.9)}.glass-page .footer{background:var(--ink-900)}}
@media (prefers-reduced-transparency:reduce){.glass-page .project-card,.glass-page .event-list,.glass-page .form,.glass-page .contact-cta,.glass-page .mission-values{background:rgba(255,255,255,0.92)}}