/* district-contact.css — De lege plek op de kaart: rustig papieren formulier
   op de laatste vrije kavel. Laad na css/origami.css en css/origami-district.css. */

/* — De kavel: formulier + kantlijnnotitie naast elkaar — */
.kavel-layout{display:grid;grid-template-columns:1.55fr 1fr;gap:1.3rem;align-items:start;max-width:66rem}
.kavel-panel{padding:clamp(1.5rem,3vw,2.4rem)}
.contact-routes{display:grid;grid-template-columns:minmax(0,.85fr) minmax(28rem,1.15fr);gap:clamp(1.5rem,5vw,4.5rem);align-items:end;margin:0 0 clamp(2.5rem,6vw,5rem);padding:clamp(1.4rem,3vw,2.4rem) 0;border-top:1px solid rgba(28,43,46,.2);border-bottom:1px solid rgba(28,43,46,.2)}
.contact-routes h2{margin:.35rem 0 .7rem;font:400 clamp(2rem,4vw,3.6rem)/1 var(--serif)}
.contact-routes>div>p:last-child{margin:0;max-width:38rem}
.contact-route-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.contact-route-links a{position:relative;display:grid;align-content:start;min-height:10rem;padding:1.1rem;background:rgba(255,255,255,.45);border:1px solid rgba(28,43,46,.25);clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%);transition:transform .2s,border-color .2s}
.contact-route-links a:hover{transform:translateY(-3px);border-color:var(--crimson)}
.contact-route-links span{color:var(--petrol);font:500 .68rem/1.3 var(--mono);text-transform:uppercase}.contact-route-links strong{margin:.35rem 0;font:400 1.45rem/1.1 var(--serif)}.contact-route-links small{line-height:1.45;color:rgba(28,43,46,.75)}

/* — Veldindeling binnen het papieren formulier — */
.cf-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.cf-field--wide{grid-column:1/-1}
.cf-label{font-size:.72rem;letter-spacing:.1em;color:var(--petrol)}
.cf-label i{font-style:normal;font-weight:400;letter-spacing:.02em;opacity:.85} /* .65 haalde geen AA (3.48:1) */
.cf-botcheck{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.cf-actions{display:flex;align-items:center;flex-wrap:wrap;gap:1.2rem}
.cf-note{margin:0;font-size:.82rem;opacity:.75}
.cf-note:empty{display:none}
.cf-sent{margin:0;font-weight:700;color:var(--petrol)}

/* — Kantlijnnotitie: liever direct — */
.contact-direct{position:relative;padding:1.35rem 1.3rem 1.5rem;background:var(--cream);border:1px dashed rgba(28,43,46,.35);font-size:.95rem}
.contact-direct::after{content:"";position:absolute;right:0;top:0;width:1.6rem;height:1.4rem;background:rgba(244,200,75,.3);clip-path:polygon(0 0,100% 100%,100% 0)}
.cd-head{margin:0 0 1rem;font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--petrol)}
.cd-row[hidden]{display:none}
.cd-row{display:grid;gap:.15rem;margin:0 0 .9rem}
.cd-label{font-size:.68rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--petrol);opacity:.85}
.cd-row a{justify-self:start;font-weight:700;border-bottom:1px solid rgba(28,43,46,.4);padding-bottom:.08rem}
.cd-row a:hover{color:var(--crimson);border-color:currentColor}
.cd-note{margin:1.1rem 0 0;padding-top:1rem;border-top:1px dashed rgba(28,43,46,.25);font-size:.85rem;opacity:.8}

/* — Slot: de pin markeert de kavel, geen extra CTA nodig — */
.kavel-slot{display:flex;flex-direction:column;align-items:center;gap:.9rem;margin:clamp(3rem,7vw,5rem) auto 0;max-width:28rem;text-align:center}
.kavel-slot img{height:4.2rem;width:auto}
.kavel-slot span{font-size:.95rem;opacity:.85}

@media (max-width:820px){
  .contact-routes{grid-template-columns:1fr}.contact-route-links{grid-template-columns:1fr 1fr}
  .kavel-layout{grid-template-columns:1fr}
  .cf-grid{grid-template-columns:1fr}
}
@media (max-width:540px){.contact-route-links{grid-template-columns:1fr}}