/* ===== Canelobre — secties van de binnenpagina's =====
   Eén-op-één uit Website.dc.html. Waarden staan hier zoals in het ontwerp;
   waar het ontwerp padding buiten een max-width rekent (content-box) is die
   padding hier opgeteld, omdat de blokken op border-box staan. */

/* Blocksy zet een eigen regelhoogte op koppen; het ontwerp laat die los tenzij
   er een waarde staat. Deze regel weegt lichter dan de klasseregels hieronder,
   dus koppen met een eigen regelhoogte houden die gewoon. */
.cnl-block h1,.cnl-block h2,.cnl-block h3,.cnl-block h4{line-height:normal}

/* --- Gedeelde onderdelen die alleen op binnenpagina's voorkomen --- */
.cnl-block .cnl-streep{color:#A8935C;flex:none}
.cnl-block .cnl-ruit-klein{width:6px;height:6px;flex:none;background:#A8935C;transform:rotate(45deg) translateY(-3px)}
.cnl-foto-volgt{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:44px;text-align:center;background:#F4ECD8;border:1px solid rgba(168,147,92,.55)}
.cnl-foto-volgt-label{font-family:'Oswald',sans-serif;font-weight:500;font-size:10px;text-transform:uppercase;letter-spacing:.26em;color:#A8935C}
.cnl-block .cnl-foto-volgt-tekst{font-family:'Lora',Georgia,serif;font-style:italic;font-size:15px;line-height:1.7;color:#5A463E;max-width:340px}

/* ===================== Paginaheader ===================== */
.cnl-block.cnl-pkop{position:relative;height:calc(54vh + 111px);min-height:551px;padding-top:111px;box-sizing:border-box;overflow:hidden;display:flex;align-items:center;justify-content:center;margin:0}
.cnl-block .cnl-pkop-foto{position:absolute;inset:0;background:#2E2620;background-size:cover;background-position:center}
.cnl-block .cnl-pkop-verloop{position:absolute;inset:0;background:linear-gradient(180deg,rgba(31,22,19,.42) 0%,rgba(31,22,19,.30) 45%,rgba(31,22,19,.62) 100%)}
.cnl-block .cnl-pkop-inner{position:relative;text-align:center;max-width:900px;padding:0 40px;display:flex;flex-direction:column;align-items:center;gap:22px}
.cnl-block .cnl-pkop-titel{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;font-size:62px;line-height:1.08;color:#F4ECD8;text-wrap:balance}
.cnl-block .cnl-pkop-sub{margin:0;font-family:'Lora',Georgia,serif;font-size:18px;line-height:1.6;color:rgba(244,236,216,.82)}

/* ===================== Intro ===================== */
.cnl-block.cnl-intro{position:relative;isolation:isolate;background:#FBF6EA;padding:104px 7vw 96px}
/* Mediterrane ruitrand: het patroon vervaagt naar boven, met een lijn en een
   ruitpunt op de onderrand. Aan of uit via de schakelaar in het blok. */
.cnl-block .cnl-ruitrand{position:absolute;inset:0;z-index:-1;pointer-events:none}
.cnl-block .cnl-ruitrand-patroon{position:absolute;left:0;right:0;bottom:0;height:100px;background-image:linear-gradient(45deg,rgba(185,106,75,.16) 25%,transparent 25%,transparent 75%,rgba(185,106,75,.16) 75%),linear-gradient(45deg,rgba(185,106,75,.16) 25%,transparent 25%,transparent 75%,rgba(185,106,75,.16) 75%);background-size:28px 28px;background-position:0 0,14px 14px;-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 100%)}
.cnl-block .cnl-ruitrand-lijn{position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(185,106,75,.45) 22%,rgba(185,106,75,.45) 78%,transparent 100%)}
.cnl-block .cnl-ruitrand-punt{position:absolute;left:50%;bottom:0;width:40px;height:40px;transform:translate(-50%,50%) rotate(45deg);border-right:1px solid rgba(185,106,75,.45);border-bottom:1px solid rgba(185,106,75,.45)}
.cnl-block .cnl-intro-inner{max-width:1120px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:40px}
.cnl-block .cnl-intro-titel{margin:0;text-align:center;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:46px;line-height:1.14;color:#392722;text-wrap:balance}
.cnl-block .cnl-intro-tekst{margin:0;max-width:760px;text-align:center;font-family:'Lora',Georgia,serif;font-size:17.5px;line-height:1.85;color:#5A463E;text-wrap:pretty}
.cnl-block .cnl-intro-woorden{margin:16px 0 0;padding:26px 0;list-style:none;width:100%;border-top:1px solid rgba(168,147,92,.55);border-bottom:1px solid rgba(168,147,92,.55);display:flex;flex-wrap:wrap;justify-content:center;gap:16px 44px}
.cnl-block .cnl-intro-woorden li{display:flex;align-items:center;gap:10px;font-family:'Oswald',sans-serif;font-weight:500;font-size:12px;text-transform:uppercase;letter-spacing:.2em;color:#5A463E}
.cnl-block .cnl-intro-woorden .cnl-ruit{opacity:.75}

/* ===================== Tekstblokken met checklist ===================== */
.cnl-block.cnl-tblok{background:#FBF6EA;padding:104px 7vw;display:flex;flex-direction:column;gap:96px}
.cnl-block .cnl-tblok-rij{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center;max-width:1200px;margin:0 auto;width:100%}
.cnl-block .cnl-tblok-foto{aspect-ratio:4/3;border-radius:10px;overflow:hidden;box-shadow:0 18px 40px rgba(57,39,34,.14);background:#EBDFC4;order:1}
.cnl-block .cnl-tblok-foto img{width:100%;height:100%;object-fit:cover;display:block}
.cnl-block .cnl-tblok-tekst{order:2;display:flex;flex-direction:column;gap:22px;max-width:560px}
.cnl-block .cnl-tblok-rij--omgekeerd .cnl-tblok-foto{order:2}
.cnl-block .cnl-tblok-rij--omgekeerd .cnl-tblok-tekst{order:1}
.cnl-block .cnl-tblok-titel{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:42px;line-height:1.14;color:#392722;text-wrap:balance}
.cnl-block .cnl-tblok-body{margin:0;font-family:'Lora',Georgia,serif;font-size:16.5px;line-height:1.78;color:#5A463E}
.cnl-block .cnl-tblok-check{margin:4px 0 0;padding:20px 0 0;list-style:none;display:flex;flex-direction:column;gap:11px;border-top:1px solid rgba(90,70,62,.18)}
.cnl-block .cnl-tblok-check li{display:flex;gap:12px;font-family:'Lora',Georgia,serif;font-size:15.5px;line-height:1.6;color:#5A463E}
.cnl-block .cnl-tblok-check .cnl-vink{color:#A8935C}
.cnl-block .cnl-tblok-knoppen{display:flex;gap:16px;margin-top:8px;flex-direction:row;justify-content:flex-start}
.cnl-block .cnl-tblok-knoppen--omgekeerd{flex-direction:row-reverse;justify-content:flex-end}

/* ===================== Faciliteiten sliders ===================== */
.cnl-block.cnl-facsl{background:#FBF6EA;padding:104px 7vw;display:flex;flex-direction:column;gap:104px}
.cnl-block .cnl-facsl-rij{display:grid;grid-template-columns:1fr 1fr;gap:68px;align-items:center;max-width:1220px;margin:0 auto;width:100%}
.cnl-block .cnl-facsl-media{order:1;position:relative}
.cnl-block .cnl-facsl-tekst{order:2;display:flex;flex-direction:column;gap:20px;max-width:520px}
.cnl-block .cnl-facsl-rij--omgekeerd .cnl-facsl-media{order:2}
.cnl-block .cnl-facsl-rij--omgekeerd .cnl-facsl-tekst{order:1}
.cnl-block .cnl-facsl-kader{position:relative;aspect-ratio:3/2;border-radius:10px;overflow:hidden;background:#2E2620;box-shadow:0 18px 42px rgba(57,39,34,.16)}
.cnl-block .cnl-facsl-dias{position:absolute;inset:0}
.cnl-block .cnl-facsl-dia{position:absolute;inset:0;opacity:0;transition:opacity .4s}
.cnl-block .cnl-facsl-dia.is-actief{opacity:1}
.cnl-block .cnl-facsl-dia img{width:100%;height:100%;object-fit:cover;display:block}
.cnl-block .cnl-facsl-schaduw{position:absolute;left:0;right:0;bottom:0;height:44%;background:linear-gradient(180deg,rgba(31,22,19,0) 0%,rgba(31,22,19,.62) 100%);pointer-events:none}
.cnl-block .cnl-facsl-caption{position:absolute;left:20px;bottom:18px;font-family:'Lora',Georgia,serif;font-style:italic;font-size:14px;color:rgba(251,246,234,.94);max-width:70%;text-shadow:0 1px 10px rgba(31,22,19,.6)}
.cnl-block .cnl-facsl-teller{position:absolute;right:20px;bottom:18px;font-family:'Oswald',sans-serif;font-weight:500;font-size:11px;letter-spacing:.2em;color:rgba(251,246,234,.85)}
.cnl-block .cnl-facsl-pijl{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:1px solid rgba(251,246,234,.55);border-radius:50%;background:rgba(31,22,19,.34);color:#FBF6EA;font-size:17px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:background .25s,border-color .25s}
.cnl-block .cnl-facsl-pijl:hover{background:rgba(31,22,19,.72);border-color:#C6B785}
.cnl-block .cnl-facsl-pijl--links{left:16px}
.cnl-block .cnl-facsl-pijl--rechts{right:16px}
.cnl-block .cnl-facsl-streepjes{display:flex;gap:10px;margin-top:16px}
.cnl-block .cnl-facsl-streep{flex:1;height:3px;border:none;padding:0;cursor:pointer;background:rgba(90,70,62,.22);transition:background .25s}
.cnl-block .cnl-facsl-streep.is-actief{background:#5A463E}
.cnl-block .cnl-facsl-streep:hover{background:#A8935C}
.cnl-block .cnl-facsl-titel{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:40px;line-height:1.14;color:#392722;text-wrap:balance}
.cnl-block .cnl-facsl-body{margin:0;font-family:'Lora',Georgia,serif;font-size:16.5px;line-height:1.78;color:#5A463E}
.cnl-block .cnl-facsl-labels{margin:2px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:9px}
.cnl-block .cnl-facsl-labels li{font-family:'Oswald',sans-serif;font-weight:500;font-size:10.5px;text-transform:uppercase;letter-spacing:.2em;color:#7C7A54;border:1px solid rgba(168,147,92,.55);border-radius:2px;padding:7px 12px}

/* ===================== Duo blok ===================== */
.cnl-block.cnl-duo{background:#2E2620;padding:104px 7vw}
.cnl-block .cnl-duo-inner{max-width:1120px;margin:0 auto;display:flex;flex-direction:column;gap:56px}
.cnl-block .cnl-duo-kop{display:flex;flex-direction:column;gap:18px;max-width:700px}
.cnl-block .cnl-duo-titel{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:300;font-size:46px;line-height:1.12;color:#F4ECD8;text-wrap:balance}
.cnl-block .cnl-duo-intro{margin:0;font-family:'Lora',Georgia,serif;font-size:17px;line-height:1.75;color:rgba(244,236,216,.78)}
.cnl-block .cnl-duo-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(198,183,133,.35)}
.cnl-block .cnl-duo-deel{background:#2E2620;padding:0 44px 44px;display:flex;flex-direction:column;gap:22px}
/* content-box, niet border-box: in het ontwerp valt de padding buiten de
   16:10-verhouding, waardoor dit kader 28px hoger uitkomt. */
.cnl-block .cnl-duo-foto{box-sizing:content-box;position:relative;aspect-ratio:16/10;margin:0 -44px 6px;background:#241E19;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:36px;text-align:center;border-bottom:1px solid rgba(198,183,133,.28);overflow:hidden}
.cnl-block .cnl-duo-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.cnl-block .cnl-duo-foto .cnl-foto-volgt{background:#241E19;border:0}
.cnl-block .cnl-duo-foto .cnl-foto-volgt-tekst{font-size:14px;line-height:1.65;color:rgba(244,236,216,.6);max-width:320px}
.cnl-block .cnl-duo-dtitel{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:30px;line-height:1.15;color:#C6B785}
.cnl-block .cnl-duo-dtekst{margin:0;font-family:'Lora',Georgia,serif;font-size:16px;line-height:1.75;color:rgba(244,236,216,.82)}
.cnl-block .cnl-duo-punten{margin:0;padding:20px 0 0;list-style:none;display:flex;flex-direction:column;gap:11px;border-top:1px solid rgba(198,183,133,.28)}
.cnl-block .cnl-duo-punten li{display:flex;gap:12px;font-family:'Lora',Georgia,serif;font-size:15px;line-height:1.6;color:rgba(244,236,216,.8)}

/* ===================== Kamertype ===================== */
.cnl-block.cnl-ktype{background:#FBF6EA;padding:104px 7vw}
.cnl-block .cnl-ktype-boven{max-width:1440px;margin:0 auto;display:grid;grid-template-columns:1.95fr 1fr;gap:56px;align-items:start}
.cnl-block .cnl-ktype-media{display:flex;flex-direction:column;gap:18px}
.cnl-block .cnl-ktype-hero{aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:#EBDFC4;box-shadow:0 20px 46px rgba(57,39,34,.16)}
.cnl-block .cnl-ktype-hero img{width:100%;height:100%;object-fit:cover;display:block}
.cnl-block .cnl-ktype-thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.cnl-block .cnl-ktype-thumb{aspect-ratio:4/3;border-radius:8px;overflow:hidden;background:#EBDFC4}
.cnl-block .cnl-ktype-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.cnl-block .cnl-ktype-tekst{display:flex;flex-direction:column;gap:24px}
.cnl-block .cnl-ktype-naam{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:42px;line-height:1.14;color:#392722}
.cnl-block .cnl-ktype-body{margin:0;font-family:'Lora',Georgia,serif;font-size:16.5px;line-height:1.78;color:#5A463E}
.cnl-block .cnl-ktype-check{margin:0;padding:20px 0 0;list-style:none;display:flex;flex-direction:column;gap:11px;border-top:1px solid rgba(90,70,62,.18)}
.cnl-block .cnl-ktype-check li{display:flex;gap:12px;font-family:'Lora',Georgia,serif;font-size:15.5px;line-height:1.6;color:#5A463E}
.cnl-block .cnl-ktype-check .cnl-vink{color:#A8935C}
.cnl-block .cnl-ktype-boeken{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-top:14px}
.cnl-block .cnl-ktype-onder{max-width:1200px;margin:88px auto 0;border-top:1px solid rgba(90,70,62,.18);padding-top:56px;display:grid;grid-template-columns:1.45fr 1fr;gap:72px;align-items:start}
.cnl-block .cnl-ktype-fac{display:flex;flex-direction:column;gap:30px}
.cnl-block .cnl-ktype-factitel{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:38px;line-height:1.15;color:#392722}
.cnl-block .cnl-ktype-faclijst{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:2px 40px}
.cnl-block .cnl-ktype-faclijst li{display:flex;gap:14px;align-items:baseline;padding:13px 0;border-bottom:1px solid rgba(90,70,62,.14)}
.cnl-block .cnl-ktype-facregel{display:flex;flex-direction:column;gap:3px}
.cnl-block .cnl-ktype-facnaam{font-family:'Lora',Georgia,serif;font-size:15.5px;line-height:1.5;color:#392722}
.cnl-block .cnl-ktype-facnoot{font-family:'Lora',Georgia,serif;font-style:italic;font-size:13.5px;line-height:1.5;color:#8A7466}
.cnl-block .cnl-ktype-keuken{display:flex;flex-direction:column;gap:20px;background:#F4ECD8;border:1px solid rgba(90,70,62,.16);padding:32px 34px;margin-top:6px}
.cnl-block .cnl-ktype-keukenkop{margin:0;font-family:'Oswald',sans-serif;font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.26em;color:#A8935C}
.cnl-block .cnl-ktype-keukenlijst{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px 40px}
.cnl-block .cnl-ktype-keukenlijst li{display:flex;gap:14px;align-items:baseline;font-family:'Lora',Georgia,serif;font-size:15.5px;line-height:1.5;color:#392722}
.cnl-block .cnl-ktype-diensten{display:flex;flex-direction:column;gap:26px;background:#F4ECD8;border:1px solid rgba(90,70,62,.16);padding:40px 38px}
.cnl-block .cnl-ktype-dtitel{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:30px;line-height:1.18;color:#392722}
.cnl-block .cnl-ktype-dlijst{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:11px}
.cnl-block .cnl-ktype-dlijst li{display:flex;gap:12px;font-family:'Lora',Georgia,serif;font-size:15px;line-height:1.6;color:#5A463E}

/* ===================== Kamers per naam ===================== */
.cnl-block.cnl-klijst{background:#F4ECD8;padding:100px 7vw}
.cnl-block .cnl-klijst-inner{max-width:1000px;margin:0 auto;display:flex;flex-direction:column;gap:14px}
.cnl-block .cnl-klijst-titel{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:42px;line-height:1.14;color:#392722}
.cnl-block .cnl-klijst-tekst{margin:0 0 30px;font-family:'Lora',Georgia,serif;font-size:16px;line-height:1.75;color:#5A463E;max-width:680px}
.cnl-block .cnl-klijst-rij{border-top:1px solid rgba(90,70,62,.22)}
.cnl-block .cnl-klijst-knop{width:100%;background:transparent;border:0;padding:24px 0;cursor:pointer;display:flex;align-items:baseline;justify-content:space-between;gap:28px;text-align:left;transition:opacity .2s}
.cnl-block .cnl-klijst-knop:hover{opacity:.7}
.cnl-block .cnl-klijst-naamgroep{display:flex;align-items:baseline;gap:20px}
.cnl-block .cnl-klijst-naam{font-family:'Cormorant Garamond',Georgia,serif;font-weight:500;font-size:29px;color:#392722}
.cnl-block .cnl-klijst-label{font-family:'Oswald',sans-serif;font-weight:500;font-size:10.5px;text-transform:uppercase;letter-spacing:.26em;color:#A8935C}
.cnl-block .cnl-klijst-teken{font-family:'Lora',Georgia,serif;font-size:22px;line-height:1;color:#A8935C;flex:none}
.cnl-block .cnl-klijst-body{margin:0;padding:0 0 30px;max-width:760px;font-family:'Lora',Georgia,serif;font-size:16px;line-height:1.8;color:#5A463E}
.cnl-block .cnl-klijst-slot{border-top:1px solid rgba(90,70,62,.22)}

/* ===================== Category cards ===================== */
.cnl-block.cnl-cards{background:#F4ECD8;padding:100px 7vw}
.cnl-block .cnl-cards-inner{max-width:1200px;margin:0 auto}
.cnl-block .cnl-cards-titel{margin:0 0 48px;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:42px;color:#392722}
.cnl-block .cnl-cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:32px}
.cnl-block .cnl-card{background:#FFFFFF;border-radius:8px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 8px 26px rgba(57,39,34,.08)}
.cnl-block .cnl-card-foto{aspect-ratio:3/2;overflow:hidden;background:#EBDFC4}
.cnl-block .cnl-card-foto img{width:100%;height:100%;object-fit:cover;display:block}
.cnl-block .cnl-card-body{padding:28px 28px 30px;display:flex;flex-direction:column;gap:12px;flex:1}
.cnl-block .cnl-card-naam{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:27px;color:#392722}
.cnl-block .cnl-card-tekst{margin:0;font-family:'Lora',Georgia,serif;font-size:15px;line-height:1.65;color:#5A463E;flex:1}
.cnl-block .cnl-card-body .cnl-link-label{letter-spacing:.12em;margin-top:6px}

/* ===================== Fotoslider ===================== */
.cnl-block.cnl-fslider{background:#FBF6EA;padding:96px 0 104px;overflow:hidden}
.cnl-block .cnl-fslider-kop{max-width:1200px;margin:0 auto 46px;padding:34px 7vw 0;border-top:1px solid rgba(90,70,62,.22);display:flex;align-items:flex-end;justify-content:space-between;gap:40px}
.cnl-block .cnl-fslider-koptekst{display:flex;flex-direction:column;gap:12px}
.cnl-block .cnl-fslider-titel{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:40px;line-height:1.14;color:#392722}
.cnl-block .cnl-fslider-tekst{margin:0;font-family:'Lora',Georgia,serif;font-size:16px;line-height:1.7;color:#5A463E;max-width:560px}
.cnl-block .cnl-fslider-bediening{display:flex;align-items:center;gap:16px;flex:none}
.cnl-block .cnl-fslider-teller{font-family:'Oswald',sans-serif;font-weight:500;font-size:11px;letter-spacing:.2em;color:#8A7466}
.cnl-block .cnl-fslider-pijl{width:46px;height:46px;border:1px solid rgba(90,70,62,.35);border-radius:50%;background:transparent;color:#392722;font-size:18px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:border-color .25s,color .25s}
.cnl-block .cnl-fslider-pijl:hover{border-color:#A8935C;color:#A8935C}
.cnl-block .cnl-fslider-venster{width:100%;overflow:hidden}
.cnl-block .cnl-fslider-spoor{display:flex;gap:28px;transition:transform 620ms cubic-bezier(.22,.61,.36,1);will-change:transform}
.cnl-block .cnl-fslider-dia{flex:0 0 27vw;aspect-ratio:14/15;overflow:hidden;background:#2E2620}
.cnl-block .cnl-fslider-dia img{width:100%;height:100%;object-fit:cover;display:block}

/* ===================== Testimonials ===================== */
.cnl-block.cnl-testi{background:#FBF6EA;padding:58px 7vw 100px}
.cnl-block .cnl-testi-inner{max-width:1200px;margin:0 auto}
.cnl-block .cnl-testi-kop{text-align:center;display:flex;flex-direction:column;gap:12px;margin-bottom:56px}
.cnl-block .cnl-testi-titel{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:42px;color:#392722;text-wrap:balance}
.cnl-block .cnl-testi-sub{margin:0;font-family:'Lora',Georgia,serif;font-style:italic;font-size:17px;color:#7C7A54}
.cnl-block .cnl-testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.cnl-block .cnl-testi-kaart{margin:0;background:#F4ECD8;border-radius:8px;padding:36px 34px;display:flex;flex-direction:column;gap:20px}
.cnl-block .cnl-testi-tekst{margin:0;font-family:'Lora',Georgia,serif;font-size:16px;line-height:1.75;color:#5A463E;flex:1}
.cnl-block .cnl-testi-voet{display:flex;align-items:baseline;gap:12px;border-top:1px solid rgba(90,70,62,.18);padding-top:18px}
.cnl-block .cnl-testi-platform{font-family:'Oswald',sans-serif;font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.26em;color:#A8935C}
.cnl-block .cnl-testi-score{font-family:'Cormorant Garamond',Georgia,serif;font-weight:500;font-size:26px;color:#392722}
.cnl-block .cnl-testi-knop{display:flex;justify-content:center;margin-top:52px}

/* ===================== Contact ===================== */
.cnl-block.cnl-contact{background:#FBF6EA;padding:104px 7vw}
.cnl-block .cnl-contact-inner{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:1.25fr 1fr;gap:72px;align-items:start}
.cnl-block .cnl-contact-formulier{display:flex;flex-direction:column;gap:26px}
.cnl-block .cnl-contact-titel{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:42px;color:#392722}
.cnl-block .cnl-contact-noot{margin:0;font-family:'Lora',Georgia,serif;font-style:italic;font-size:14px;color:#7C7A54}
.cnl-block .cnl-contact-leeg{margin:0;font-family:'Lora',Georgia,serif;font-style:italic;font-size:15px;color:#8A7466}
.cnl-block .cnl-contact-kaart{background:#F4ECD8;border-radius:8px;padding:44px 40px;display:flex;flex-direction:column;gap:30px}
.cnl-block .cnl-contact-groep{display:flex;flex-direction:column;gap:12px}
.cnl-block .cnl-contact-groep--lijn{border-top:1px solid rgba(90,70,62,.18);padding-top:26px}
.cnl-block .cnl-contact-kop{margin:0;font-family:'Oswald',sans-serif;font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.26em;color:#A8935C}
.cnl-block .cnl-contact-adres{margin:0;font-family:'Lora',Georgia,serif;font-size:16px;line-height:1.8;color:#5A463E}
.cnl-block .cnl-contact-link{font-family:'Lora',Georgia,serif;font-size:16px;color:#A8935C;text-decoration:none;transition:color .25s}
.cnl-block .cnl-contact-link:hover{color:#B96A4B}
.cnl-block .cnl-contact-tijd{display:flex;justify-content:space-between;gap:16px;font-family:'Lora',Georgia,serif;font-size:15.5px;color:#5A463E}
.cnl-block .cnl-contact-tijdwaarde{color:#392722}
.cnl-block .cnl-contact-boeken{align-items:flex-start;gap:8px}
.cnl-block .cnl-contact-knopnoot{font-family:'Lora',Georgia,serif;font-style:italic;font-size:13px;color:#A8935C}

/* --- Contactformulier: WPForms in de vormgeving van het ontwerp --- */
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container{margin:0}
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form .wpforms-field{padding:0}
/* Naam en e-mail naast elkaar, telefoon smal, bericht over de volle breedte —
   zoals het formulier in het ontwerp is ingedeeld. */
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form .wpforms-field-container{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form .wpforms-field-textarea,
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form .cnl-veld-smal{grid-column:1 / -1}
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form .cnl-veld-smal{max-width:340px}
/* WPForms voegt onzichtbare velden toe tegen spam. Ze dragen als enige een
   data-field-type op de omhulling; zo blijven ze staan voor de spamcontrole
   maar nemen ze geen plek in het raster in. */
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form .wpforms-field[data-field-type]{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form .wpforms-field-label{font-family:'Oswald',sans-serif;font-weight:500;font-size:12.5px;line-height:normal;text-transform:uppercase;letter-spacing:.2em;color:#5A463E;margin:0 0 9px}
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form .wpforms-required-label{display:none}
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form input[type=text],
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form input[type=email],
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form input[type=tel],
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form textarea{width:100%;max-width:none;font-family:'Lora',Georgia,serif;font-size:15.5px;line-height:1.7;color:#2E2620;background:#FFFFFF;border:1px solid rgba(90,70,62,.28);border-radius:3px;padding:14px 16px;outline:none;box-shadow:none}
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form input[type=text],
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form input[type=email],
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form input[type=tel]{height:auto;font-size:17px;line-height:1.7;padding:12px 14px}
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form textarea{resize:vertical;height:188px}
/* Knop en de regel ernaast delen één rij, zoals in het ontwerp. */
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:0 18px}
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form .wpforms-field-container{grid-column:1 / -1}
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form .wpforms-submit-container{grid-column:1;padding:0;margin-top:24px}
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form .cnl-contact-noot{grid-column:2;margin-top:24px}
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form button[type=submit]{display:inline-flex;align-items:center;justify-content:center;font-family:'Oswald','Arial Narrow',sans-serif;font-weight:500;font-size:14px;line-height:normal;letter-spacing:.12em;text-transform:uppercase;background:#B96A4B;color:#FBF6EA;border:1px solid transparent;border-radius:6px;padding:16px 34px;line-height:1.5;height:auto;cursor:pointer;transition:background .25s}
.cnl-block.cnl-contact .cnl-contact-formulier div.wpforms-container form.wpforms-form button[type=submit]:hover{background:#A85C3F;color:#FBF6EA}

/* ===================== Full-width highlight op een binnenpagina =====================
   Claude Design gebruikt hier net iets andere maten dan op de homepage:
   118 in plaats van 120 padding, 620 in plaats van 600 breed, en een kop
   van 42 in plaats van 44. Het vulscript zet daarom de klasse hieronder. */
.cnl-block.cnl-handig--binnenpagina{padding:118px 7vw}
.cnl-block.cnl-handig--binnenpagina .cnl-handig-inner{max-width:620px;gap:26px}
.cnl-block.cnl-handig--binnenpagina .cnl-handig-titel{font-size:42px}
.cnl-block.cnl-handig--binnenpagina .cnl-handig-lijst{gap:15px}

/* ===================== USP grid op een binnenpagina =====================
   Zonder foto's: kolommen die zichzelf verdelen en een iets kleinere letter. */
.cnl-block.cnl-usp--zonder-fotos{padding:104px 7vw;gap:56px}
.cnl-block.cnl-usp--zonder-fotos .cnl-usp-titel{font-size:48px;line-height:1.12}
.cnl-block.cnl-usp--zonder-fotos .cnl-usp-grid{display:flex;flex-wrap:wrap;gap:48px;max-width:1200px;margin:0 auto;width:100%}
.cnl-block.cnl-usp--zonder-fotos .cnl-usp-kolom{flex:1 1 230px;gap:16px;padding-top:24px}
.cnl-block.cnl-usp--zonder-fotos .cnl-usp-kop{font-size:27px;line-height:1.2}

/* ===================== Uitvalsbasis op een binnenpagina ===================== */
.cnl-block.cnl-omgeving--zonder-titel .cnl-omgeving-rijen{gap:72px}
/* Zonder foto neemt de plaatsvervanger de plaats van het fotokader in. In het
   ontwerp draagt hij zelf de 4:3-verhouding, met de padding daarbuiten
   (content-box): zo'n rij valt daardoor 22px hoger uit dan een rij met foto. */
.cnl-block .cnl-omgeving-foto:has(.cnl-foto-volgt){aspect-ratio:auto;overflow:visible;background:none}
.cnl-block .cnl-omgeving-foto .cnl-foto-volgt{box-sizing:content-box;aspect-ratio:4/3;width:auto;height:auto;border-radius:8px}
.cnl-block .cnl-omgeving-foto .cnl-foto-volgt-tekst{font-size:14px;line-height:1.65;color:#8A7466;max-width:none}

/* ===================== Smallere schermen ===================== */
@media (max-width:1100px){
  .cnl-block .cnl-ktype-boven,
  .cnl-block .cnl-ktype-onder,
  .cnl-block .cnl-contact-inner{grid-template-columns:1fr;gap:48px}
  .cnl-block .cnl-testi-grid{grid-template-columns:1fr}
  .cnl-block .cnl-fslider-dia{flex-basis:44vw}
}
@media (max-width:860px){
  .cnl-block.cnl-pkop{height:auto;min-height:360px;padding:96px 0}
  .cnl-block .cnl-pkop-titel{font-size:42px}
  .cnl-block .cnl-tblok-rij,
  .cnl-block .cnl-facsl-rij,
  .cnl-block .cnl-duo-grid{grid-template-columns:1fr;gap:40px}
  .cnl-block .cnl-tblok-rij--omgekeerd .cnl-tblok-foto,
  .cnl-block .cnl-facsl-rij--omgekeerd .cnl-facsl-media{order:1}
  .cnl-block .cnl-tblok-rij--omgekeerd .cnl-tblok-tekst,
  .cnl-block .cnl-facsl-rij--omgekeerd .cnl-facsl-tekst{order:2}
  .cnl-block .cnl-ktype-faclijst,
  .cnl-block .cnl-ktype-keukenlijst{grid-template-columns:1fr}
  .cnl-block .cnl-intro-titel,
  .cnl-block .cnl-tblok-titel,
  .cnl-block .cnl-cards-titel,
  .cnl-block .cnl-testi-titel,
  .cnl-block .cnl-contact-titel,
  .cnl-block .cnl-ktype-naam{font-size:32px}
  .cnl-block .cnl-fslider-kop{flex-direction:column;align-items:flex-start;gap:24px}
  .cnl-block .cnl-fslider-dia{flex-basis:72vw}
}

/* ===================== Huisregels ===================== */
.cnl-block.cnl-hregels{background:#FBF6EA;padding:104px 7vw}
.cnl-block .cnl-hregels-inner{max-width:920px;margin:0 auto;display:flex;flex-direction:column;gap:56px}
.cnl-block .cnl-hregels-intro{margin:0;font-family:'Lora',Georgia,serif;font-size:18.5px;line-height:1.8;color:#5A463E;text-wrap:pretty}
.cnl-block .cnl-hregels-groep{display:grid;grid-template-columns:220px 1fr;gap:40px;align-items:start;border-top:1px solid rgba(90,70,62,.18);padding-top:28px}
.cnl-block .cnl-hregels-kop{display:flex;flex-direction:column;gap:8px}
.cnl-block .cnl-hregels-nummer{font-family:'Oswald',sans-serif;font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.26em;color:#A8935C}
.cnl-block .cnl-hregels-titel{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:30px;line-height:1.15;color:#392722}
.cnl-block .cnl-hregels-lijst{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:13px}
.cnl-block .cnl-hregels-lijst li{display:flex;gap:14px;font-family:'Lora',Georgia,serif;font-size:16.5px;line-height:1.7;color:#5A463E}
.cnl-block .cnl-hregels-slot{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:8px}
.cnl-block .cnl-hregels-noot{font-family:'Lora',Georgia,serif;font-style:italic;font-size:13px;color:#A8935C}
.cnl-block .cnl-hregels-noot a{color:#A8935C}

@media (max-width:860px){
  .cnl-block .cnl-hregels-groep{grid-template-columns:1fr;gap:18px}
  .cnl-block .cnl-hregels-titel{font-size:26px}
}

/* ===== Kamerpagina: de foto's op een telefoon =====
   De miniatuurstrook wordt op mobiel 100 bij 75 pixels — daar is niets op te
   zien, en dezelfde foto's staan verderop al in de fotoslider. Op een telefoon
   verdwijnt de strook daarom en wordt de grote foto zelf een slider. */
.cnl-block .cnl-ktype-hero { position: relative; }

@media (max-width: 900px) {
  .cnl-block .cnl-ktype-thumbs { display: none; }
  .cnl-block .cnl-ktype-hero { aspect-ratio: 4 / 3; }
}

/* --- De fotorij is met de hand te verslepen --- */
.cnl-block .cnl-fslider-venster { touch-action: pan-y; cursor: grab; }
.cnl-block .cnl-fslider-venster.is-sleepend { cursor: grabbing; }
.cnl-block .cnl-fslider-spoor { user-select: none; -webkit-user-select: none; }
.cnl-block .cnl-fslider-dia img { -webkit-user-drag: none; user-drag: none; pointer-events: none; }

/* ===== Verticale ruimte op een telefoon =====
   De secties houden op elk scherm 96 tot 104 pixels boven en onder aan. Naast
   elkaar opgeteld is dat op een breed scherm rustig, maar op een telefoon zit
   er dan al gauw tweehonderd pixels leegte tussen twee secties — een kwart
   scherm. Hier gaat dat terug naar zestig, wat nog steeds lucht geeft maar
   niet meer als een gat leest. De hero en de paginakop regelen hun eigen
   hoogte en blijven buiten schot. */
@media (max-width: 700px) {
  .site-main .cnl-block:not(.cnl-hero):not(.cnl-pkop):not(.cnl-recensies) {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}

/* ===== Kernwoorden onder de intro, op een telefoon =====
   Negen woorden van verschillende lengte, gecentreerd naast elkaar met
   afbreken waar het uitkomt: dat geeft rafelige rijen. In twee kolommen met
   een vast beginpunt staat alles recht onder elkaar en lees je de lijst in
   één blik. Ruitjes uit de huisstijl blijven als opsommingsteken staan. */
@media (max-width: 700px) {
  .cnl-block .cnl-intro-woorden {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 18px;
    padding: 6px 0;
    text-align: left;
  }
  .cnl-block .cnl-intro-woorden li {
    padding: 13px 0;
    gap: 9px;
    font-size: 11.5px;
    letter-spacing: .14em;
    border-bottom: 1px solid rgba(168, 147, 92, .28);
  }
  /* De onderste rij hoeft geen lijn: de lijst heeft zelf al een onderrand. */
  .cnl-block .cnl-intro-woorden li:nth-last-child(-n+2):nth-child(odd),
  .cnl-block .cnl-intro-woorden li:nth-last-child(-n+2):nth-child(odd) + li {
    border-bottom: 0;
  }
  .cnl-block .cnl-intro-woorden .cnl-ruit { flex: none; }
}

/* ===== Tekstkolommen die onder hun foto komen te staan =====
   Naast een foto is een regelbreedte van 520 tot 560 pixels prettig lezen.
   Zodra de twee kolommen onder elkaar klappen staat de foto over de volle
   breedte en de tekst niet — op een tablet scheelt dat ruim honderd pixels
   en oogt het alsof de tekst scheef hangt. Gestapeld vult de tekst dus mee. */
@media (max-width: 860px) {
  .cnl-block .cnl-facsl-tekst,
  .cnl-block .cnl-tblok-tekst,
  .cnl-block .cnl-duo-tekst { max-width: none; }
}

/* ===== Koppen op een tablet in staande stand =====
   Onder 860 pixels staan de koppen op hun kleine maat, daarboven meteen op de
   volle bureaubladmaat. Een iPad Pro is 1024 breed en krijgt dus een kop van
   62 pixels op een scherm dat een derde smaller is dan een laptop — dat vult
   het beeld te veel. Tussen 861 en 1150 komt daar een tussenstap. */
@media (min-width: 861px) and (max-width: 1150px) {
  .cnl-block .cnl-pkop-titel   { font-size: 50px; }
  .cnl-block .cnl-usp-titel    { font-size: 44px; }
  .cnl-block .cnl-intro-titel,
  .cnl-block .cnl-duo-titel    { font-size: 38px; }
  .cnl-block .cnl-kamers-titel,
  .cnl-block .cnl-omgeving-titel { font-size: 38px; }
  .cnl-block .cnl-tblok-titel,
  .cnl-block .cnl-cards-titel,
  .cnl-block .cnl-ktype-naam,
  .cnl-block .cnl-klijst-titel,
  .cnl-block .cnl-testi-titel,
  .cnl-block .cnl-contact-titel,
  .cnl-block .cnl-handig-titel { font-size: 37px; }
  .cnl-block .cnl-fslider-titel,
  .cnl-block .cnl-facsl-titel,
  .cnl-block .cnl-social-titel { font-size: 36px; }
  .cnl-block .cnl-ktype-factitel,
  .cnl-block .cnl-nieuwsbrief-titel { font-size: 34px; }
}

/* --- Paginakop op een tablet in staande stand ---
   De hoogte is 54% van het scherm plus de balk. Op een laptop komt dat op
   zo'n 600 pixels uit, maar een iPad Pro is 1366 pixels hoog en dan wordt de
   kop 849 pixels — bijna twee derde van het beeld voordat er iets te lezen is.
   In deze band schaalt hij minder mee en zit er een bovengrens op. */
@media (min-width: 861px) and (max-width: 1150px) {
  .cnl-block.cnl-pkop {
    height: calc(40vh + 111px);
    min-height: 400px;
    max-height: 560px;
  }
}

/* ===== Foto's op een staande tablet =====
   Zodra foto en tekst onder elkaar klappen, neemt de foto de volle breedte van
   de container. Op een telefoon is die container 336 pixels en gaat dat goed,
   maar op een tablet is hij 660 tot 720 — dan wordt de foto 722 pixels breed,
   ruim veertig procent groter dan op een laptop. Daarom een bovengrens op de
   hele rij: foto en tekst blijven zo even breed en netjes onder elkaar staan,
   en de verhouding van de foto verandert niet. */
@media (max-width: 860px) {
  .cnl-block .cnl-facsl-rij,
  .cnl-block .cnl-tblok-rij,
  .cnl-block .cnl-duo-grid {
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* ===== Koppen die nog geen tabletmaat hadden =====
   Zeven koppen sprongen bij 861 pixels naar beneden in plaats van naar boven:
   ze hadden geen eigen regel voor smalle schermen, dus gold daar de volle
   bureaubladmaat, terwijl de tabletband ze juist verkleinde. Met deze maten
   loopt de reeks overal op: telefoon < tablet < bureaublad. */
@media (max-width: 860px) {
  .cnl-block .cnl-facsl-titel,
  .cnl-block .cnl-fslider-titel { font-size: 32px; }
  .cnl-block .cnl-duo-titel     { font-size: 34px; }
  .cnl-block .cnl-klijst-titel  { font-size: 33px; }
  .cnl-block .cnl-ktype-factitel { font-size: 31px; }
}

/* ===== Aanraakvlakken op een aanraakscherm =====
   Tekstlinks zijn 17 pixels hoog en de streepjes onder de faciliteitenslider
   maar 3. Met een duim is dat mikken. Een onzichtbaar vlak eromheen maakt ze
   groter zonder dat er iets verschuift: de opmaak blijft exact hetzelfde, er
   valt alleen meer te raken. */
@media (max-width: 900px) {
  .cnl-block .cnl-link-label,
  .cnl-block .cnl-kaart-link,
  .cnl-block .cnl-contact-link { position: relative; }
  .cnl-block .cnl-link-label::after,
  .cnl-block .cnl-kaart-link::after,
  .cnl-block .cnl-contact-link::after {
    content: ""; position: absolute; left: 0; right: 0; top: -13px; bottom: -13px;
  }

  .cnl-block .cnl-facsl-streep { position: relative; }
  .cnl-block .cnl-facsl-streep::after {
    content: ""; position: absolute; left: 0; right: 0; top: -18px; bottom: -18px;
  }

  /* De pijltjes over de foto's: van 30 naar 36 pixels. */
  .cnl-fotopijl { width: 36px; height: 36px; }
}