/* De Nachtwacht — sectie-stijl uit zaalverhuur.html */
/* intro */
  .intro .wrap{ display:grid; grid-template-columns:1.05fr .95fr; gap:72px; align-items:center; }
  .intro h2{ font-size:clamp(30px,4vw,48px); margin:16px 0 22px; }
  .intro p{ color:var(--muted); font-size:16.5px; margin-bottom:18px; text-wrap:pretty; }
  .intro p strong{ color:var(--cream); font-weight:600; }
  /* "Nieuw vanaf 2027" — subtiele callout onder de intro */
  .intro p.dnw-soon{ margin-top:26px; padding:16px 20px; border-left:2px solid var(--gold); background:var(--ink-2); border-radius:4px; font-size:15px; color:var(--muted); }
  .intro p.dnw-soon strong{ color:var(--gold); letter-spacing:.01em; }
  .intro .frame .art{ height:520px; }
  /* image-slot de schilderijlijst laten vullen */
  .frame .art image-slot{ display:block; width:100% !important; height:100% !important; filter:contrast(1.08) saturate(1.12) sepia(.16) brightness(.95); }
  /* specs strip */
  .specs{ background:var(--ink-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .specs .wrap{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; }
  .specs .cell{ padding:34px 24px; text-align:center; border-right:1px solid var(--line); }
  .specs .cell:last-child{ border-right:none; }
  .specs .k{ font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-deep); font-weight:700; }
  .specs .v{ font-family:var(--serif); font-weight:700; font-size:23px; margin-top:10px; color:var(--cream); }
  .specs .v small{ display:block; font-family:var(--sans); font-weight:500; font-size:13px; color:var(--muted); letter-spacing:.02em; margin-top:4px; }
  /* mogelijkheden */
  .opts .ogrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
  .ocard{ background:var(--ink-2); border:1px solid var(--line); border-radius:4px; padding:40px 32px; transition:border-color .3s, transform .3s; }
  .ocard:hover{ border-color:var(--line-gold); transform:translateY(-4px); }
  .ocard .n{ font-family:var(--sans); font-weight:700; font-size:16px; color:var(--gold-deep); }
  .ocard h3{ font-size:25px; margin:0 0 12px; }
  .ocard p{ color:var(--muted); font-size:15px; }
  /* inbegrepen */
  .incl{ background:var(--ink-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .incl .wrap{ display:grid; grid-template-columns:.9fr 1.1fr; gap:64px; align-items:center; }
  .incl h2{ font-size:clamp(28px,3.6vw,44px); margin-bottom:22px; }
  .incl ul{ list-style:none; }
  .incl li{ display:flex; gap:16px; align-items:flex-start; padding:16px 0; border-bottom:1px solid var(--line); color:var(--cream); font-size:16px; }
  .incl li:first-child{ border-top:1px solid var(--line); }
  .incl li svg{ flex:0 0 auto; color:var(--gold); margin-top:2px; }
  .incl li span small{ display:block; color:var(--muted); font-size:14px; font-weight:400; margin-top:2px; }
  /* aanvraagformulier */
  .request .lead{ text-align:center; max-width:880px; margin:0 auto 40px; }
  .request .lead h2{ font-size:clamp(28px,3.6vw,44px); margin-bottom:16px; }
  .request .lead p{ color:var(--muted); font-size:16px; margin:0 auto 14px; max-width:760px; text-wrap:pretty; }
  .request .lead .mailto{ color:var(--gold); }
  .request .lead .mailto:hover{ text-decoration:underline; }
  /* strak, modern kaart — geen schilderijlijst eromheen */
  .offerte-frame{ position:relative; }
  .offerte{ position:relative; z-index:2; display:grid; grid-template-columns:.8fr 1fr;
    background:var(--ink-2); border:1px solid var(--line); border-radius:16px; overflow:hidden;
    box-shadow:0 40px 90px -45px rgba(0,0,0,.8); }
  .offerte .aside{ position:relative; padding:46px 40px; display:flex; flex-direction:column; }
  .offerte .aside .bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
  .offerte .aside::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(29,20,17,.5) 0%, rgba(29,20,17,.82) 58%, rgba(29,20,17,.92) 100%); }
  .offerte .aside > *{ position:relative; z-index:2; }
  .offerte .aside h3{ font-size:clamp(24px,2.4vw,31px); line-height:1.12; margin-bottom:14px; color:var(--cream); }
  .offerte .aside .sub{ color:var(--cream); opacity:.85; font-size:15px; margin-bottom:28px; text-wrap:pretty; }
  .offerte .perks{ list-style:none; margin-top:auto; }
  .offerte .perks li{ display:flex; gap:12px; align-items:flex-start; padding:13px 0; border-top:1px solid rgba(234,229,218,.16); font-size:15px; color:var(--cream); }
  .offerte .perks li:last-child{ border-bottom:1px solid rgba(234,229,218,.16); }
  .offerte .perks svg{ flex:0 0 auto; color:var(--gold); margin-top:3px; }
  .offerte .mailrow{ margin-top:26px; font-size:14px; color:var(--cream); opacity:.92; }
  .offerte .mailrow a{ color:var(--gold); }
  .offerte .mailrow a:hover{ text-decoration:underline; }
  .offerte .panel{ padding:44px 44px 38px; }
  .offerte .panel h3{ font-size:23px; margin-bottom:6px; }
  .offerte .panel .note{ color:var(--muted); font-size:14.5px; margin-bottom:30px; }
  .fgrid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
  .field{ display:flex; flex-direction:column; min-width:0; }
  .field.full{ grid-column:1 / -1; }
  .field label{ font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); font-weight:700; margin-bottom:9px; }
  .field label .opt{ text-transform:none; letter-spacing:0; color:var(--gold-deep); font-weight:500; }
  .field input, .field select, .field textarea{ width:100%; height:50px; background:var(--ink); border:1px solid var(--line); border-radius:9px; color:var(--cream);
    font-family:var(--sans); font-size:15px; padding:0 15px; transition:border-color .25s, box-shadow .25s; }
  .field input::placeholder, .field textarea::placeholder{ color:#897d70; }
  .field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(200,169,108,.15); }
  .field select{ appearance:none; cursor:pointer; color:var(--cream); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23a89e92' d='M1 1l5 5 5-5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 15px center; padding-right:38px; }
  .field select.is-empty{ color:#897d70; }
  .field select option{ color:var(--cream); background:var(--ink-2); }
  .field select option[disabled]{ color:#897d70; }
  .field textarea{ height:auto; min-height:118px; padding:13px 15px; resize:vertical; line-height:1.5; }
  .field input[type="date"]::-webkit-calendar-picker-indicator{ filter:invert(1) brightness(1.8); opacity:.7; cursor:pointer; }
  .field input[type="date"]::-webkit-calendar-picker-indicator:hover{ opacity:1; }
  .offerte .panel .btn{ width:100%; justify-content:center; height:54px; margin-top:28px; }
  .thanks{ display:none; text-align:center; padding:30px 0; }
  .thanks.show{ display:block; }
  .thanks .mark{ width:74px; margin:0 auto 16px; opacity:.85; }
  .thanks h3{ color:var(--gold); }
  .thanks p{ color:var(--muted); margin-top:8px; }
  @media(max-width:900px){
    .intro .wrap, .incl .wrap, .request .wrap{ grid-template-columns:1fr; gap:44px; }
    .intro .copy{ text-align:center; }
    .request .lead{ position:static; }
    .offerte{ grid-template-columns:1fr; }
    .offerte .aside{ min-height:300px; }
    .opts .ogrid{ grid-template-columns:1fr; }
    .specs .wrap{ grid-template-columns:1fr 1fr; }
    .specs .cell:nth-child(2){ border-right:none; }
    .specs .cell:nth-child(1),.specs .cell:nth-child(2){ border-bottom:1px solid var(--line); }
    .intro .frame .art{ height:380px; }
  }
  @media(max-width:520px){ .fgrid{ grid-template-columns:1fr; } .offerte{ border-radius:12px; } .offerte .panel{ padding:30px 24px; } .offerte .aside{ padding:34px 26px; } .specs .wrap{ grid-template-columns:1fr; } .specs .cell{ border-right:none; border-bottom:1px solid var(--line); } .specs .cell:last-child{ border-bottom:none; } }
