/* ============ CollabSpace — glas-huisstijl (site-breed, laatste stylesheet) ============
   Kleurwolk-achtergrond (achtergrond.js, MeshGradient via WebGPU; CSS-gloed als terugval),
   matglazen panelen, donkere pil-knoppen en strakke koppen. Actief via body.g2. */
.g2{--g-fill:rgba(255,255,255,0.42);--g-fill-hi:rgba(255,255,255,0.62);--g-brd:rgba(255,255,255,0.78);--g-blur:blur(26px) saturate(1.8);--g-sh:inset 0 1px 0 rgba(255,255,255,0.9),inset 0 -1px 0 rgba(255,255,255,0.25),0 24px 60px -32px rgba(31,45,77,0.45);--g-r:28px}
.g2 a{color:inherit}

/* Achtergrond */
.g2-backdrop{position:fixed;inset:0;z-index:-1;pointer-events:none;background:var(--paper);overflow:hidden}
.g2-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1.2s ease}
.g2-backdrop.is-shader .g2-canvas{opacity:1}
.g2-glow{position:absolute;inset:-10%;filter:blur(70px);transition:opacity 1.2s}
.g2-backdrop.is-shader .g2-glow{opacity:0}
.g2-glow i{position:absolute;border-radius:50%;opacity:.5;animation:g2drift 26s ease-in-out infinite alternate}
.g2-glow i:nth-child(1){width:46vw;height:46vw;left:-4%;top:-6%;background:#B47BB8}
.g2-glow i:nth-child(2){width:40vw;height:40vw;right:-2%;top:6%;background:#7FB8D4;animation-delay:-8s}
.g2-glow i:nth-child(3){width:44vw;height:44vw;right:12%;bottom:-10%;background:#9DD3DF;animation-delay:-14s}
.g2-glow i:nth-child(4){width:36vw;height:36vw;left:8%;bottom:-6%;background:#A6CE89;animation-delay:-4s}
@keyframes g2drift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(6vw,4vh) scale(1.12)}100%{transform:translate(-4vw,-3vh) scale(.94)}}
@media (prefers-reduced-motion:reduce){.g2-glow i{animation:none}}

/* Typografie */
.g2 h1,.g2 h2{letter-spacing:-0.045em}
.g2 .eyebrow{font-family:var(--font-display);font-weight:700;letter-spacing:.16em;text-transform:uppercase}

/* Navigatie */
.g2 .nav-glass{background:var(--g-fill-hi)!important;-webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur);border:1px solid var(--g-brd);box-shadow:var(--g-sh)}

/* Knoppen */
.g2 .btn{border-radius:99px;font-family:var(--font-display);font-weight:700;transition:transform .25s cubic-bezier(.2,.8,.2,1),background .25s,box-shadow .25s}
.g2 .btn:hover{transform:translateY(-2px)}
.g2 .btn-primary,.g2 .btn-primary:hover,.g2 .about-teaser-btn{color:#fff;background:linear-gradient(180deg,rgba(43,51,80,0.94),rgba(14,19,36,0.94));border-color:rgba(255,255,255,0.18);box-shadow:inset 0 1px 0 rgba(255,255,255,0.22),0 14px 30px -14px rgba(14,19,36,0.6)}
.g2 .btn-ghost{color:var(--ink-900);background:var(--g-fill-hi);-webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur);border-color:var(--g-brd);box-shadow:var(--g-sh)}
.g2 :is(.hero.dark,.vac-cta,.crit-cta,.md-cta,.vac-teaser) .btn-primary{color:var(--ink-900);background:#fff;border-color:#fff}
.g2 :is(.hero.dark,.vac-cta,.crit-cta,.md-cta,.vac-teaser) .btn-ghost{color:#fff;background:rgba(255,255,255,0.12);border-color:rgba(255,255,255,0.28);box-shadow:none}

/* Glazen panelen */
.g2 :is(.project-card,.event-list,.form,.contact-cta,.mission-values,.gallery-tile,.about-teaser-inner,.semester-item,.problem-card,.audience-card,.team-card,.vac-card,.vac-notice,.inzet-cta,
.smas-assign-card,.smas-op-note,.smas-op-step,.smas-op-table-wrap,.smas-partner-panel,.smas-brief-card,.smas-comp-card,.smas-scn-card,.smas-matrix-wrap,.smas-note,.smas-src-cat,.smas-author-card,
.ad-level-item,.ad-board,.ad-pbi-detail,.ad-g-item,.ad-pitfall,
.ai-aim-panel,.ai-term,.ai-mini,.ai-learn,
.md-door,.md-step,.md-info-card,
.opd-after-item,.opd-form,.opd-success,
.crit-fact,.crit-card,.crit-result,.crit-recip-col,
.contact-person,.contact-route,
.intro-card,.intro-werkplek,.intro-index,.opdracht,.werkplek){background:var(--g-fill);-webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur);border:1px solid var(--g-brd);box-shadow:var(--g-sh)}
.g2 .ai-prompts>div{background:var(--g-fill);-webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur);border:1px solid var(--g-brd);box-shadow:var(--g-sh)}
.g2 :is(.project-card,.about-teaser-inner,.problem-card,.audience-card,.team-card,.vac-card,.smas-assign-card,.smas-brief-card,.smas-comp-card,.smas-scn-card,.smas-author-card,.md-door,.md-info-card,.crit-card,.contact-person,.intro-card):hover{background:var(--g-fill-hi)}
.g2 :is(.project-card,.about-teaser-inner,.mission-values,.problem-card,.audience-card,.team-card,.vac-card,.smas-assign-card,.smas-brief-card,.md-door,.md-info-card,.crit-card,.opd-form,.form){border-radius:var(--g-r)}
.g2 .project-card,.g2 .mission-values{overflow:hidden}
.g2 .value{background:transparent}
.g2 .mission-photo{border-radius:var(--g-r);overflow:hidden;border:1px solid var(--g-brd);box-shadow:var(--g-sh)}
.g2 .event-row{border-bottom-color:rgba(255,255,255,0.55)}
.g2 .event-row:hover{background:rgba(255,255,255,0.42)}

/* Formuliervelden */
.g2 :is(.field input,.field textarea,.field select,.opd-form input,.opd-form textarea,.opd-form select){background:rgba(255,255,255,0.6);border-color:rgba(255,255,255,0.85);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}

/* Footer: donker glas */
.g2 .footer{background:color-mix(in oklch,var(--ink-900) 82%,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.14)}

@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.g2{--g-fill:rgba(255,255,255,0.9);--g-fill-hi:rgba(255,255,255,0.96)}.g2 .footer{background:var(--ink-900)}}
@media (prefers-reduced-transparency:reduce){.g2{--g-fill:rgba(255,255,255,0.92);--g-fill-hi:rgba(255,255,255,0.97)}}
@media print{.g2-backdrop{display:none}}