/* Axel Josh bouwblokken. Klassen met ajb- zijn voor pagina-inhoud, ajp- voor het contactpaneel. */
:root{--aj-paper:#F5F0E6;--aj-mist:#E6DDCC;--aj-brand:#12394F;--aj-ink:#0C1C28;--aj-accent:#C93815;--aj-al:#FF7C4A;--aj-muted:#4B5963;--aj-fd:'Bricolage Grotesque',system-ui,sans-serif;--aj-ft:'Figtree',system-ui,sans-serif}

.ajb-page{background:var(--aj-paper);color:var(--aj-ink);font:400 18px/28px var(--aj-ft)}
.ajb-page :where(h1,h2,h3,p,ul,figure){margin:0}
.ajb-page :where(.wp-block-group){margin:0}
.ajb-w{max-width:1120px;margin:0 auto;padding-left:clamp(20px,5vw,48px);padding-right:clamp(20px,5vw,48px)}
.ajb-pad{padding-top:88px;padding-bottom:88px}
.ajb-pad-hero{padding-top:56px;padding-bottom:72px}
.ajb-pad-low{padding-top:0;padding-bottom:88px}
.ajb-ink{background:var(--aj-ink);color:var(--aj-paper)}
.ajb-brand{background:var(--aj-brand);color:var(--aj-paper)}
.ajb-mist{background:var(--aj-mist)}
.ajb-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:center}
.ajb-split.ajb-flip .ajb-split-img{order:2}
.ajb-split-text{display:flex;flex-direction:column;gap:20px}
.ajb-split-img img{width:100%;height:auto;border-radius:20px;display:block}
.ajb-faq{display:flex;flex-direction:column;gap:12px;max-width:820px}
.ajb-faq details{background:var(--aj-mist);border-radius:16px;padding:20px 24px}
.ajb-faq summary{font:700 20px/28px var(--aj-fd);cursor:pointer}
.ajb-faq details p{margin-top:12px}
.ajb-center{text-align:center;align-items:center}
@media(max-width:800px){.ajb-split{grid-template-columns:1fr}.ajb-split.ajb-flip .ajb-split-img{order:0}}
.ajb-stack{display:flex;flex-direction:column;gap:40px}
.ajb-head{display:flex;flex-direction:column;gap:12px;max-width:680px}
.ajb-head-wide{max-width:760px}
.ajb-headrow{display:flex;flex-wrap:wrap;gap:24px;align-items:flex-end;justify-content:space-between}

/* tekst */
.ajb-lbl{font:700 12px/16px var(--aj-ft);letter-spacing:.14em;text-transform:uppercase;color:var(--aj-muted)}
.ajb-ink .ajb-lbl,.ajb-brand .ajb-lbl{color:var(--aj-al)}
.ajb-h1{font:800 clamp(36px,5vw,60px)/1.04 var(--aj-fd);letter-spacing:-.02em;text-wrap:balance}
.ajb-h2{font:800 44px/48px var(--aj-fd);letter-spacing:-.015em}
.ajb-h3{font:700 20px/26px var(--aj-fd)}
.ajb-lead{max-width:640px}
.ajb-sm{font-size:15px;line-height:22px}
.ajb-note{font:500 13px/18px var(--aj-ft);color:var(--aj-muted)}
.ajb-ink .ajb-note,.ajb-brand .ajb-note{color:rgba(245,240,230,.82)}
.ajb-num{font:800 28px/34px var(--aj-fd);color:var(--aj-accent)}
.ajb-brand .ajb-num,.ajb-hl .ajb-num{color:var(--aj-al)}
.ajb-big{font:800 44px/48px var(--aj-fd);color:var(--aj-al)}
.ajb-src,.ajb-src a{font:500 13px/18px var(--aj-ft);color:var(--aj-paper)}
.ajb-src a{text-decoration:underline}

