/* HOMZ Brand Override — v2 — light & luxe (Rentals feel) — July 2026 */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400&family=Jost:wght@300;400;500;600&display=swap');
:root {
  --ink:     #33302A;
  --ink-soft:#5A554B;
  --gold:    #A98C4A;
  --gold-d:  #8A6D2F;
  --green:   #1A3518;
  --ivory:   #FAF7F1;
  --cream:   #FAF7F1;
  --cream-2: #FFFFFF;
  --line:    #E7E1D5;
  --muted:   #8A8578;
  --header:  #FFFFFF;
}
*{box-sizing:border-box;}
body{margin:0;font-family:'Jost',sans-serif;background:var(--ivory);color:var(--ink);}
h1,h2,h3{font-family:'Fraunces',serif;color:var(--ink);font-weight:600;}
/* ── Portal header (light) ─────────────────────────────── */
.ph{
  display:flex;align-items:center;justify-content:space-between;
  background:var(--header);padding:0 32px;height:68px;
  position:sticky;top:0;z-index:100;
  border-bottom:1px solid var(--line);
}
.ph-logo{display:flex;align-items:center;gap:0;}
.ph-logo .n{
  font-family:'Fraunces',serif;font-weight:600;
  font-size:24px;color:var(--ink);letter-spacing:0.01em;
}
.ph-logo .s{
  font-family:'Jost',sans-serif;font-weight:400;
  font-size:10px;color:var(--gold);letter-spacing:0.18em;
  text-transform:uppercase;
  margin-left:14px;padding-left:14px;
  border-left:1px solid var(--line);
  line-height:1.2;
}
.ph-nav{display:flex;align-items:center;gap:28px;}
.ph-nav a{
  font-family:'Jost',sans-serif;font-weight:500;font-size:12px;
  letter-spacing:0.12em;text-transform:uppercase;
  color:var(--muted);text-decoration:none;
  padding-bottom:3px;border-bottom:1px solid transparent;
  transition:color .2s,border-color .2s;white-space:nowrap;
}
.ph-nav a:hover{color:var(--ink);}
.ph-nav a.active{color:var(--ink);border-bottom-color:var(--gold);}
.ph-badge{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--gold);color:#fff;
  font-size:10px;font-weight:700;
  width:17px;height:17px;border-radius:50%;
  margin-left:5px;vertical-align:middle;
}
/* ── Loading bar ───────────────────────────────────────── */
.lb{
  display:none;position:fixed;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--gold) 0%,var(--gold-d) 50%,var(--gold) 100%);
  background-size:200% 100%;animation:lb 1.2s linear infinite;z-index:9999;
}
@keyframes lb{0%{background-position:200% 0}100%{background-position:-200% 0}}
/* ── Kanban wrap ──────────────────────────────────────── */
.k-wrap{padding:24px;overflow-x:auto;min-height:calc(100vh - 68px);}
.k-grid{display:grid;gap:14px;align-items:start;}
.k-col{
  background:var(--cream-2);border:1px solid var(--line);
  border-radius:8px;min-width:220px;max-width:260px;
  display:flex;flex-direction:column;
}
.k-col-new{border-color:var(--green);border-width:2px;}
.k-col-rej{opacity:.6;}
.k-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:11px 14px;border-bottom:1px solid var(--line);
  border-radius:7px 7px 0 0;
}
.k-head-new{background:var(--green);}
.k-label{
  font-family:'Jost',sans-serif;font-weight:600;font-size:10px;
  letter-spacing:0.14em;text-transform:uppercase;color:var(--ink);
}
.k-label-new{color:#fff;}
.k-label-rej{color:var(--muted);}
.k-count{
  font-size:11px;font-weight:500;
  background:var(--line);color:var(--muted);
  padding:2px 8px;border-radius:10px;
  font-family:'Jost',sans-serif;
}
.k-count-new{background:var(--gold);color:#fff;}
.k-body{padding:10px;display:flex;flex-direction:column;gap:9px;flex:1;}
.k-empty{color:var(--muted);font-size:12px;text-align:center;padding:24px 0;}
.k-card{
  background:#fff;border:1px solid var(--line);border-radius:6px;
  overflow:hidden;box-shadow:0 1px 4px rgba(51,48,42,.05);
  transition:box-shadow .2s,transform .2s;
}
.k-card:hover{box-shadow:0 4px 14px rgba(51,48,42,.11);transform:translateY(-1px);}
.k-card-new{border-left:3px solid var(--green);}
.k-card-rej{opacity:.55;}
.k-img{width:100%;height:150px;object-fit:cover;display:block;}
.k-card-body{padding:12px;}
.k-title{
  font-family:'Fraunces',serif;font-size:15px;font-weight:600;
  color:var(--ink);line-height:1.35;margin-bottom:6px;
}
.k-price{
  font-family:'Jost',sans-serif;font-size:15px;font-weight:600;
  color:var(--ink);margin-bottom:4px;
}
.k-specs{
  font-family:'Jost',sans-serif;font-size:11px;
  color:var(--muted);margin-bottom:10px;letter-spacing:.02em;
}
.k-sel{
  width:100%;font-family:'Jost',sans-serif;font-size:11px;
  letter-spacing:.08em;text-transform:uppercase;
  border:1px solid var(--line);border-radius:4px;
  padding:6px 24px 6px 8px;background:var(--ivory);color:var(--ink);
  cursor:pointer;margin-bottom:8px;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2333302A'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 8px center;
}
.k-ext{
  display:inline-block;font-family:'Jost',sans-serif;
  font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink);text-decoration:none;
  border-bottom:1px solid var(--line);padding-bottom:1px;
  transition:border-color .2s;
}
.k-ext:hover{border-color:var(--ink);}
/* ── Login page (light) ────────────────────────────────── */
.login-wrap{
  min-height:100vh;background:var(--ivory);
  display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:28px;padding:40px 20px;
}
.login-brand{text-align:center;}
.brand{
  font-family:'Fraunces',serif;font-size:52px;
  font-weight:600;color:var(--ink);letter-spacing:.02em;
}
.tag{
  font-family:'Jost',sans-serif;font-size:11px;
  letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold);margin-top:4px;
}
.rule{width:40px;height:1px;background:var(--gold);margin:16px auto 0;}
.login-box{
  background:#fff;border:1px solid var(--line);
  border-radius:12px;padding:36px 32px;width:100%;max-width:340px;text-align:center;
  box-shadow:0 8px 30px rgba(51,48,42,.06);
}
.login-name{
  font-family:'Fraunces',serif;font-size:22px;
  font-weight:600;color:var(--ink);margin-bottom:8px;
}
.login-badge{
  display:inline-block;background:var(--gold);color:#fff;
  font-family:'Jost',sans-serif;font-size:11px;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;
  padding:4px 12px;border-radius:20px;margin-bottom:16px;
}
.login-hint{
  font-family:'Jost',sans-serif;font-size:13px;
  color:var(--muted);margin-bottom:24px;line-height:1.6;
}
.pin-row{display:flex;justify-content:center;gap:12px;margin-bottom:8px;}
.pin-dot{
  width:12px;height:12px;border-radius:50%;
  background:rgba(51,48,42,.15);transition:background .15s;
}
.pin-dot.on{background:var(--gold);}
.pin-err{font-family:'Jost',sans-serif;font-size:12px;color:#c0392b;margin:8px 0;}
.pin-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:20px 0 16px;}
.pin-btn{
  background:var(--ivory);border:1px solid var(--line);
  border-radius:8px;color:var(--ink);font-family:'Jost',sans-serif;
  font-size:18px;height:52px;cursor:pointer;transition:background .15s;
}
.pin-btn:hover{background:#F0EADF;}
.pin-btn.sym{font-size:14px;}
.lang-row{display:flex;justify-content:center;gap:8px;margin-top:8px;}
.lang-btn{
  background:transparent;border:1px solid var(--line);
  border-radius:4px;color:var(--muted);
  font-family:'Jost',sans-serif;font-size:11px;letter-spacing:.1em;
  padding:4px 10px;cursor:pointer;transition:all .15s;
}
.lang-btn.on{background:#fff;color:var(--ink);border-color:var(--gold);}
/* ── Admin / dashboard nav (light) ─────────────────────── */
.nav{
  display:flex;align-items:center;gap:24px;
  background:var(--header);padding:0 32px;height:60px;
  position:sticky;top:0;z-index:100;
  border-bottom:1px solid var(--line);
}
.nav-brand{
  font-family:'Fraunces',serif;font-weight:600;
  font-size:20px;color:var(--ink);letter-spacing:.01em;margin-right:8px;
}
.nav a{
  font-family:'Jost',sans-serif;font-size:12px;font-weight:500;
  letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);text-decoration:none;
  padding-bottom:2px;border-bottom:1px solid transparent;
  transition:color .2s,border-color .2s;white-space:nowrap;
}
.nav a:hover{color:var(--ink);}
.nav a.active{color:var(--ink);border-bottom-color:var(--gold);}
/* ── Responsive ───────────────────────────────────────── */
@media(max-width:768px){
  .ph{padding:0 16px;height:60px;}
  .ph-nav{gap:14px;}
  .ph-nav a{font-size:10px;}
  .ph-logo .n{font-size:18px;}
  .ph-logo .s{font-size:9px;margin-left:10px;padding-left:10px;}
  .k-wrap{padding:12px;}
  .k-col{min-width:190px;}
  .nav{padding:0 16px;}
}
/* ── Client form: checkbox groups ──────────────────────── */
.checkbox-group{display:flex;flex-wrap:wrap;gap:10px 20px;padding:8px 0;}
.cb-label{
  display:flex;align-items:center;gap:8px;
  font-family:'Jost',sans-serif;font-size:13px;color:var(--ink);
  cursor:pointer;white-space:nowrap;
}
.cb-label input[type="checkbox"]{width:16px;height:16px;accent-color:var(--gold);cursor:pointer;}
.prop-type-group{flex-direction:column;}
/* ── Match card: property type badge ───────────────────── */
.mc-type{
  display:inline-block;font-family:'Jost',sans-serif;font-size:10px;
  font-weight:500;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--gold-d);background:rgba(169,140,74,0.08);
  border:1px solid rgba(169,140,74,0.25);border-radius:3px;
  padding:2px 8px;margin-bottom:6px;
}
/* ── Admin feedback link ───────────────────────────────── */
.admin-feedback-link{
  display:inline-flex;align-items:center;gap:6px;
  font-family:'Jost',sans-serif;font-size:13px;color:var(--gold-d);
  text-decoration:none;border:1px solid rgba(169,140,74,.3);
  border-radius:20px;padding:5px 14px;margin-left:12px;
}
.admin-feedback-link:hover{background:rgba(169,140,74,.06);}

/* ── HOMZ. Agency — geanimeerd wordmerk (stempel V1) ─────── */
.ph-logo .n,.nav-brand,.brand{position:relative;display:inline-block;animation:homzIn .55s cubic-bezier(.16,1,.3,1) both;}
.ph-logo .n::after,.nav-brand::after,.brand::after{content:'.';color:var(--gold);display:inline-block;animation:homzDrop .42s cubic-bezier(.55,0,.85,.36) .55s both;}
@keyframes homzIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes homzDrop{0%{opacity:0;transform:translateY(-1.1em)}72%{opacity:1;transform:translateY(.08em)}88%{transform:translateY(-.04em)}100%{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.ph-logo .n,.nav-brand,.brand,.ph-logo .n::after,.nav-brand::after,.brand::after{animation:none!important;opacity:1!important;transform:none!important}}
