/* ============================================================
   Loftwoning WPBakery Elements — styling
   ============================================================ */

:root{
  --lwv-brons:#a5825e;
  --lwv-brons-donker:#8a6a48;
  --lwv-brons-licht:#c9a87e;
  --lwv-donker:#23211d;
  --lwv-donkerder:#1a1815;
  --lwv-creme:#fbf8f4;
  --lwv-zand:#f2ede6;
  --lwv-tekst:#4a463f;
  --lwv-grijs:#8b857b;
  --lwv-max:1440px;
  --lwv-pad:clamp(20px,3vw,48px);
}

.lwv{ font-family:'Karla',sans-serif; color:var(--lwv-donker); }
.lwv *{ box-sizing:border-box; }
.lwv-inner{ max-width:var(--lwv-max); margin:0 auto; padding:clamp(60px,8vw,110px) var(--lwv-pad); }
.lwv-narrow{ max-width:1000px; text-align:center; }
.lwv-two{ display:grid; grid-template-columns:repeat(auto-fit,minmax(340px,1fr)); gap:56px 90px; align-items:start; }
.lwv-two-wide{ gap:56px 80px; }
.lwv-two-stretch{ align-items:center; }
.lwv-col{ min-width:0; }

/* Achtergronden */
.lwv-bg-creme{ background:var(--lwv-creme); }
.lwv-bg-zand{ background:var(--lwv-zand); }
.lwv-bg-wit{ background:#fff; }
.lwv-bg-donker{ background:var(--lwv-donker); color:#fff; }

/* Typografie */
.lwv-h1{ font-family:'Jost',sans-serif; font-weight:200; font-size:clamp(38px,4.6vw,66px); line-height:1.06; margin:0 0 22px; color:#fff; }
.lwv-h1-dark{ color:var(--lwv-donker); }
.lwv-h2{ font-family:'Jost',sans-serif; font-weight:200; font-size:clamp(30px,3.2vw,46px); line-height:1.12; margin:0 0 26px; }
.lwv-bg-donker .lwv-h2{ color:#fff; }
.lwv-eyebrow{ font-family:'Jost',sans-serif; font-size:12px; letter-spacing:.3em; text-transform:uppercase; color:var(--lwv-brons); margin:0 0 20px; }
.lwv-bg-donker .lwv-eyebrow, .lwv-hero .lwv-eyebrow, .lwv-infobox .lwv-eyebrow{ color:var(--lwv-brons-licht); }
.lwv-eyebrow-rule{ display:flex; align-items:center; gap:16px; }
.lwv-eyebrow-rule span{ width:56px; height:1px; background:var(--lwv-brons); display:block; }
.lwv-prose p{ font-size:19px; line-height:1.75; color:var(--lwv-tekst); margin:0 0 20px; text-wrap:pretty; }
.lwv-prose p:last-child{ margin-bottom:0; }
.lwv-prose-lead p:first-child{ font-size:20px; line-height:1.7; }
.lwv-bg-donker .lwv-prose p{ color:rgba(255,255,255,.72); }
.lwv-kicker{ font-family:'Jost',sans-serif; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--lwv-grijs); }
.lwv-caption{ font-family:'Jost',sans-serif; font-size:13px; letter-spacing:.14em; text-transform:uppercase; color:#5c5850; margin:14px 0 0; }
.lwv-crumbs{ font-family:'Jost',sans-serif; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--lwv-grijs); margin:0; }
.lwv-crumbs a{ color:var(--lwv-grijs); text-decoration:none; }
.lwv-crumbs a:hover{ color:var(--lwv-brons); }
.lwv-crumbsec .lwv-inner{ padding-top:clamp(28px,4vw,44px); padding-bottom:0; }
.lwv-note{ font-size:13px; line-height:1.6; }

/* Knoppen */
.lwv-btns{ display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; }
.lwv-btn{ display:inline-block; font-family:'Jost',sans-serif; font-size:12px; letter-spacing:.2em;
  text-transform:uppercase; padding:19px 34px; text-decoration:none; transition:background .25s,color .25s,border-color .25s; }
.lwv-btn-solid{ background:var(--lwv-brons); color:#fff; }
.lwv-btn-solid:hover{ background:var(--lwv-donker); color:#fff; }
.lwv-btn-outline{ border:1px solid rgba(35,33,29,.25); color:var(--lwv-donker); }
.lwv-btn-outline:hover{ background:var(--lwv-donker); color:#fff; }
.lwv-bg-donker .lwv-btn-outline{ border-color:rgba(255,255,255,.35); color:#fff; }
.lwv-bg-donker .lwv-btn-outline:hover{ background:#fff; color:var(--lwv-donker); }
.lwv-btn-ghost{ border:1px solid rgba(255,255,255,.4); color:#fff; }
.lwv-btn-ghost:hover{ background:#fff; color:var(--lwv-donker); }
.lwv-textlink{ font-family:'Jost',sans-serif; font-size:12px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--lwv-donker); text-decoration:none; border-bottom:1px solid var(--lwv-brons); padding-bottom:6px; }

/* Afbeeldingsvlakken */
.lwv-slot{ position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden;
  background:#e5dcd0; color:var(--lwv-grijs); font-family:'Jost',sans-serif; font-size:13px;
  letter-spacing:.14em; text-transform:uppercase; text-align:center; padding:20px; }
.lwv-slot img{ width:100%; height:100%; object-fit:cover; display:block; }
.lwv-has-image{ padding:0; }
.lwv-ratio-16x10{ aspect-ratio:16/10; }
.lwv-ratio-16x11{ aspect-ratio:16/11; }
.lwv-ratio-4x3{ aspect-ratio:4/3; }
.lwv-ratio-1x1{ aspect-ratio:1/1; }
.lwv-ratio-3x4{ aspect-ratio:3/4; background:#fff; border:1px solid rgba(35,33,29,.1); }
.lwv-ratio-3x4 img{ object-fit:contain; }
.lwv-ratio-free{ aspect-ratio:auto; }

/* Hero */
.lwv-hero{ position:relative; background:var(--lwv-donker); }
.lwv-hero-bg{ position:absolute; inset:0; }
.lwv-hero-overlay{ position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(90deg,rgba(20,19,16,.82) 0%,rgba(20,19,16,.55) 55%,rgba(20,19,16,.25) 100%); }
.lwv-hero .lwv-inner{ position:relative; display:flex; align-items:center; }
.lwv-hero-large .lwv-inner{ min-height:min(78vh,760px); }
.lwv-hero-medium .lwv-inner{ min-height:min(56vh,520px); }
.lwv-hero-small .lwv-inner{ min-height:min(40vh,380px); }
.lwv-hero-body{ max-width:760px; }
.lwv-hero .lwv-lead p{ font-size:20px; line-height:1.65; color:rgba(255,255,255,.8); margin:0 0 18px; max-width:620px; text-wrap:pretty; }

/* Kaartenraster */
.lwv-cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(310px,1fr)); gap:28px; }
.lwv-grid-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:40px; flex-wrap:wrap; margin-bottom:36px; }
.lwv-grid-head .lwv-h2{ margin:0; }
.lwv-card{ display:flex; flex-direction:column; background:var(--lwv-brons); border-radius:26px;
  padding:16px; text-decoration:none; transition:background .25s; }
.lwv-card:hover{ background:var(--lwv-brons-donker); }
.lwv-card-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:14px 14px 20px; }
.lwv-card-title{ font-family:'Jost',sans-serif; font-weight:300; font-size:26px; letter-spacing:.04em; color:#fff; }
.lwv-card-tag{ font-family:'Jost',sans-serif; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.7); }
.lwv-slot-card{ border-radius:16px; background:rgba(255,255,255,.15); color:#fff; }
.lwv-specs{ list-style:none; margin:24px 0 0; padding:0 14px; display:flex; flex-direction:column; gap:11px; }
.lwv-specs li{ display:flex; align-items:center; gap:12px; font-size:16px; color:rgba(255,255,255,.92); }
.lwv-specs li:before{ content:""; width:14px; height:1px; background:rgba(255,255,255,.55); flex:0 0 auto; }
.lwv-card-link{ margin:auto 14px 14px; padding-top:18px; border-top:1px solid rgba(255,255,255,.3);
  font-family:'Jost',sans-serif; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:#fff; }

/* Kenmerken / gegevens */
.lwv-specsheet{ background:var(--lwv-brons); border-radius:26px; padding:44px 40px; }
.lwv-specsheet h2{ font-family:'Jost',sans-serif; font-weight:300; font-size:22px; letter-spacing:.06em;
  text-transform:uppercase; color:#fff; margin:0 0 26px; }
.lwv-specsheet ul{ list-style:none; margin:0; padding:0; }
.lwv-specsheet li{ display:flex; align-items:baseline; justify-content:space-between; gap:20px;
  padding:15px 0; border-top:1px solid rgba(255,255,255,.28); }
.lwv-specsheet li span{ font-size:16px; color:rgba(255,255,255,.78); }
.lwv-specsheet li strong{ font-family:'Jost',sans-serif; font-weight:300; font-size:19px; color:#fff; text-align:right; }
.lwv-specsheet .lwv-note{ color:rgba(255,255,255,.7); margin:22px 0 0; }
.lwv-specsheet-licht{ background:var(--lwv-zand); border-radius:0; }
.lwv-specsheet-licht h2{ color:var(--lwv-donker); }
.lwv-specsheet-licht li{ border-top-color:rgba(35,33,29,.14); }
.lwv-specsheet-licht li span{ font-family:'Jost',sans-serif; font-size:12px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--lwv-grijs); }
.lwv-specsheet-licht li strong{ color:var(--lwv-donker); font-size:17px; }
.lwv-specsheet-licht .lwv-note{ color:#5c5850; font-size:16px; line-height:1.7; }
.lwv-specsheet-donker{ background:var(--lwv-donker); border-radius:0; }

/* Pijlers */
.lwv-features-row .lwv-features{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:40px; }
.lwv-features-stacked .lwv-features{ display:flex; flex-direction:column; }
.lwv-features-stacked .lwv-feature{ padding:26px 0; border-top:1px solid rgba(255,255,255,.14); }
.lwv-bg-creme .lwv-features-stacked .lwv-feature,
.lwv-bg-zand .lwv-features-stacked .lwv-feature,
.lwv-bg-wit .lwv-features-stacked .lwv-feature{ border-top-color:rgba(35,33,29,.12); }
.lwv-feature h3{ font-family:'Jost',sans-serif; font-weight:300; font-size:22px; margin:0 0 8px; }
.lwv-bg-donker .lwv-feature h3{ color:#fff; }
.lwv-feature p{ margin:0; font-size:16px; line-height:1.7; color:var(--lwv-tekst); text-wrap:pretty; }
.lwv-bg-donker .lwv-feature p{ color:rgba(255,255,255,.62); }

/* Galerij */
.lwv-gallery-grid{ display:grid; grid-template-columns:repeat(var(--lwv-cols,2),minmax(0,1fr)); gap:24px; }
.lwv-gallery-item{ margin:0; min-width:0; }
@media (max-width:900px){ .lwv-gallery-grid{ grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); } }

/* Opties */
.lwv-options-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:1px; background:rgba(255,255,255,.14); }
.lwv-options-grid span{ background:var(--lwv-donker); padding:26px 20px; font-family:'Jost',sans-serif;
  font-size:16px; font-weight:300; color:#fff; }
.lwv-bg-creme .lwv-options-grid, .lwv-bg-zand .lwv-options-grid, .lwv-bg-wit .lwv-options-grid{ background:rgba(35,33,29,.12); }
.lwv-bg-creme .lwv-options-grid span, .lwv-bg-zand .lwv-options-grid span, .lwv-bg-wit .lwv-options-grid span{ background:var(--lwv-creme); color:var(--lwv-donker); }
.lwv-options-tags{ display:flex; flex-wrap:wrap; gap:10px; }
.lwv-options-tags span{ font-family:'Jost',sans-serif; font-size:13px; letter-spacing:.08em; color:#5c5850;
  border:1px solid rgba(35,33,29,.18); padding:10px 16px; }
.lwv-bg-donker .lwv-options-tags span{ color:rgba(255,255,255,.8); border-color:rgba(255,255,255,.28); }

/* CTA */
.lwv-cta .lwv-prose p{ margin-left:auto; margin-right:auto; max-width:620px; }
.lwv-cta .lwv-btns{ justify-content:center; }

/* Infoblok */
.lwv-infobox{ background:var(--lwv-donker); color:#fff; padding:44px 40px; }
.lwv-infobox h3{ font-family:'Jost',sans-serif; font-weight:200; font-size:30px; line-height:1.15; color:#fff; margin:18px 0 16px; }
.lwv-infobox p{ font-size:17px; line-height:1.75; color:rgba(255,255,255,.7); margin:0 0 14px; text-wrap:pretty; }
.lwv-infobox p:last-of-type{ margin-bottom:0; }

@media (max-width:600px){
  .lwv-specsheet, .lwv-infobox{ padding:32px 26px; }
  .lwv-two{ gap:40px; }
}


/* --- WPBakery/Impreza: secties rand-tot-rand laten lopen ---- */
.wpb_row .lwv, .l-section .lwv{ margin-left: 0; margin-right: 0; }
.vc_row .lwv-inner{ max-width: var(--lwv-max); }
/* In de WPBakery-backendeditor: elementen niet laten overlopen */
.compose-mode .lwv-hero .lwv-inner{ min-height: 320px; }