/*
Theme Name: DeBesteVakantieDeals
Theme URI: https://debestevakantiedeals.nl
Description: Zonnig, fris reisthema voor DeBesteVakantieDeals.nl — child van Twenty Twenty-Four. Editorial reisgevoel: koraal + zeeblauw, eerlijke deal-vergelijking.
Author: DeBesteVakantieDeals.nl
Template: twentytwentyfour
Version: 1.5.0
Text Domain: bw-debestevakantiedeals
*/

/* mobile-safety: nooit horizontaal scrollen */
html, body{ overflow-x:clip; }
img, svg, video{ max-width:100%; height:auto; }

:root{
  --vk-koraal:#FF7A4D;
  --vk-koraal-dark:#E85F30;
  --vk-zee:#1AA7C0;
  --vk-zee-dark:#0F7E93;
  --vk-zand:#FDF6EC;
  --vk-zand-2:#F7EBD8;
  --vk-marine:#143A52;
  --vk-geel:#FFC24B;
  --vk-groen:#2FA866;
  --vk-line:#EADFCB;
  --vk-shadow:0 10px 30px -12px rgba(20,58,82,.22);
  --vk-shadow-lg:0 22px 50px -18px rgba(20,58,82,.30);
  --vk-radius:18px;
}

/* ============ BASIS ============ */
body{ color:var(--vk-marine); background:var(--vk-zand); -webkit-font-smoothing:antialiased; }
.entry-content, .wp-block-post-content{ font-size:1.16rem; line-height:1.75; }
.entry-content > *, .wp-block-post-content > *{ max-width:46rem; }
.entry-content > .alignwide, .entry-content > .alignfull,
.entry-content > .wp-block-cover, .entry-content > .wp-block-columns,
.entry-content > .wp-block-group.alignwide{ max-width:none; }
a{ color:var(--vk-zee); text-underline-offset:.18em; text-decoration-thickness:1.5px; }
a:hover{ color:var(--vk-koraal-dark); }

/* ============ KOPPEN ============ */
h1,h2,h3,h4{ font-family:"Plus Jakarta Sans",-apple-system,system-ui,sans-serif; letter-spacing:-.02em; }
.entry-content h1, .wp-block-post-content h1{ font-size:clamp(2rem,4vw,2.9rem); font-weight:800; line-height:1.12; }
.entry-content h2, .wp-block-post-content h2{
  font-size:clamp(1.55rem,2.6vw,2.05rem); font-weight:800; color:var(--vk-marine);
  margin-top:2.4em; padding-bottom:.3em; line-height:1.2;
}
.entry-content h2::after, .wp-block-post-content h2::after{
  content:""; display:block; width:60px; height:5px; margin-top:.45em;
  background:linear-gradient(90deg,var(--vk-koraal),var(--vk-geel)); border-radius:5px;
}
/* gecentreerde sectiekoppen: streep ook centreren */
.entry-content h2.has-text-align-center::after,
.wp-block-post-content h2.has-text-align-center::after{ margin-left:auto; margin-right:auto; }
.entry-content h3, .wp-block-post-content h3{ font-size:1.3rem; font-weight:700; color:var(--vk-marine); margin-top:1.7em; }

/* ============ LIJSTEN met zonnige bullets ============ */
.entry-content ul, .wp-block-post-content ul{ list-style:none; padding-left:0; }
.entry-content ul li, .wp-block-post-content ul li{ position:relative; padding-left:1.7em; margin-bottom:.55em; }
.entry-content ul li::before, .wp-block-post-content ul li::before{
  content:""; position:absolute; left:.15em; top:.62em; width:.5em; height:.5em; border-radius:50%;
  background:var(--vk-koraal);
}
/* lijsten binnen kaarten/cover niet dubbel stylen */
.wp-block-buttons li::before{ display:none; }

