/* Contactpagina (publiek): statische component-CSS. */
    .cpage-hero {
        position: relative; overflow: hidden; color: #fff; padding: clamp(3rem,5vw,4rem) 0;
        background: var(--sjk-grad-navy);
    }
    .cpage-hero h1 { color:#fff; font-weight:800; letter-spacing:-.02em; margin:0; }
    .cpage-hero .lead { color: rgba(255,255,255,.75); max-width: 620px; margin-top:.6rem; }

    /* Zijbalk (desktop/iPad-landschap); op mobiel valt hij weg (hamburger dekt navigatie). */
    .cpage-cols { padding-top: clamp(1.8rem, 4vw, 2.8rem); }
    .cpage-side { position: sticky; top: 96px; }
    .cpage-side-card { background:#fff; border:1px solid var(--sjk-lijn); border-radius: var(--sjk-radius-card);
        padding:.6rem; box-shadow: var(--sjk-shadow-sm); }
    .cpage-side-title { font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; font-weight:700;
        color: var(--sjk-grijs); padding:.6rem .8rem .3rem; }
    .cpage-side a { display:flex; align-items:center; gap:.5rem; padding:.6rem .8rem; border-radius:12px;
        color: var(--sjk-inkt); text-decoration:none; font-weight:600; font-size:.95rem; }
    .cpage-side a:hover { background: var(--sjk-lavendel); color: var(--sjk-diep); }
    .cpage-side a.active { background: var(--sjk-rozetint); color: var(--sjk-koraal-diep); }
    .cpage-side a.active::before { content:""; width:4px; height:1.1rem; border-radius:3px; background: var(--sjk-koraal-diep); }
    .cpage-side a:not(.active)::before { content:""; width:4px; height:1.1rem; }

    .contact-wrap { max-width: 640px; padding: 0 0 4rem; }
    .contact-card { background:#fff; border:1px solid var(--sjk-lijn); border-radius: var(--sjk-radius-card, 20px);
        box-shadow: var(--sjk-el-3); padding: 1.8rem; }
    .contact-card .form-control { transition: border-color .18s ease, box-shadow .18s ease; }
    .contact-card .form-label { font-weight:600; color: var(--sjk-inkt); font-size:.9rem; }
    .contact-card .form-control { border-radius:.7rem; padding:.68rem .85rem; border-color: var(--sjk-lijn); }
    .contact-card .form-control:focus { border-color: var(--sjk-indigo); box-shadow: 0 0 0 .2rem rgba(84,87,229,.18); }
    .contact-alt { color: var(--sjk-grijs); font-size:.92rem; margin-top:1.4rem; }
    .contact-alt a { color: var(--sjk-indigo); font-weight:600; text-decoration:none; }
    .hp-field { position:absolute; left:-9999px; top:-9999px; width:1px; height:1px; overflow:hidden; }
