/* CAS-Jartpoint V136 – vertrouwde CAS-Jartpoint portalstijl
   Locatieflow van V133/V135 behouden, visueel terug naar de herkenbare groene kaartstijl. */
:root{
  --cj-green-950:#031811;
  --cj-green-900:#06261b;
  --cj-green-800:#0b3b2a;
  --cj-green-700:#15543c;
  --cj-gold:#cf9b3c;
  --cj-gold-light:#e8cf88;
  --cj-paper:#f5f0e7;
  --cj-ivory:#fffaf0;
  --cj-white:#fffdf8;
  --cj-ink:#10271e;
  --cj-muted:#748078;
  --cj-line:#d7ccbb;
}
*{box-sizing:border-box}
body.cj-portal-v133{
  margin:0;
  min-height:100vh;
  color:var(--cj-ink);
  background:
    radial-gradient(circle at 94% -10%,rgba(207,155,60,.14),transparent 28rem),
    radial-gradient(circle at -8rem 105%,rgba(11,59,42,.07),transparent 28rem),
    linear-gradient(180deg,#eee9df,#f8f5ef 48%,#eee9df);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}
.cj-portal-shell{width:min(1240px,calc(100% - 28px));min-height:100vh;margin:0 auto;padding:12px 0 16px;display:flex;flex-direction:column}
.cj-portal-header{
  min-height:86px;padding:12px 18px;display:flex;align-items:center;justify-content:space-between;gap:18px;
  color:var(--cj-ivory);
  background:radial-gradient(circle at 92% -30%,rgba(232,207,136,.15),transparent 20rem),linear-gradient(118deg,var(--cj-green-950),var(--cj-green-800) 64%,var(--cj-green-700));
  border:1px solid rgba(207,155,60,.43);border-radius:18px;box-shadow:0 15px 34px rgba(7,29,21,.16)
}
.cj-portal-brand{display:flex;align-items:center;gap:13px;min-width:0;color:inherit;text-decoration:none}
.cj-portal-brand img{width:58px;height:58px;flex:0 0 58px;object-fit:contain;filter:drop-shadow(0 7px 12px rgba(0,0,0,.24))}
.cj-portal-brand span{display:flex;min-width:0;flex-direction:column;gap:3px}
.cj-portal-brand strong{color:#fffaf0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(27px,3vw,38px);line-height:1;letter-spacing:-.035em}
.cj-portal-brand small{color:var(--cj-gold-light);font-size:9px;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.cj-admin-button,.cj-switch-location{min-height:42px;display:inline-flex;align-items:center;justify-content:center;padding:0 14px;border-radius:10px;text-decoration:none;font-size:12px;font-weight:900}
.cj-admin-button{color:#241806;background:linear-gradient(135deg,#efd77f,#c99232);border:1px solid rgba(255,255,255,.22)}
.cj-admin-login-small{min-height:32px;display:inline-flex;align-items:center;justify-content:center;padding:0 10px;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:rgba(255,250,240,.78);background:rgba(255,255,255,.055);text-decoration:none;font-size:10px;font-weight:900;letter-spacing:.01em;transition:.15s ease}
.cj-admin-login-small:hover,.cj-admin-login-small:focus-visible{color:#fffaf0;background:rgba(255,255,255,.11);border-color:rgba(232,207,136,.42);outline:0}
.cj-switch-location{color:var(--cj-green-800);background:#edf4ef;border:1px solid #d1dfd6}
.cj-portal-main{flex:1;padding:18px 0 28px}

/* Locatiekeuze – gewone CAS-Jartpoint pagina, geen marketing landingpage. */
.cj-location-hero,.cj-module-hero{
  margin:0 0 12px;padding:24px 26px;background:rgba(255,253,248,.96);border:1px solid var(--cj-line);border-radius:17px;box-shadow:0 12px 28px rgba(28,42,35,.07)
}
.cj-location-hero{text-align:left}
.cj-module-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;text-align:left}
.cj-portal-kicker{display:inline-flex;align-items:center;gap:8px;margin:0 0 7px;color:#9a6f1f;font-size:9px;font-weight:950;letter-spacing:.15em;text-transform:uppercase}
.cj-portal-kicker::before{content:"";width:22px;height:2px;background:linear-gradient(90deg,var(--cj-green-700),var(--cj-gold));border-radius:99px}
.cj-location-hero h1,.cj-module-hero h1{margin:0;color:var(--cj-ink);font-family:Georgia,"Times New Roman",serif;font-size:clamp(31px,5vw,48px);line-height:1;letter-spacing:-.04em}
.cj-location-hero p,.cj-module-hero p{max-width:680px;margin:9px 0 0;color:#69766f;font-size:13px;line-height:1.5}

.cj-location-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cj-location-card{
  position:relative;min-height:94px;padding:15px 16px;display:grid;grid-template-columns:48px minmax(0,1fr) 36px;align-items:center;gap:13px;
  overflow:hidden;color:var(--cj-ink);text-decoration:none;background:rgba(255,253,248,.97);border:1px solid var(--cj-line);border-radius:15px;box-shadow:0 9px 22px rgba(28,42,35,.06);transition:.16s ease
}
.cj-location-card::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:linear-gradient(180deg,var(--cj-green-700),var(--cj-gold))}
.cj-location-card:hover{transform:translateY(-2px);border-color:#b8c9bd;background:#fffaf0;box-shadow:0 13px 28px rgba(28,42,35,.10)}
.cj-location-pin{width:46px;height:46px;display:grid;place-items:center;border-radius:13px;color:#fff8e9;background:linear-gradient(145deg,#176b48,#082c20);border:1px solid rgba(207,155,60,.28);font-size:22px;box-shadow:0 8px 18px rgba(15,76,49,.13)}
.cj-location-copy{display:flex;min-width:0;flex-direction:column;gap:4px}
.cj-location-copy strong{font-family:Georgia,"Times New Roman",serif;font-size:22px;line-height:1;letter-spacing:-.02em}
.cj-location-copy small{color:var(--cj-muted);font-size:10px;font-weight:750;line-height:1.35}
.cj-location-arrow{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;color:#124833;background:#edf4ef;border:1px solid #d8e3dc;font-size:18px;font-weight:900}
.cj-location-note{margin:12px 2px 0;padding:0;color:#7a847e;font-size:10px;text-align:left}

/* Onderdelen na locatiekeuze – gebaseerd op de bekende V49 modulekaarten. */
.cj-module-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cj-module-card{
  --module:#15543c;position:relative;min-height:112px;padding:16px 17px;display:grid;grid-template-columns:54px minmax(0,1fr) auto;align-items:center;gap:14px;overflow:hidden;
  color:var(--cj-ink);text-decoration:none;background:rgba(255,253,248,.97);border:1px solid var(--cj-line);border-radius:15px;box-shadow:0 10px 24px rgba(28,42,35,.07);transition:.16s ease
}
.cj-module-card::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:var(--module)}
.cj-module-card:hover{transform:translateY(-2px);background:#fffaf0;border-color:#c3b9aa;box-shadow:0 14px 30px rgba(28,42,35,.10)}
.cj-module-card.is-billiards{--module:#25815d}.cj-module-card.is-darts{--module:#c45138}.cj-module-card.is-klaverjas{--module:#4c6fc6}.cj-module-card.is-pubquiz{--module:#9e4fa5}.cj-module-card.is-games{--module:#c88a31}
.cj-module-symbol{position:relative;z-index:1;width:52px;height:52px;display:grid;place-items:center;border-radius:14px;color:#fff;background:var(--module);font-size:25px;font-weight:1000;box-shadow:0 8px 18px rgba(25,44,35,.14)}
.cj-module-copy{position:relative;z-index:1;display:flex;min-width:0;flex-direction:column}
.cj-module-copy small{color:var(--module);font-size:8px;font-weight:950;letter-spacing:.12em;text-transform:uppercase}
.cj-module-copy strong{margin-top:3px;color:#11271e;font-family:Georgia,"Times New Roman",serif;font-size:25px;line-height:1;letter-spacing:-.025em}
.cj-module-copy em{margin-top:5px;color:#79827c;font-size:10px;font-style:normal;line-height:1.35}
.cj-module-go{position:relative;z-index:1;min-height:36px;display:inline-flex;align-items:center;justify-content:center;padding:0 11px;border-radius:9px;color:#174b37;background:#edf4ef;border:1px solid #d5e1d9;font-size:10px;font-weight:900;white-space:nowrap}
.cj-no-modules{grid-column:1/-1;padding:20px;border:1px dashed #cdbfae;border-radius:15px;background:rgba(255,253,248,.8);display:flex;flex-direction:column;gap:5px;color:var(--cj-ink)}
.cj-no-modules span{color:var(--cj-muted);font-size:11px}

.cj-portal-footer{min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 3px 0;color:#707a73;font-size:10px;font-weight:750}
.cj-portal-footer a{color:#707a73;text-decoration:none}
.cj-portal-admin-entry{display:inline-grid!important;place-items:center;width:28px;height:28px;padding:0!important;border:1px solid #d2c8b9;border-radius:999px;color:#7b837e!important;background:rgba(255,253,248,.6);text-decoration:none;font-size:12px;opacity:.66;transition:.15s ease}
.cj-portal-admin-entry:hover,.cj-portal-admin-entry:focus-visible{opacity:1;color:var(--cj-green-800)!important;border-color:#aebfb4;background:#fffdf8;outline:0}

@media(max-width:760px){
  .cj-portal-shell{width:min(100% - 14px,1240px);padding-top:7px}
  .cj-portal-header{min-height:72px;padding:10px 12px;border-radius:15px}
  .cj-portal-brand{gap:10px}.cj-portal-brand img{width:48px;height:48px;flex-basis:48px}.cj-portal-brand strong{font-size:27px}.cj-portal-brand small{display:none}
  .cj-admin-button{min-height:38px;padding:0 11px;font-size:11px}
  .cj-admin-login-small{min-height:31px;padding:0 9px;font-size:9px}
  .cj-portal-main{padding:9px 0 20px}
  .cj-location-hero,.cj-module-hero{padding:18px 17px;margin-bottom:9px;border-radius:14px}
  .cj-module-hero{align-items:flex-start;flex-direction:column;gap:12px}.cj-switch-location{min-height:38px}
  .cj-location-hero h1,.cj-module-hero h1{font-size:34px}.cj-location-hero p,.cj-module-hero p{font-size:12px}
  .cj-location-grid,.cj-module-grid{grid-template-columns:1fr;gap:8px}
  .cj-location-card{min-height:82px;padding:12px 13px;grid-template-columns:43px minmax(0,1fr) 32px;gap:11px;border-radius:13px}
  .cj-location-pin{width:42px;height:42px;border-radius:12px;font-size:20px}.cj-location-copy strong{font-size:20px}.cj-location-copy small{font-size:9px}.cj-location-arrow{width:31px;height:31px;font-size:16px}
  .cj-location-note{margin-top:10px;font-size:9px}
  .cj-module-card{min-height:88px;padding:12px 13px;grid-template-columns:46px minmax(0,1fr) auto;gap:11px;border-radius:13px}
  .cj-module-symbol{width:45px;height:45px;border-radius:12px;font-size:21px}.cj-module-copy strong{font-size:22px}.cj-module-copy em{font-size:9px}.cj-module-go{min-height:32px;padding:0 9px;font-size:9px}
  .cj-portal-footer{padding-left:2px;padding-right:2px}
}
@media(max-width:430px){
  .cj-portal-brand strong{font-size:24px}
  .cj-module-card{grid-template-columns:44px minmax(0,1fr) 31px}.cj-module-go{width:31px;padding:0;font-size:0}.cj-module-go::after{content:"→";font-size:16px}
}