/* ============ KNOPPEN ============ */
.wp-block-button__link, .wpcf7-form input.wpcf7-submit, .tnp-submit input, .tnp-submit{
  border-radius:999px !important; font-weight:700 !important;
}
.wp-block-button:not(.is-style-outline) > .wp-block-button__link{
  background:var(--vk-koraal) !important; color:#fff !important; border:none !important;
  padding:.82em 1.7em !important; box-shadow:0 8px 20px -8px rgba(255,122,77,.7);
  transition:transform .16s ease, box-shadow .16s ease, background .16s ease;
}
.wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover{
  background:var(--vk-koraal-dark) !important; transform:translateY(-2px);
  box-shadow:0 14px 26px -8px rgba(255,122,77,.8);
}
.wp-block-button.is-style-outline > .wp-block-button__link{
  border:2px solid rgba(255,255,255,.85) !important; color:#fff !important;
  background:transparent !important; padding:.78em 1.6em !important; transition:all .16s ease;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover{
  background:#fff !important; color:var(--vk-marine) !important; transform:translateY(-2px);
}
/* deal-CTA (affiliate) */
.wp-block-button.vk-deal > .wp-block-button__link,
.wp-block-button.vk-deal a.wp-block-button__link{
  background:var(--vk-koraal) !important; color:#fff !important; border-radius:999px !important;
  padding:.75em 1.6em !important; font-weight:700 !important; text-decoration:none !important;
  display:inline-block !important; border:none !important;
  box-shadow:0 8px 20px -8px rgba(255,122,77,.7);
}
.wp-block-button.vk-deal > .wp-block-button__link:hover{ background:var(--vk-koraal-dark) !important; transform:translateY(-2px); }

/* ============ HEADER ============ */
.vk-site-header{ box-shadow:0 1px 0 var(--vk-line), 0 6px 24px -18px rgba(20,58,82,.5); position:sticky; top:0; z-index:100; background:#fff; }
.vk-site-header .wp-block-site-title a{ color:var(--vk-marine) !important; text-decoration:none; font-family:"Plus Jakarta Sans",sans-serif; font-weight:800; }
.wp-block-navigation a{ color:var(--vk-marine); font-weight:600; }
.wp-block-navigation a:hover{ color:var(--vk-koraal-dark); }
.wp-block-navigation .wp-block-navigation-submenu__toggle + .wp-block-navigation__submicon{ opacity:.6; }
.wp-block-navigation .wp-block-navigation__submenu-container{
  border:1px solid var(--vk-line) !important; border-radius:14px !important; box-shadow:var(--vk-shadow) !important;
  padding:.4rem !important; background:#fff !important;
}
.wp-block-navigation .wp-block-navigation__submenu-container a{ border-radius:9px; }
.wp-block-navigation .wp-block-navigation__submenu-container a:hover{ background:var(--vk-zand); }

/* ============ HERO ============ */
.vk-hero{ position:relative; overflow:hidden; }
.vk-hero .wp-block-cover__inner-container{ position:relative; z-index:3; max-width:46rem; }
.vk-hero h1{ text-shadow:0 2px 18px rgba(0,0,0,.18); }
/* SVG-landschap onderaan hero */
.vk-hero-scene{ position:absolute; left:0; right:0; bottom:-1px; width:100%; height:auto; z-index:2; pointer-events:none; display:block; }
.vk-hero-sun{ position:absolute; right:8%; top:14%; z-index:1; opacity:.9; }

/* ============ SECTIE-WRAP ============ */
.vk-section{ padding-block:.5rem; }
.vk-eyebrow{ text-transform:uppercase; letter-spacing:.14em; font-size:.8rem; font-weight:700; color:var(--vk-koraal); }

/* ============ KAARTEN / TEGELS ============ */
.vk-cardgrid{ display:grid; gap:1.4rem; }
@media(min-width:782px){ .vk-cardgrid--3{ grid-template-columns:repeat(3,1fr); } .vk-cardgrid--4{ grid-template-columns:repeat(4,1fr); } .vk-cardgrid--2{ grid-template-columns:repeat(2,1fr); } }
.vk-card{
  background:#fff; border:1px solid var(--vk-line); border-radius:var(--vk-radius);
  padding:0; overflow:hidden; box-shadow:var(--vk-shadow);
  transition:transform .18s ease, box-shadow .18s ease; display:flex; flex-direction:column;
}
.vk-card:hover{ transform:translateY(-5px); box-shadow:var(--vk-shadow-lg); }
.vk-card a.vk-card__link{ text-decoration:none; color:inherit; display:flex; flex-direction:column; height:100%; }
.vk-card__art{ aspect-ratio:16/10; width:100%; display:block; }
.vk-card__body{ padding:1.2rem 1.3rem 1.4rem; }
.vk-card__title{ font-family:"Plus Jakarta Sans",sans-serif; font-weight:800; font-size:1.25rem; color:var(--vk-marine); margin:0 0 .35rem; display:flex; align-items:center; gap:.5rem; }
.vk-card__title svg{ flex:0 0 auto; }
.vk-card__text{ margin:0; color:#456; font-size:1rem; line-height:1.55; }
.vk-card__more{ margin-top:.8rem; font-weight:700; color:var(--vk-koraal); font-size:.95rem; }
.vk-card:hover .vk-card__more{ color:var(--vk-koraal-dark); }

/* icoon-tegels (klein, label) */
.vk-icontiles{ display:grid; gap:1rem; }
@media(min-width:600px){ .vk-icontiles--4{ grid-template-columns:repeat(4,1fr); } }
@media(max-width:599px){ .vk-icontiles{ grid-template-columns:repeat(2,1fr); } }
.vk-icontile{
  background:#fff; border:1px solid var(--vk-line); border-radius:16px; padding:1.4rem 1rem;
  text-align:center; text-decoration:none; color:var(--vk-marine); display:block;
  box-shadow:0 6px 18px -12px rgba(20,58,82,.3); transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.vk-icontile:hover{ transform:translateY(-4px); box-shadow:var(--vk-shadow); border-color:var(--vk-koraal); color:var(--vk-marine); }
.vk-icontile__ic{ width:56px; height:56px; margin:0 auto .7rem; display:grid; place-items:center; border-radius:50%; background:var(--vk-zand); }
.vk-icontile:hover .vk-icontile__ic{ background:var(--vk-geel); }
.vk-icontile__ic svg{ width:30px; height:30px; }
.vk-icontile__label{ font-weight:700; font-family:"Plus Jakarta Sans",sans-serif; font-size:1.02rem; }

/* ============ AANBIEDER-BLOK in gidsen ============ */
.entry-content p:has(strong:first-child){ }
.entry-content table, .wp-block-table table{ border-collapse:separate; border-spacing:0; width:100%; border:1px solid var(--vk-line); border-radius:14px; overflow:hidden; box-shadow:var(--vk-shadow); background:#fff; }
.entry-content th, .wp-block-table th{ background:var(--vk-marine); color:#fff; text-align:left; padding:.85em 1em; font-family:"Plus Jakarta Sans",sans-serif; }
.entry-content td, .wp-block-table td{ padding:.8em 1em; border-bottom:1px solid var(--vk-line); }
.entry-content tr:last-child td{ border-bottom:none; }
.entry-content tr:nth-child(even) td{ background:var(--vk-zand); }

/* citaten / tips */
.entry-content blockquote, .wp-block-quote{
  border-left:5px solid var(--vk-geel); background:#fff; padding:1.1em 1.3em;
  border-radius:0 14px 14px 0; margin:1.6em 0; box-shadow:var(--vk-shadow); font-style:normal;
}
.entry-content p em{ color:#5b6b78; }

/* ============ FORMULIEREN (Contact Form 7) ============ */
.wpcf7{ background:#fff; border:1px solid var(--vk-line); border-radius:var(--vk-radius); padding:1.8rem 1.8rem 2rem; box-shadow:var(--vk-shadow); max-width:40rem; }
.wpcf7-form p{ margin:0 0 1.1rem; }
.wpcf7-form label{ display:block; font-weight:700; color:var(--vk-marine); margin-bottom:.4rem; font-family:"Plus Jakarta Sans",sans-serif; }
.wpcf7-form input[type=text],
.wpcf7-form input[type=email],
.wpcf7-form input[type=tel],
.wpcf7-form textarea,
.wpcf7-form select{
  width:100%; box-sizing:border-box; padding:.8rem 1rem; font:inherit; color:var(--vk-marine);
  background:var(--vk-zand); border:1.5px solid var(--vk-line); border-radius:12px; transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.wpcf7-form input::placeholder, .wpcf7-form textarea::placeholder{ color:#9aa7b0; }
.wpcf7-form input:focus, .wpcf7-form textarea:focus, .wpcf7-form select:focus{
  outline:none; border-color:var(--vk-koraal); background:#fff; box-shadow:0 0 0 4px rgba(255,122,77,.16);
}
.wpcf7-form textarea{ min-height:150px; resize:vertical; }
.wpcf7-form input.wpcf7-submit{
  background:var(--vk-koraal); color:#fff; border:none; padding:.85rem 2rem; font-weight:700; cursor:pointer;
  box-shadow:0 10px 24px -10px rgba(255,122,77,.8); transition:transform .16s ease, background .16s ease; width:auto;
}
.wpcf7-form input.wpcf7-submit:hover{ background:var(--vk-koraal-dark); transform:translateY(-2px); }
.wpcf7 .wpcf7-spinner{ margin-top:1rem; }
.wpcf7-response-output{ border-radius:12px !important; border-width:1.5px !important; margin:1rem 0 0 !important; padding:.8rem 1rem !important; }

/* ============ NEWSLETTER (dealsalert) ============ */
.tnp{ max-width:34rem; margin:1.2rem auto 0; }
.tnp-field{ margin-bottom:.8rem; }
.tnp-field label{ color:#fff; font-weight:600; }
.tnp-field input.tnp-email,
.tnp-widget-minimal input.tnp-email,
.tnp input[type=email]{
  width:100%; box-sizing:border-box; padding:.85rem 1.1rem; font:inherit; border:none; border-radius:999px;
  background:#fff; color:var(--vk-marine); box-shadow:0 8px 20px -12px rgba(0,0,0,.3);
}
.tnp input[type=email]:focus{ outline:none; box-shadow:0 0 0 4px rgba(255,194,75,.5); }
.tnp input.tnp-submit,
.tnp-submit input,
.tnp-widget-minimal input.tnp-submit{
  background:var(--vk-koraal) !important; color:#fff !important; border:none !important; border-radius:999px !important;
  padding:.85rem 2rem !important; font-weight:700 !important; cursor:pointer; margin-top:.6rem;
  box-shadow:0 10px 24px -10px rgba(255,122,77,.9); transition:transform .16s ease, background .16s ease; width:auto;
}
.tnp input.tnp-submit:hover, .tnp-submit input:hover{ background:var(--vk-koraal-dark) !important; transform:translateY(-2px); }
@media(min-width:560px){
  .tnp-widget-minimal form{ display:flex; gap:.6rem; align-items:center; }
  .tnp-widget-minimal .tnp-field-email{ flex:1; margin:0; }
  .tnp-widget-minimal .tnp-field-button{ margin:0; }
  .tnp-widget-minimal input.tnp-submit{ margin-top:0; white-space:nowrap; }
}

/* ============ FOOTER ============ */
.vk-site-footer{ background:var(--vk-marine); color:#fff; }
.vk-site-footer a{ color:#cfe6ec; text-decoration:none; }
.vk-site-footer a:hover{ color:#fff; text-decoration:underline; }

/* ============ COVER/GROUP rond ============ */
.wp-block-cover.vk-hero{ border-radius:0; }
.wp-block-group.has-background{ border-radius:var(--vk-radius); }

/* ============ PAGINA-TITEL BAND (interior pages) ============ */
.wp-block-post-title{
  text-align:center; max-width:46rem; margin-inline:auto;
  font-size:clamp(1.9rem,3.6vw,2.7rem); font-weight:800; line-height:1.15;
  padding-top:.4em;
}
.wp-block-post-title::after{
  content:""; display:block; width:72px; height:5px; margin:.6em auto 0;
  background:linear-gradient(90deg,var(--vk-koraal),var(--vk-geel)); border-radius:5px;
}
.wp-block-post-content > p:first-of-type{ font-size:1.22rem; color:#3c5563; }
/* homepage heeft een eigen hero — verberg de paginatitel "Home" */
.home .wp-block-post-title, body.page-id-22 .wp-block-post-title{ display:none !important; }

/* ============ BLOG-OVERZICHT ============ */
.vk-blog-title{ font-size:clamp(2rem,3.6vw,2.7rem); font-weight:800; }
.vk-blog-title::after{ content:""; display:block; width:72px; height:5px; margin:.55em auto 0; background:linear-gradient(90deg,var(--vk-koraal),var(--vk-geel)); border-radius:5px; }
.vk-blogcards{ gap:1.6rem !important; margin-top:2.4rem; }
@media(max-width:781px){ .vk-blogcards{ grid-template-columns:1fr !important; } }
@media(min-width:600px) and (max-width:781px){ .vk-blogcards{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; } }
.vk-blogcard{
  background:#fff; border:1px solid var(--vk-line); border-radius:var(--vk-radius); overflow:hidden;
  box-shadow:var(--vk-shadow); transition:transform .18s ease, box-shadow .18s ease; height:100%;
}
.vk-blogcard:hover{ transform:translateY(-5px); box-shadow:var(--vk-shadow-lg); }
.vk-blogcard__img img{ width:100%; height:190px; object-fit:cover; display:block; }
.vk-blogcard__img a{ display:block; }
/* fallback wanneer geen uitgelichte afbeelding: zonnig gradient-vlak */
.vk-blogcard .wp-block-post-featured-image:not(:has(img)){ display:block; height:190px; background:linear-gradient(135deg,var(--vk-zee),var(--vk-koraal)); }
.vk-blogcard__date{ font-size:.85rem; color:var(--vk-koraal); font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
.vk-blogcard__title{ margin:.3rem 0 .5rem; line-height:1.25; }
.vk-blogcard__title a{ color:var(--vk-marine); text-decoration:none; }
.vk-blogcard__title a:hover{ color:var(--vk-koraal-dark); }
.vk-blogcard__excerpt{ color:#456; font-size:1rem; line-height:1.55; }
.vk-blogcard__excerpt a{ font-weight:700; color:var(--vk-koraal); }
.vk-pagination{ margin-top:2.6rem; gap:.4rem; }
.vk-pagination .wp-block-query-pagination-numbers a,
.vk-pagination .wp-block-query-pagination-numbers .current,
.vk-pagination a{ padding:.4em .8em; border-radius:10px; text-decoration:none; color:var(--vk-marine); }
.vk-pagination .current{ background:var(--vk-koraal); color:#fff; }

/* ============ BLOG-DETAIL (single) ============ */
.vk-article-head{ max-width:48rem; margin-inline:auto; }
.vk-article-meta{ gap:.5rem; color:var(--vk-koraal); font-weight:700; font-size:.9rem; text-transform:uppercase; letter-spacing:.05em; margin-bottom:.4rem; }
.vk-article-meta a{ color:var(--vk-koraal); text-decoration:none; }
.vk-article-head .wp-block-post-title{ font-size:clamp(1.9rem,3.8vw,2.8rem); font-weight:800; line-height:1.15; }
.vk-article-hero img{ width:100%; max-height:440px; object-fit:cover; border-radius:var(--vk-radius); margin:2rem auto; }
.vk-article-hero:not(:has(img)){ display:block; height:300px; border-radius:var(--vk-radius); margin:2rem auto; max-width:60rem; background:linear-gradient(135deg,var(--vk-zee),var(--vk-koraal)); }

::selection{ background:var(--vk-geel); color:var(--vk-marine); }