/**
Theme Name: Praktijk voor Privacy - Astra Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 2.6.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: praktijk-voor-privacy-astra-child
Template: astra
*/

/* ==========================================================================
   Zelfgehoste lettertypen (géén Google Fonts — geen requests naar derden)
   Variabele woff2-bestanden; @font-face per gewicht wijst naar hetzelfde
   bestand, de browser kiest het juiste gewicht via de wght-as.
   ========================================================================== */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/inter-variable.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('assets/fonts/inter-variable.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('assets/fonts/inter-variable.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:600;font-display:swap;src:url('assets/fonts/manrope-variable.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:700;font-display:swap;src:url('assets/fonts/manrope-variable.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:800;font-display:swap;src:url('assets/fonts/manrope-variable.woff2') format('woff2')}

/* ==========================================================================
   Praktijk voor Privacy — design system tokens
   Bron: Claude Design project "Praktijk voor Privacy Design System"
   ========================================================================== */
:root{
  --navy-900:#1E3A8A;--blue-700:#3B82F6;--blue-400:#60A5FA;--blue-100:#EFF6FF;--white:#FFFFFF;
  --gray-900:#3A3F4B;--gray-600:#6B7280;--gray-400:#9CA3AF;--gray-300:#D1D5DB;--gray-100:#F3F4F6;
  --gradient-navy-blue:linear-gradient(135deg,var(--navy-900),var(--blue-700));

  --font-display:'Manrope',sans-serif;--font-body:'Inter',sans-serif;

  --radius-sm:8px;--radius-md:16px;--radius-lg:20px;--radius-pill:999px;
  --shadow-sm:0 1px 2px rgba(30,42,90,.06),0 1px 1px rgba(30,42,90,.04);
  --shadow-md:0 4px 12px rgba(30,42,90,.10),0 2px 4px rgba(30,42,90,.06);
  --shadow-lg:0 12px 32px rgba(30,42,90,.16),0 4px 10px rgba(30,42,90,.08);
}

body{font-family:var(--font-body);color:var(--gray-900);background:#fff}
h1,h2,h3,h4,h5,h6,.entry-title,.ast-header-navigation-content{font-family:var(--font-display);color:var(--navy-900);font-weight:800}

/* Header / navigatie */
.ast-primary-header,.main-header-bar{background:#fff;border-bottom:1px solid var(--gray-300)}
.main-header-menu .menu-item > .menu-link{font-family:var(--font-body);font-weight:600;color:var(--gray-900);font-size:13px}
.main-header-menu .menu-item > .menu-link:hover,.main-header-menu .current-menu-item > .menu-link{color:var(--navy-900)}

/* Contact als CTA-knop in de header, i.p.v. tekstlink. Compact gehouden: de
   anchor rekt in Astra standaard tot de volle balkhoogte (line-height 50px);
   we centreren hem daarom met een normale regelhoogte zodat het een strakke,
   compacte knop wordt i.p.v. een balkhoog blauw kader. */
.main-header-menu .menu-item-cta{align-items:center}
.main-header-menu .menu-item-cta > .menu-link{background:var(--navy-900);color:#fff !important;border-radius:var(--radius-sm);padding:6px 14px !important;line-height:1.4 !important;height:auto !important}
.main-header-menu .menu-item-cta > .menu-link:hover{background:var(--blue-700);color:#fff !important}

/* Footer — 4 koloms sectie boven de copyright-balk (site-footer-section, injecteerd via astra_footer_before) */
.ppv-footer{background:var(--navy-900);color:#fff;padding:56px 32px 32px;font-family:var(--font-body);margin-top:48px}
.ppv-footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;max-width:1200px;margin:0 auto 32px}
@media (max-width:781px){.ppv-footer-grid{grid-template-columns:1fr 1fr}}
.ppv-footer-col h4{font-family:var(--font-body);font-weight:700;font-size:13.5px;margin:0 0 14px;color:#fff}
.ppv-footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.ppv-footer-col a,.ppv-footer-col span{color:#fff;opacity:.85;font-size:13px;text-decoration:none}
.ppv-footer-col a:hover{opacity:1;text-decoration:underline}
.ppv-footer-bottom{max-width:1200px;margin:0 auto;padding-top:24px;border-top:1px solid rgba(255,255,255,.15);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:12.5px;opacity:.75}
.ppv-footer-bottom a{color:#fff}
.ppv-footer-bottom a:hover{text-decoration:underline}

/* Buttons */
.ast-button,button,.button,input[type="submit"],.wp-block-button__link{
  background:var(--navy-900);color:#fff;border-radius:var(--radius-md);font-family:var(--font-body);font-weight:600;
  border:none;padding:13px 22px;transition:background .12s ease}
.ast-button:hover,button:hover,.button:hover,.wp-block-button__link:hover{background:var(--blue-700);color:#fff}
.ast-button.secondary,.is-style-outline .wp-block-button__link{background:transparent;color:var(--navy-900);border:1.5px solid var(--navy-900)}

/* Generieke sectie-achtergrond (Astra "global color 5" wordt hiervoor gebruikt in de content) */
.has-ast-global-color-5-background-color{background:var(--blue-100) !important;border-radius:var(--radius-lg);padding:var(--space-5,32px)}

/* Cards */
.ppv-card{background:#fff;border:1px solid var(--gray-300);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:28px;transition:box-shadow .15s ease}
.ppv-card:hover{box-shadow:var(--shadow-md)}
.ppv-card .ppv-card-icon{width:44px;height:44px;border-radius:50%;background:var(--navy-900);margin-bottom:16px}
.ppv-card h3{font-size:17px;margin:0 0 8px}
.ppv-card p{font-size:13.5px;color:var(--gray-600);line-height:1.55;margin:0 0 14px}
.ppv-card a{font-size:13.5px;font-weight:700;color:var(--blue-700);text-decoration:none}

.ppv-cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:32px 0}
@media (max-width:781px){.ppv-cards-grid{grid-template-columns:1fr}}

/* DPIA Depot promo-paneel (donker, gradient) */
.ppv-panel-dark{background:var(--gradient-navy-blue);border-radius:var(--radius-lg);padding:28px;color:#fff}
.ppv-panel-dark h3{color:#fff;font-size:19px;margin:0 0 8px}
.ppv-panel-dark p{opacity:.9;font-size:13.5px;line-height:1.5}
.ppv-panel-dark .ppv-button-light{margin-top:12px;display:inline-block;background:#fff;color:var(--navy-900);border:none;border-radius:var(--radius-md);padding:10px 18px;font-weight:700;font-size:13.5px;text-decoration:none}

/* Waarom-lijst met vinkjes */
.ppv-check-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.ppv-check-list li{display:flex;gap:10px;font-size:14.5px;color:var(--gray-900)}
.ppv-check-list li::before{content:"✓";color:var(--blue-700);font-weight:700;flex-shrink:0}

/* Newsletter bar */
.ppv-newsletter-bar{background:var(--gray-100);border-radius:var(--radius-md);padding:22px 28px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.ppv-newsletter-bar h3{font-size:15px;margin:0}
.ppv-newsletter-bar p{font-size:13px;color:var(--gray-600);margin:2px 0 0}
.ppv-newsletter-bar a.ppv-button-primary{background:var(--navy-900);color:#fff;border-radius:var(--radius-sm);padding:11px 20px;font-weight:600;font-size:13.5px;text-decoration:none;white-space:nowrap}

/* Nieuws (latest-posts) als kaarten */
.wp-block-latest-posts{display:flex;flex-direction:column;gap:16px}
.wp-block-latest-posts li{list-style:none}
.wp-block-latest-posts .wp-block-latest-posts__featured-image img{border-radius:var(--radius-sm)}
.wp-block-latest-posts a{font-family:var(--font-body);font-weight:700;color:var(--navy-900);text-decoration:none}

/* Footer */
.ast-small-footer,footer.site-footer{background:var(--navy-900);color:#fff}
.ast-small-footer a{color:#fff}

a{color:var(--blue-700)}
a:hover{color:var(--navy-900)}

/* ==========================================================================
   Nieuwskaarten — Nieuws-archief én homepage "Actueel"-sectie
   ========================================================================== */
ul.ppv-news-grid{list-style:none;margin:0 0 0 !important;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
ul.ppv-news-grid > li{margin:0;padding:0;min-width:0}
@media (max-width:900px){ul.ppv-news-grid{grid-template-columns:1fr}}

.ppv-news-card{position:relative;background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);overflow:hidden;transition:transform .18s ease,box-shadow .18s ease;min-width:0;width:100%}
.ppv-news-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}

.ppv-news-card .img-wrap{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--gray-100)}
.ppv-news-card .img-wrap .wp-block-post-featured-image{margin:0;height:100%}
.ppv-news-card .img-wrap img{width:100%;height:100%;object-fit:cover;display:block}
.ppv-news-card .img-wrap .badge{position:absolute;top:12px;left:12px;margin:0;background:rgba(30,58,138,.88);color:#fff;font-size:11px;font-weight:700;padding:5px 11px;border-radius:var(--radius-pill);letter-spacing:.02em}
.ppv-news-card .img-wrap .badge a{color:#fff;text-decoration:none;pointer-events:none}

.ppv-news-card .card-body{padding:20px}
.ppv-news-card .meta-row{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--gray-600);margin-bottom:10px}
.ppv-news-card .meta-row .wp-block-post-terms,.ppv-news-card .meta-row .wp-block-post-date{margin:0}
.ppv-news-card .meta-row .wp-block-post-terms a{color:var(--gray-600);text-decoration:none;pointer-events:none}
/* Core's flow-layout (.wp-block-group-is-layout-flow > *) zet een margin-block-start
   op de kinderen; in deze flexregel duwt dat de stip omlaag. Marges hier neutraliseren. */
.ppv-news-card .meta-row > *{margin-block:0}
.ppv-news-card .meta-row .dot{width:3px;height:3px;border-radius:50%;background:var(--gray-600);flex-shrink:0}

.ppv-news-card .wp-block-post-title{font-family:var(--font-display);font-size:17px;font-weight:800;color:var(--navy-900);line-height:1.35;margin:0 0 8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ppv-news-card .wp-block-post-title a{color:inherit;text-decoration:none}
.ppv-news-card .wp-block-post-title a::after{content:"";position:absolute;inset:0}

.ppv-news-card .wp-block-post-excerpt{font-size:13.5px;color:var(--gray-600);line-height:1.55;margin:0 0 12px}
.ppv-news-card .wp-block-post-excerpt p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0}

.ppv-news-card .wp-block-read-more{position:relative;z-index:1;font-size:13px;font-weight:700;color:var(--navy-900);text-decoration:none}
.ppv-news-card .wp-block-read-more:hover{color:var(--blue-700)}

.ppv-actueel-header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:24px;gap:16px;flex-wrap:wrap}
.ppv-actueel-header h2{margin:0}
.ppv-actueel-header p{margin:0}
.ppv-actueel-header a{font-size:14px;font-weight:700;color:var(--navy-900);text-decoration:none}
.ppv-actueel-header a:hover{color:var(--blue-700)}

/* ==========================================================================
   Nieuwsartikel (single.php) — bron: Nieuwsartikel Redesign.html
   ========================================================================== */
.breadcrumbs{max-width:760px;margin:0 auto;padding:24px 20px 0;font-size:13px;color:var(--gray-600)}
.breadcrumbs a{font-weight:600;color:var(--gray-600);text-decoration:none}
.breadcrumbs a:hover{color:var(--navy-900)}

.article-head{max-width:760px;margin:0 auto;padding:20px 20px 32px}
.article-head .meta-row{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.article-head .badge-cat{display:inline-block;background:rgba(30,58,138,.1);color:var(--navy-900);font-size:12px;font-weight:700;padding:5px 13px;border-radius:var(--radius-pill)}
.article-head .meta-row .date{font-size:13px;color:var(--gray-600)}
.article-head .meta-row .dot{width:3px;height:3px;border-radius:50%;background:var(--gray-600);flex-shrink:0}
.article-head h1{font-family:var(--font-display);font-weight:800;font-size:38px;line-height:1.15;color:var(--navy-900);margin:0 0 16px}
.article-head .dek{font-size:17px;color:var(--gray-600);line-height:1.55;margin:0}

.author-row{display:flex;align-items:center;gap:12px;margin-top:24px;padding-top:24px;border-top:1px solid var(--gray-300)}
.author-row .avatar{width:40px;height:40px;border-radius:50%;background:var(--navy-900);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:800;font-size:14px;flex-shrink:0}
.author-row .name{font-size:14px;font-weight:700;color:var(--navy-900)}
.author-row .role{font-size:13px;color:var(--gray-600)}

.hero-img{max-width:1000px;margin:0 auto 48px;padding:0 20px}
.hero-img img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--radius-lg);box-shadow:var(--shadow-md);display:block}

.article-body{max-width:700px;margin:0 auto;padding:0 20px 64px;font-size:17px;line-height:1.75;color:var(--gray-900)}
.article-body p{margin:0 0 22px}
.article-body ul,.article-body ol{margin:0 0 22px;padding-left:22px}
.article-body li{margin-bottom:8px}
.article-body h2{font-family:var(--font-display);font-weight:800;font-size:24px;color:var(--navy-900);margin:40px 0 16px}
.article-body blockquote{margin:32px 0;padding:24px 28px;background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);font-family:var(--font-display);font-weight:700;font-size:19px;color:var(--navy-900);line-height:1.5}

.share-bar{max-width:700px;margin:0 auto;display:flex;align-items:center;gap:14px;padding-top:24px;border-top:1px solid var(--gray-300)}
.share-bar span{font-size:13px;font-weight:700;color:var(--gray-600)}
.share-bar .icons{display:flex;gap:8px}
.share-bar .icons a{width:36px;height:36px;border-radius:50%;background:var(--gray-100);display:flex;align-items:center;justify-content:center;color:var(--navy-900);font-size:13px;font-weight:700;text-decoration:none;transition:background .15s ease,color .15s ease}
.share-bar .icons a:hover{background:var(--navy-900);color:#fff}

.cta-band{max-width:1000px;margin:0 auto 72px;padding:0 20px}
.cta-band .cta-inner{background:var(--gradient-navy-blue);border-radius:var(--radius-lg);padding:44px 48px;display:flex;justify-content:space-between;align-items:center;gap:32px;color:#fff}
.cta-band .cta-inner h3{font-family:var(--font-display);font-weight:800;font-size:22px;margin:0 0 6px;color:#fff}
.cta-band .cta-inner p{margin:0;font-size:14.5px;opacity:.9;max-width:420px}
.cta-band .cta-inner .btn{background:#fff;color:var(--navy-900);font-weight:700;font-size:14px;padding:12px 24px;border-radius:var(--radius-sm);white-space:nowrap;text-decoration:none;flex-shrink:0}

.related-wrap{max-width:1180px;margin:0 auto;padding:0 20px 80px}
.related-wrap h2{font-family:var(--font-display);font-weight:800;font-size:24px;color:var(--navy-900);margin:0 0 24px}

@media (max-width:900px){
  .article-head h1{font-size:28px}
  .cta-band .cta-inner{flex-direction:column;align-items:flex-start;padding:32px}
}