/* knoppen */
.ajb-page .wp-block-buttons{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.ajb-page .wp-block-button .wp-block-button__link{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 28px;border:2px solid transparent;border-radius:999px;background:none;font:700 16px/1 var(--aj-ft);text-decoration:none;color:inherit;box-shadow:none;transition:background .2s,color .2s}
.ajb-page .ajb-red .wp-block-button__link{background:var(--aj-accent);color:#fff}
.ajb-page .ajb-red .wp-block-button__link:hover{background:#A82D0F;color:#fff}
.ajb-page .ajb-line .wp-block-button__link{border-color:var(--aj-brand);color:var(--aj-brand)}
.ajb-page .ajb-line .wp-block-button__link:hover{background:var(--aj-brand);color:var(--aj-paper)}
.ajb-page .ajb-paper .wp-block-button__link{background:var(--aj-paper);color:var(--aj-brand)}
.ajb-page .ajb-paper .wp-block-button__link:hover{background:var(--aj-mist)}

/* hero */
.ajb-hero-in{display:flex;flex-wrap:wrap;gap:40px;align-items:center;justify-content:space-between}
.ajb-hero-text{flex:1 1 480px;max-width:680px;display:flex;flex-direction:column;gap:24px}
.ajb-cutout{flex:0 1 400px;width:min(400px,100%);aspect-ratio:734/822;position:relative;overflow:hidden;margin:0 auto}
.ajb-cutout figure{position:absolute;inset:0}
.ajb-cutout img{position:absolute;display:block;max-width:none;width:279%;height:auto;left:-94.4%;top:-36.9%}

/* kaarten */
.ajb-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.ajb-card{background:var(--aj-mist);border-radius:12px;padding:24px;display:flex;flex-direction:column;gap:8px}
.ajb-card p{font-size:15px;line-height:22px}
.ajb-statcard{background:var(--aj-brand);border-radius:12px;padding:24px;display:flex;flex-direction:column;gap:8px}
.ajb-statcard .ajb-txt{font-size:15px;line-height:22px}

/* uitgelichte kaart */
.ajb-hl{background:var(--aj-brand);color:var(--aj-paper);border-radius:24px;padding:clamp(24px,4vw,48px);display:flex;flex-wrap:wrap;gap:32px;align-items:center;justify-content:space-between}
.ajb-hl-text{flex:1 1 360px;max-width:600px;display:flex;flex-direction:column;gap:16px}
.ajb-hl-text .ajb-h3l{font:800 34px/38px var(--aj-fd);letter-spacing:-.015em}
.ajb-hl-text p{color:rgba(245,240,230,.9)}
.ajb-hl-text .ajb-h3l{color:var(--aj-paper)}
.ajb-post,.ajb-tile{background:var(--aj-ink);color:var(--aj-paper);display:flex;flex-direction:column;justify-content:space-between}
.ajb-post{flex:0 1 300px;width:min(300px,100%);aspect-ratio:4/5;border-radius:12px;padding:24px}
.ajb-hd{font:800 30px/32px var(--aj-fd);letter-spacing:-.02em}
.ajb-hd strong{font-weight:800;color:var(--aj-al)}
.ajb-by{font:500 15px/22px var(--aj-ft)}
.ajb-play{position:relative;width:56px;height:56px;border-radius:50%;background:var(--aj-al);flex:none}
.ajb-play:after{content:"";position:absolute;left:22px;top:17px;border-left:17px solid var(--aj-ink);border-top:11px solid transparent;border-bottom:11px solid transparent}

/* voorbeelden */
.ajb-arrows{display:flex;gap:8px}
.ajb-arrows button{width:48px;height:48px;border-radius:50%;border:2px solid var(--aj-brand);background:transparent;color:var(--aj-brand);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0 0 4px;font:400 30px/1 var(--aj-ft)}
.ajb-arrows button:hover{background:var(--aj-brand);color:var(--aj-paper)}
.ajb-ink .ajb-head p{color:rgba(245,240,230,.82)}
.ajb-stack20{display:flex;flex-direction:column;gap:20px}
@media (max-width:767px){.ajb-arrows{display:none}}
.ajb-scroller{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px}
.ajb-ex{flex:0 0 min(320px,82vw);scroll-snap-align:start;background:var(--aj-mist);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:14px}
.ajb-ex>p{font-size:15px;line-height:22px}
.ajb-prof{display:flex;align-items:center;gap:10px}
.ajb-prof:after{content:"in";flex:none;width:26px;height:26px;border-radius:4px;background:#0A66C2;color:#fff;font:800 14px/26px Arial,sans-serif;text-align:center}
.ajb-av{width:40px;height:40px;border-radius:50%;background:var(--aj-brand);flex:none}
.ajb-who{display:flex;flex-direction:column;flex-grow:1;min-width:0}
.ajb-name{font:700 15px/20px var(--aj-ft)}
.ajb-role{font:400 13px/18px var(--aj-ft);color:var(--aj-muted)}
.ajb-tile{aspect-ratio:4/5;border-radius:4px;padding:24px;background:var(--aj-brand)}
.ajb-tile.ajb-d{background:var(--aj-ink)}

/* aflevering kaarten in paneel */
.ajb-panel{background:var(--aj-mist);border-radius:24px;padding:clamp(24px,4vw,48px);display:flex;flex-direction:column;gap:40px}
.ajb-insp{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:baseline;justify-content:space-between}
.ajb-insp .ajb-lnk a{font:700 15px/22px var(--aj-ft);color:var(--aj-brand);text-decoration:underline}
.ajb-eps{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.ajb-epc{background:var(--aj-paper);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:12px;position:relative}
.ajb-epc figure{position:relative;overflow:hidden;aspect-ratio:16/9;border-radius:4px;background:var(--aj-brand)}
.ajb-epc figure a{display:block;height:100%}
.ajb-epc figure img{width:100%;height:100%;object-fit:cover}
.ajb-epc figure:after{content:"";position:absolute;left:12px;bottom:12px;width:44px;height:44px;border-radius:50%;background:var(--aj-al);pointer-events:none}
.ajb-epc figure:before{content:"";position:absolute;z-index:1;left:27px;bottom:23px;border-left:14px solid var(--aj-ink);border-top:9px solid transparent;border-bottom:9px solid transparent;pointer-events:none}
.ajb-epn{font:700 16px/24px var(--aj-ft)}
.ajb-epr{font:400 13px/18px var(--aj-ft);color:var(--aj-muted)}
.ajb-ept,.ajb-ept a{font-size:15px;line-height:22px;color:var(--aj-ink);text-decoration:none}
.ajb-ept a:hover{text-decoration:underline}

/* stappen en prijzen */
.ajb-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:32px}
.ajb-step{display:flex;flex-direction:column;gap:8px}
.ajb-step p{font-size:15px;line-height:22px}
.ajb-prices{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.ajb-price{border:2px solid var(--aj-brand);border-radius:12px;padding:24px;display:flex;flex-direction:column;gap:12px}
.ajb-price p{font-size:15px;line-height:22px}
.ajb-price .ajb-amt{font-size:18px;line-height:28px;font-weight:700;color:var(--aj-brand)}
.ajb-price .ajb-amt em{font-style:normal;font-weight:400}
.ajb-price.ajb-feat{background:var(--aj-brand);color:var(--aj-paper)}
.ajb-price.ajb-feat .ajb-amt{color:var(--aj-al)}
.ajb-cta-in{display:flex;flex-direction:column;gap:28px;align-items:flex-start}
.ajb-cta-in .ajb-h2{max-width:760px}

@media (max-width:767px){
.ajb-pad{padding-top:56px;padding-bottom:56px}
.ajb-pad-low{padding-bottom:56px}
.ajb-h2{font-size:32px;line-height:36px}
.ajb-hl-text .ajb-h3l{font-size:28px;line-height:32px}
.ajb-big{font-size:40px;line-height:44px}
.ajb-cutout{order:2}
}

/* contactpaneel */
.ajp-ov{display:none;position:fixed;inset:0;background:rgba(12,28,40,.6);z-index:9998;opacity:0;transition:opacity .25s}
.ajp{display:none;position:fixed;top:0;right:0;bottom:0;width:min(460px,100vw);background:var(--aj-paper);color:var(--aj-ink);z-index:9999;overflow-y:auto;transform:translateX(100%);transition:transform .3s ease;box-shadow:-8px 0 32px rgba(12,28,40,.25);font:400 16px/24px var(--aj-ft)}
.ajp-x{position:absolute;top:28px;right:clamp(20px,5vw,40px);width:44px;height:44px;border-radius:50%;border:2px solid var(--aj-brand);background:transparent;color:var(--aj-brand);cursor:pointer;font-size:22px;line-height:1;padding:0}
.ajp-in{padding:32px clamp(20px,5vw,40px);display:flex;flex-direction:column;gap:24px}
.ajp-in :where(h2,h3,p,ul){margin:0}
.ajp-in .ajb-lbl{padding-right:56px}
.ajp-h{font:800 28px/34px var(--aj-fd);letter-spacing:-.015em;padding-right:56px}
.ajp-in .wp-block-buttons{display:flex;flex-wrap:wrap;gap:12px}
.ajp-in .wp-block-button .wp-block-button__link{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border:2px solid var(--aj-brand);border-radius:999px;background:none;color:var(--aj-brand);font:700 15px/1 var(--aj-ft);text-decoration:none}
.ajp-form{display:flex;flex-direction:column;gap:16px}
.ajp-form label{display:flex;flex-direction:column;gap:6px}
.ajp-form label span{font:700 12px/16px var(--aj-ft);letter-spacing:.14em;text-transform:uppercase;color:var(--aj-muted)}
.ajp-form input[type=text],.ajp-form input[type=email],.ajp-form textarea{width:100%;box-sizing:border-box;min-height:48px;padding:0 14px;border:2px solid var(--aj-brand);border-radius:4px;background:#fff;color:var(--aj-ink);font:400 16px var(--aj-ft)}
.ajp-form textarea{min-height:96px;padding:12px 14px;resize:vertical}
.ajp-form button[type=submit]{align-self:flex-start;min-height:48px;padding:0 28px;border:0;border-radius:999px;background:var(--aj-accent);color:#fff;font:700 16px/1 var(--aj-ft);cursor:pointer}
.ajp-form button[type=submit]:disabled{opacity:.6}
.ajp-hp{position:absolute;left:-9999px;height:0;width:0;opacity:0}
.ajp-err{margin:0;font:700 15px var(--aj-ft);color:var(--aj-accent)}
.ajp-thanks{display:flex;gap:14px;align-items:flex-start}
.ajp-thanks[hidden]{display:none}
.ajp-thanks>i{width:12px;height:12px;border-radius:50%;background:var(--aj-accent);flex:none;margin-top:12px}
.ajp-t1{margin:0;font:800 32px/1.05 var(--aj-fd);letter-spacing:-.015em;color:var(--aj-ink)}
.ajp-t2{margin:8px 0 16px;font:400 17px/1.55 var(--aj-ft);color:var(--aj-muted)}
.ajp-t3{display:inline-flex;gap:8px;align-items:center;font:700 15px/1 var(--aj-ft);color:var(--aj-brand);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:5px;padding:6px 0}
.ajp-t3:focus-visible{outline:2px solid var(--aj-brand);outline-offset:3px}
.ajp-more{margin-top:8px;padding-top:32px;border-top:1px solid rgba(12,28,40,.2);display:flex;flex-direction:column;gap:32px}
.ajp-who{display:flex;align-items:center;justify-content:space-between;gap:16px}
.ajp-who .ajp-q{font:800 26px/30px var(--aj-fd);letter-spacing:-.01em}
.ajp-round{flex:none;width:104px;height:104px;border-radius:50%;overflow:hidden;position:relative;background:var(--aj-mist)}
.ajp-round figure{position:absolute;inset:0}
.ajp-round img{position:absolute;max-width:none;width:279%;height:auto;left:-94.4%;top:-41.3%}
.ajp-box{background:var(--aj-mist);border-radius:12px;padding:24px;display:flex;flex-direction:column;gap:12px}
.ajp-box ul{padding-left:20px;font-size:15px;line-height:22px;display:flex;flex-direction:column;gap:8px}
